.title-wrapper h1 {
  margin-bottom: 0.4em;
}

.top-photo {
  position: relative;
  width: 100%;
  height: 38.9em;
  border-radius: var(--border-radius);
  overflow: hidden;
}

.top-photo > .title-wrapper {
  position: absolute;
  bottom: 0;
  right: 0;
  padding: 1em 2em 1.5em;
  background-color: var(--color-orange);
  color: #fff;
  border-radius: 0.7em 0 0 0;
  top: initial;
  width: 47%;
}

.top-photo .title-wrapper h3 {
  white-space: break-spaces;
  line-height: 1.4em;
}

.top-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  top: 0;
  left: 0;
}

.top-photo > div {
  position: relative;
  top: 5.55em;
}

.top-photo div.bg-image {
  width: 100%;
  height: 39em;
  position: absolute;
  top: 0;
  left: 0;
  background-repeat: no-repeat;
}

.prices__cards {
  flex-wrap: wrap;
  justify-content: space-between;
}

.prices__card {
  width: calc(25% - 1.5em);
  height: 22.2em;
  box-shadow: rgba(65, 39, 22, 0.1) 0 0 20px;
  border-radius: var(--border-radius);
  overflow: hidden;
  margin-top: 1.4em;
}

.container.prices {
  max-width: 1530px;
  margin: auto;
}

.container.prices .btn-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 4.4em 0 6.6em;
}

.btn-wrapper.mobile {
  display: none;
}

.prices__card .prices__card-title {
  padding: 2em 1.3em 0;
  font-size: 1.3em;
  font-weight: 500;
  margin-bottom: 0.6em;
}

.prices__card .prices__card-text {
  padding: 0 1.7em;
  font-size: 0.9em;
}

.prices__card .prices__card-price {
  padding: 0 1.7em;
  height: 5.5em;
  color: #fff;
  background-color: var(--color-green-action);
  display: flex;
  align-items: center;
}

.prices__card > div {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;

}

.owl-carousel.owl-carousel-prices {
  display: flex;
}

.gim-shop {
  justify-content: space-between;
  gap: 1em;
}

.gim-card {
  width: 41.6em;
  height: 41.6em;
  border-radius: var(--border-radius);
  overflow: hidden;
  position: relative;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}

.gim-card .top-txt {
  background-color: var(--color-orange);
  color: #fff;
  text-align: center;
  height: 4.7em;
  align-items: center;
  display: flex;
  padding: 0 4em;
  font-size: 1.3em;
}
.gim-card .bottom-txt .photo-title {
  position: absolute;
  bottom: 0;
  text-align: center;
  color: #fff;
  height: 4.7em;
  align-items: center;
  display: flex;
  padding: 0 4em;
  font-size: 1.3em;
  width: 100%;
}

.container.vk {
  background-color: #F8F8F8;
  padding: 5.5em 0;
}

.container.vk .img-wrapper {
  max-width: 1530px;
  margin: auto;
  border-radius: var(--border-radius);
  position: relative;
  background-color: #fff;
  box-shadow: rgba(65, 39, 22, 0.1) 0 0 20px;
  display: flex;
}

.container.vk .img-wrapper div {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 2em;
  gap: 2.22em;
  z-index: 10;
  position: relative;
  background-color: #fff;
  border-radius: var(--border-radius);
}

.container.vk .img-wrapper div.vk-img {
  width: 62em;
  height: 30.3em;
  background-size: 100%;
  z-index: 10;
	background-repeat: none;
}

.container.vk .img-wrapper div h2 {
  font-size: 1.78em;
}
.container.vk .img-wrapper div button,
.container.vk .img-wrapper div a {
  width: 100%;
}

.container.vk img {
  width: 62em;
  z-index: 10;
  position: relative;
  border-radius: var(--border-radius) 0 0 var(--border-radius);
}

.container.vk .img-wrapper:before {
  position: absolute;
  left: -5.3em;
  top: -4.3em;
  background-image: url(../img/trace_small.svg);
  background-size: 11em 11em;
  display: inline-block;
  content: '';
  width: 11em;
  height: 11em;
  background-repeat: no-repeat;
  z-index: 0;
}

.container.vk .img-wrapper:after {
  position: absolute;
  right: -5.2em;
  bottom: -4.3em;
  background-image: url(../img/trace_small.svg);
  background-size: 11em 11em;
  display: inline-block;
  content: '';
  width: 11em;
  height: 11em;
  background-repeat: no-repeat;
  z-index: 0;
}

.container.lessons {
  height: 33.3em;
  background-color: var(--color-green-1);
  color: #fff;
  display: flex;
  justify-content: space-between;
  border-radius: var(--border-radius);
  overflow: hidden;
  margin-top: 4em;
}

.container.lessons > div {
  padding: 6.6em 3.3em;
}

.container.lessons img {
  width: 36em;
}

.container.lessons ul {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  padding: 0;
  margin: 0;
}
.container.lessons ul li {
  width: 100%;
  line-height: 2.2em;
  font-size: 1.3em;
  position: relative;
  display: flex;
  align-items: center;
}

.container.lessons li:before {
  position: relative;
  background-image: url(../img/trace-green.svg);
  background-size: 1.1em 1.1em;
  display: inline-block;
  content: '';
  width: 1.1em;
  height: 1.1em;
  background-repeat: no-repeat;
  z-index: 10;
  margin-right: 0.1em;
}

.ul-wrapper {
  display: flex;
}

.advantages-gallery {
  display: flex;
  gap: 1.7em;
  flex-wrap: wrap;
  margin-top: 3.3em;
  justify-content: space-between;
}

.advantage-block {
  box-shadow: rgba(65, 39, 22, 0.1) 0 0 20px;
  border-radius: var(--border-radius);
  width: 32%;
  height: 20em;
  align-items: center;
  display: flex;
  text-align: center;
  padding: 2.8em 2em;
  flex-direction: column;
  gap: 2em;
}

.advantage-title {
  font-size: 1.33em;
}

.team-block__text-wrapper {
  display: flex;
  gap: 8.8em;
  margin-bottom: 3em;
}

.team-block__photo-wrapper {
  display: flex;
  gap: 1.7em;
  justify-content: space-between;
}

.team-block__photo-wrapper img {
  width: 30%;
  object-fit: cover;
  display: inline-block;
  border-radius: var(--border-radius);
}
.team-block__photo-wrapper img:first-child {
  width: 70%;
}


@media screen and (max-width: 600px) {
  .advantage-icon {
    width: 4em;
    height: 4em;
  }
  .advantage-title {
    font-size: 1.05em;
  }
  .advantage-block {
    width: 100%;
    height: 9.5em;
    flex-direction: row;
    text-align: left;
    gap: 1em;
  }
  .advantages-gallery {
    gap: 1.05em;
    margin-top: 2.1em;
  }

  #form {
    padding-top: 5em;
  }

  .section.header > .container:first-child {
    margin-top: 0;
  }

  .container.prices {
    max-width: 100%;
    padding-top: 3em;
  }
  .owl-carousel.owl-carousel-prices {
   display: block;
  }
  .top-photo {
    height: 48em;
  }
  .top-photo div.bg-image {
    background-position: 30% 100%;
    background-size: cover;
    height: 90%;
    bottom: 0;
    top: initial;
  }
  .top-photo > .title-wrapper {
    bottom: initial;
    right: 0;
    padding: 1em 1em 1.4em;
    top: initial;
    width: 100%;
    text-align: center;
  }

  .top-photo .title-wrapper h3 {
    font-size: 1.15em;
  }

  .gim-shop {
    flex-direction: column;
    gap: 1em;
  }

  .gim-card {
    height: 35em;
    width: 100%;
    background-position: bottom center;
  }

  .gim-card .top-txt,
  .gim-card .bottom-txt .photo-title {
    padding: 0 1.3em;
    font-size: 1.3em;
    line-height: 1.3em;
  }
  .prices__card {
    width: 65vw;
  }

  .prices__cards .owl-item.active {
    left: 1.22em;
  }

  .container.prices .btn-wrapper {
    display: none;
  }

  .btn-wrapper.mobile {
    display: block;
    margin-top: 2.5em;
  }

  .prices .owl-theme .owl-nav button {
    margin: 0 0.28em 0 0;
  }

  .prices .owl-theme .owl-nav {
    display: flex;
    margin: 1.87em 1.22em 2.5em;
  }

  .prices .owl-theme .owl-dots .owl-dot span {
    background-color: var(--color-green-1);
  }
  .prices .owl-theme .owl-dots .owl-dot.active span {
    background-color: var(--color-green-action);
  }

  .owl-carousel .owl-nav button.owl-next,
  .owl-carousel .owl-nav button.owl-prev {
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    font: inherit;
    width: 1.5em;
    height: 1.5em;
    border-radius: 50%;
    font-size: 2em;
    background: var(--color-green-action);
    color: #fff;
    font-weight: 300;
    padding-bottom: 0.06em !important;
  }

  .owl-carousel .owl-nav button.owl-next:hover,
  .owl-carousel .owl-nav button.owl-prev:hover {
    background: var(--color-green-action-hover);
  }

  .owl-carousel .owl-nav button.owl-next:active,
  .owl-carousel .owl-nav button.owl-prev:active {
    background: var(--color-green-action-active);
  }
  .container.vk {
    margin-bottom: 4.3em;
    overflow: hidden;
  }
  .container.vk .img-wrapper {
    flex-direction: column;
    margin: 0 1.22em;
    max-width: calc(100% - 2.44em);
  }

  .container.vk .img-wrapper:after {
    right: -2em;
    bottom: -5.1em;
    background-image: url(../img/trace_small.svg);
    background-size: 9em 9em;
    width: 9em;
    height: 9em;
  }

  .container.vk .img-wrapper:before {
    background-image: url(../img/trace_small.svg);
    background-size: 9em 9em;
    width: 9em;
    height: 9em;
    left: -1.5em;
    top: -5.5em;
  }

  .container.vk .img-wrapper div h2 {
    font-size: 1em;
  }

  .container.vk .img-wrapper div {
    padding: 1.2em;
    gap: 1.9em;
  }

  .container.vk .img-wrapper div.vk-img {
    width: 100%;
    height: 20em;
    background-size: 100%;
    background-repeat: no-repeat;
    padding: 0;
    border-radius: var(--border-radius);
  }

  .container.lessons {
    flex-direction: column-reverse;
    height: auto;
  }

  .container.lessons > div {
    padding: 1.4em 1.9em;
  }

  .ul-wrapper {
    flex-direction: column;
  }

  .container.lessons ul {
    flex-direction: column;
  }

  .container.lessons ul li {
    width: 100%;
  }

  .container.lessons {
    margin-bottom: 5em;
  }
  .team-block__text-wrapper {
    gap: 2em;
    margin-bottom: 3em;
    flex-direction: column;
  }
  .team-block__photo-wrapper {
    flex-direction: column;
  }
  .team-block__photo-wrapper img {
    width: 100% !important;
    height: 25em;
    object-position: top;
  }
}

@media only screen and (max-width: 350px) and (orientation: portrait) {
  .gim-card .top-txt, .gim-card .bottom-txt .photo-title {
    font-size: 1.1em;
  }
}

@media only screen and (max-width: 1000px) and (orientation: landscape) {
  .top-photo {
    height: 90vh;
  }

  .team-block__text-wrapper {
    gap: 1.5em;
  }
  .team-block__photo-wrapper {
    width: calc(100vw - 4.2em);
  }


  .top-photo div.bg-image {
    background-size: 100%;
  }

  .prices__card {
    width: calc(100% - 1.5em);
    height: calc(80vh - 1.5em);
  }

  .container.prices {
    width: 100%;
    padding: 0 1.22em;
  }

  .container.vk .img-wrapper {
    flex-direction: column;
    margin: 0 1.5em;
  }

  .container.vk, .container.vk .img-wrapper div.vk-img {
    width: 100%;
    min-width: initial;
  }

  .gim-shop {
    flex-direction: column;
  }
  .gim-card {
    width: 100%;
  }

  .container.vk .img-wrapper:after,
  .container.vk .img-wrapper:before {
    display: none;
  }

  .container.lessons {
    height: 90vh;
  }

  .ul-wrapper {
    gap: 1em;
  }

  .container.lessons ul li {
    line-height: 1.5em;
    font-size: 1em;
  }

  .container.lessons > div {
    padding: 2.5em 2.3em;
  }

  .container.lessons > div > h1 {
    font-size: 1.6em;
  }

  .container.lessons img {
    width: 40vw;
    object-fit: cover;
  }

  .prices .owl-theme .owl-nav button {
    margin: 0 0.28em 0 0;
  }

  .prices .owl-theme .owl-nav {
    display: flex;
    margin: 1em 0 2.5em;
  }

  .owl-carousel .owl-stage-outer {
    height: 80vh;
  }

  .prices .owl-theme .owl-dots .owl-dot span {
    background-color: var(--color-green-1);
  }
  .prices .owl-theme .owl-dots .owl-dot.active span {
    background-color: var(--color-green-action);
  }

  .owl-carousel .owl-nav button.owl-next,
  .owl-carousel .owl-nav button.owl-prev {
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    font: inherit;
    width: 1.5em;
    height: 1.5em;
    border-radius: 50%;
    font-size: 2em;
    background: var(--color-green-action);
    color: #fff;
    font-weight: 300;
    padding-bottom: 0.06em !important;
  }

  .owl-carousel .owl-nav button.owl-next:hover,
  .owl-carousel .owl-nav button.owl-prev:hover {
    background: var(--color-green-action-hover);
  }

  .owl-carousel .owl-nav button.owl-next:active,
  .owl-carousel .owl-nav button.owl-prev:active {
    background: var(--color-green-action-active);
  }

  .container.prices .btn-wrapper {
    display: none;
  }

  .btn-wrapper.mobile {
    display: block;
    margin-top: -4em;
    text-align: center;
  }

  .container.vk .img-wrapper div button, .container.vk .img-wrapper div a {
    width: initial;
  }
  .advantage-block {
    width: 100%;
    height: 90vh;
  }

}
