.hero {
  display: flex;
  min-height: 446px;
  flex-direction: column;
  justify-content: flex-start;
  --tw-bg-opacity: 1;
  background-color: rgb(36 42 49 / var(--tw-bg-opacity));
  padding-top: 2rem;
  padding-bottom: 2rem
}

@media (min-width: 768px) {
  .hero {
      min-height:736px;
      justify-content: flex-end;
      padding-bottom: 120px
  }
}

@media (min-width: 1024px) {
  .hero {
      padding-bottom:72px
  }
}

@media (min-width: 1366px) {
  .hero {
      min-height:490px
  }
}

@media (min-width: 1920px) {
  .hero {
      min-height:720px;
      padding-bottom: 84px
  }
}

.hero {
  background-repeat: no-repeat;
  background-image: url(../assets/hero/hero-2560.png);
  background-size: auto 100%;
  background-position-y: bottom;
  background-position-x: 48%
}

@media (min-width: 768px) {
  .hero {
      background-image:url(../assets/hero/hero-2560.png);
      background-position-x: 50%;
      background-size: auto 800px
  }
}

@media (min-width: 1366px) {
  .hero {
      background-position-x:50%;
      background-size: auto 115%
  }
}

.hero__text-wrap {
  max-width: 340px;
  border-left-width: 2px;
  --tw-border-opacity: 1;
  border-color: rgb(255 129 46 / var(--tw-border-opacity));
  padding-top: .75rem;
  padding-bottom: .75rem;
  padding-left: 14px
}

@media (min-width: 768px) {
  .hero__text-wrap {
      border-left-width:4px;
      padding-left: 22px
  }
}

@media (min-width: 1024px) {
  .hero__text-wrap {
      max-width:390px;
      padding-left: 1.75rem
  }
}

@media (min-width: 1920px) {
  .hero__text-wrap {
      max-width:430px
  }
}

.about-card {
  position: relative;
  display: grid;
  height: auto;
  min-height: 380px;
  border-radius: .5rem;
  --tw-bg-opacity: 1;
  background-color: rgb(29 33 40 / var(--tw-bg-opacity));
  letter-spacing: .36px;
  color: rgb(228 228 228 / var(--tw-text-opacity));
  --tw-text-opacity: .7
}

@media (min-width: 1366px) {
  .about-card {
      font-size:18px;
      font-weight: 400;
      line-height: 1.5
  }
}

@media (min-width: 1920px) {
  .about-card {
      min-height:408px
  }
}

.about-card.active .about-card__rotate {
  transform: rotateY(180deg)
}

@media (min-width: 1024px) {
  .about-card:hover .about-card__rotate {
      transform:rotateY(180deg)
  }
}

.about-card__rotate {
  position: relative;
  transform-style: preserve-3d;
  transition: transform .3s ease 0s
}

.about-card__front {
  backface-visibility: hidden;
  transition: all .5s ease-in 0s;
  display: grid;
  width: 100%;
  gap: 2.75rem
}

@media (min-width: 1366px) {
  .about-card__front {
      gap:38px
  }
}

.about-card__back {
  transform: rotateY(180deg);
  backface-visibility: hidden;
  transition: all .5s ease-in 0s;
  position: absolute;
  top: 0;
  left: 0;
  display: grid;
  height: 100%;
  width: 100%;
  align-content: flex-start;
  align-items: flex-start;
  gap: 1.5rem
}

.about-card__back .about-card__title {
  --tw-text-opacity: 1;
  color: rgb(255 129 46 / var(--tw-text-opacity))
}

.about-card__front,.about-card__back {
  height: 100%;
  padding: 1.75rem 1.5rem
}

@media (min-width: 1920px) {
  .about-card__front,.about-card__back {
      padding:2rem
  }
}

.about-card__title {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: .36px;
  --tw-text-opacity: 1;
  color: rgb(228 228 228 / var(--tw-text-opacity))
}

@media (min-width: 1920px) {
  .about-card__title {
      font-size:20px;
      letter-spacing: .4px
  }
}

.about-card__image {
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: 0
}

.about-card-slider {
  position: relative;
  display: grid;
  height: auto;
  min-height: 414px;
  --tw-bg-opacity: 1;
  background-color: rgb(29 33 40 / var(--tw-bg-opacity));
  padding: 1.25rem;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: .28px;
  color: rgb(228 228 228 / var(--tw-text-opacity));
  --tw-text-opacity: .7
}

.about-card-slider__title {
  margin-bottom: .75rem;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: .36px
}

.about-card-slider__image {
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: 0
}

.about__container {
  padding-top: 2.5rem;
  padding-bottom: 2.5rem
}

@media (min-width: 768px) {
  .about__container {
      padding-top:5rem
  }
}

@media (min-width: 1366px) {
  .about__container {
      padding-bottom:5rem
  }
}

@media (min-width: 1920px) {
  .about__container {
      padding-top:120px
  }
}

.swiper-slide {
  height: auto!important;
  max-width: 320px
}

.about__slider {
  width: 100%
}

@media (min-width: 1366px) {
  .about__list {
      grid-template-columns:1fr 1fr 1fr 1fr;
      gap: 30px
  }
}

.swiper-scrollbar-container {
  margin-left: auto;
  margin-right: auto;
  margin-top: 2rem;
  height: .25rem;
  max-width: 240px;
  border-radius: .5rem;
  --tw-bg-opacity: 1;
  background-color: rgb(29 33 40 / var(--tw-bg-opacity));
  padding: 1px
}

.swiper-scrollbar-drag {
  height: 2px;
  border-radius: .125rem;
  background-color: rgb(228 228 228 / var(--tw-bg-opacity));
  --tw-bg-opacity: .7
}

.accordion {
  background-color: transparent;
  padding: 0
}

.accordion .info {
  display: flex;
  flex-direction: column;
  gap: .75rem;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.5
}

@media (min-width: 768px) {
  .accordion .info {
      font-size:18px
  }
}

.accordion .info__title {
  font-size: 16px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: .32px
}

@media (min-width: 768px) {
  .accordion .info__title {
      font-size:18px;
      font-weight: 700;
      line-height: 1.3
  }
}

@media (min-width: 1366px) {
  .accordion .info__title {
      font-size:20px;
      line-height: 1.3;
      letter-spacing: .4px
  }
}

.accordion .info__item {
  display: flex;
  align-items: flex-start;
  gap: .75rem
}

.accordion .info__item:before {
  margin-top: 6px;
  height: 11px;
  width: 6px;
  flex-shrink: 0;
  background-image: url(../assets/ic_list-arrow.svg);
  --tw-content: "";
  content: var(--tw-content)
}

.accordion .info__list {
  display: flex;
  flex-direction: column;
  gap: .5rem
}

.accordion.is-active .accordion__icon {
  --tw-rotate: -180deg;
  transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.accordion__info:not(:last-child) {
  border-bottom-width: 1px;
  border-color: rgb(228 228 228 / var(--tw-border-opacity));
  --tw-border-opacity: .3;
  padding-bottom: 19px
}

@media (min-width: 768px) {
  .accordion__info:not(:last-child) {
      padding-bottom:23px
  }
}

.accordion__head {
  position: relative;
  display: flex;
  width: 100%;
  cursor: pointer;
  align-items: center;
  justify-content: space-between;
  -moz-column-gap: .5rem;
  column-gap: .5rem;
  border-radius: .25rem;
  --tw-bg-opacity: 1;
  background-color: rgb(29 33 40 / var(--tw-bg-opacity));
  padding: .5rem
}

@media (min-width: 375px) {
  .accordion__head {
      -moz-column-gap:1rem;
      column-gap: 1rem;
      padding-right: 1rem;
      padding-left: 1.75rem
  }
}

@media (min-width: 768px) {
  .accordion__head {
      -moz-column-gap:1.5rem;
      column-gap: 1.5rem;
      border-radius: .5rem;
      padding: 1.5rem 1.5rem 1.5rem 2.5rem
  }
}

@media (min-width: 1920px) {
  .accordion__head {
      padding-left:52px;
      padding-right: 52px;
      padding-top: 1.75rem;
      padding-bottom: 1.5rem
  }
}

.accordion__content {
  display: flex;
  flex-direction: column;
  gap: 22px
}

@media (min-width: 768px) {
  .accordion__content {
      gap:1.5rem
  }
}

.accordion__icon {
  display: grid;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  justify-items: center;
  padding: .75rem;
  transition-property: all;
  transition-timing-function: cubic-bezier(.4,0,.2,1);
  transition-duration: .15s
}

.accordion__title {
  max-width: 210px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 18px;
  line-height: 1.5;
  letter-spacing: .36px
}

@media (min-width: 375px) {
  .accordion__title {
      max-width:235px
  }
}

@media (min-width: 768px) {
  .accordion__title {
      max-width:100%;
      font-size: 24px;
      line-height: 1.3;
      letter-spacing: .48px
  }
}

@media (min-width: 1920px) {
  .accordion__title {
      font-size:32px;
      letter-spacing: .64px
  }
}

.accordion__wrap {
  margin-top: 5px;
  display: grid;
  gap: 2rem;
  border-radius: .25rem;
  --tw-bg-opacity: 1;
  background-color: rgb(29 33 40 / var(--tw-bg-opacity));
  padding: 1.5rem 1.5rem 1.5rem 1.75rem
}

@media (min-width: 768px) {
  .accordion__wrap {
      margin-top:.5rem;
      border-radius: .5rem;
      padding: 2.5rem;
      padding-top: 34px
  }
}

@media (min-width: 1920px) {
  .accordion__wrap {
      padding-left:52px;
      padding-right: 52px;
      padding-top: 34px;
      padding-bottom: 2.5rem
  }
}

[data-accordion=element].is-active>[data-accordion=content] {
  max-height: 100%
}

[data-accordion=parent].no-transition [data-accordion=content] {
  transition: none
}

[data-accordion=content] {
  max-height: 0;
  transition: max-height .3s;
  overflow: hidden
}

app-map {
  position: relative;
  z-index: 1;
  display: block;
  height: 100%;
  width: 100%
}

app-map .map {
  background-color: transparent;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%
}

.leaflet-right {
  display: none!important
}

.input-field:not(.input-field__file) .input-field__input {
  display: block;
  min-height: 60px;
  width: 100%;
  border-radius: .5rem;
  --tw-bg-opacity: 1;
  background-color: rgb(29 33 40 / var(--tw-bg-opacity));
  padding: 1rem 1.5rem;
  font-size: 18px;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: .36px;
  --tw-text-opacity: 1;
  color: rgb(228 228 228 / var(--tw-text-opacity));
  caret-color: #e4e4e4;
  outline-width: 0px
}

.input-field--file .input-field__input {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border-width: 0
}

.input-field--file .input-field__label {
  position: relative;
  display: flex;
  min-height: 60px;
  cursor: pointer;
  justify-content: flex-start;
  gap: .5rem;
  background-color: rgb(63 143 253 / var(--tw-bg-opacity));
  --tw-bg-opacity: .05;
  padding-top: 1rem;
  padding-bottom: 1.25rem;
  padding-left: 1.75rem;
  padding-right: 62px;
  --tw-text-opacity: 1;
  color: rgb(18 40 71 / var(--tw-text-opacity));
  --tw-text-opacity: 28%
}

.input-field--file .input-field__label-text {
  max-width: 160px;
  flex: 1 1 auto;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 1.125rem;
  line-height: 1.75rem;
  line-height: 1.3
}

@media (min-width: 768px) {
  .input-field--file .input-field__label-text {
      max-width:100%
  }
}

.input-field--file .input__file-icon-wrapper {
  position: absolute;
  top: .75rem;
  right: 18px;
  flex-shrink: 0
}

.input-field--file .input-field__button {
  display: none
}

#user-file:hover+.input-field__label {
  --tw-bg-opacity: .1
}

.input-field__button {
  position: absolute;
  right: .75rem;
  top: 50%;
  z-index: 1;
  display: none;
  --tw-translate-y: -50%;
  transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.input-field__button:hover {
  --tw-text-opacity: .6
}

.input-field__title {
  margin-bottom: .5rem;
  font-size: 14px;
  line-height: 1.4;
  letter-spacing: .28px;
  --tw-text-opacity: 1;
  color: rgb(228 228 228 / var(--tw-text-opacity))
}

.input-field__title-optional {
  margin-left: .25rem;
  color: rgb(228 228 228 / var(--tw-text-opacity));
  --tw-text-opacity: .5
}

.input-field__required {
  margin-left: .25rem;
  --tw-text-opacity: 1;
  color: rgb(230 16 16 / var(--tw-text-opacity))
}

.input-field__info {
  position: absolute;
  margin-top: .5rem;
  align-items: center;
  gap: .5rem;
  font-weight: 300
}

.input-field:not(.input-field--file) .input-field__input::-moz-placeholder {
  font-weight: 400;
  color: rgb(228 228 228 / var(--tw-text-opacity));
  --tw-text-opacity: .3
}

.input-field:not(.input-field--file) .input-field__input::placeholder {
  font-weight: 400;
  color: rgb(228 228 228 / var(--tw-text-opacity));
  --tw-text-opacity: .3
}

.input-field:not(.input-field--file) .input-field__input:hover,.input-field:not(.input-field--file) .input-field__input:focus {
  --tw-bg-opacity: 1;
  background-color: rgb(36 42 49 / var(--tw-bg-opacity))
}

.input-field--status-ok:not(.input-field--file) .input-field__input {
  background-image: url(../assets/ic_input-ok.svg);
  background-repeat: no-repeat;
  background-position: calc(100% - 12px) center
}

.input-field:not(.input-field--file) .input-field__input:focus::-moz-placeholder {
  opacity: 0
}

.input-field:not(.input-field--file) .input-field__input:focus::placeholder {
  opacity: 0
}

.input-field__wrap {
  position: relative;
  display: flex;
  width: 100%;
  flex-direction: column
}

textarea.input-field__input {
  height: 108px;
  resize: none;
  padding-right: 60px
}

.input-field__helper-text {
  visibility: hidden;
  display: block;
  min-height: 20px;
  text-align: left;
  font-size: 14px;
  line-height: 1.4;
  --tw-text-opacity: 1;
  color: rgb(230 16 16 / var(--tw-text-opacity));
  opacity: 0;
  transition-property: all;
  transition-timing-function: cubic-bezier(.4,0,.2,1);
  transition-duration: .15s
}

.input-field.input-field--error:not(.input-field--file) .input-field__button {
  display: flex
}

.input-field.input-field--error .input-field__input {
  --tw-border-opacity: 1;
  border-color: rgb(230 16 16 / var(--tw-border-opacity))
}

.input-field.input-field--error .input-field__label {
  background-color: rgb(230 16 16 / var(--tw-bg-opacity));
  --tw-bg-opacity: .1
}

.input-field.input-field--error .input-field__helper-text {
  visibility: visible;
  opacity: 1
}

.checkbox input[type=checkbox] {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border-width: 0
}

.checkbox {
  display: flex;
  cursor: pointer;
  align-items: flex-start;
  gap: .75rem
}

@media (min-width: 1024px) {
  .checkbox {
      align-items:center
  }
}

.checkbox:hover .checkbox__check {
  --tw-border-opacity: .7
}

.checkbox__check {
  position: relative;
  display: flex;
  height: 1.75rem;
  width: 1.75rem;
  flex-shrink: 0;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-radius: .25rem;
  border-width: 1px;
  border-style: solid;
  border-color: rgb(228 228 228 / var(--tw-border-opacity));
  --tw-border-opacity: .3;
  background-color: transparent;
  color: transparent;
  transition-property: color,background-color,border-color,text-decoration-color,fill,stroke;
  transition-duration: .3s;
  transition-timing-function: cubic-bezier(.4,0,.2,1)
}

.checkbox input.error+.checkbox__check {
  --tw-border-opacity: 1;
  border-color: rgb(230 16 16 / var(--tw-border-opacity))
}

.checkbox__check:before {
  position: absolute;
  inset: 0;
  z-index: 10;
  --tw-translate-x: 0px;
  transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  background-color: transparent;
  transition-property: transform;
  transition-duration: .3s;
  transition-timing-function: cubic-bezier(.4,0,.2,1);
  --tw-content: "";
  content: var(--tw-content)
}

.checkbox [type=checkbox]:checked+.checkbox__check {
  --tw-border-opacity: 1;
  border-color: rgb(255 255 255 / var(--tw-border-opacity));
  --tw-text-opacity: 1;
  color: rgb(228 228 228 / var(--tw-text-opacity))
}

.checkbox [type=checkbox]:checked+.checkbox__check:before {
  --tw-translate-x: 100%;
  transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.checkbox__label {
  font-size: 14px;
  line-height: 1.4;
  letter-spacing: .28px;
  color: rgb(228 228 228 / var(--tw-text-opacity));
  --tw-text-opacity: .7
}

.checkbox__label a {
  --tw-text-opacity: 1;
  color: rgb(228 228 228 / var(--tw-text-opacity));
  text-decoration-line: underline;
  text-underline-offset: 4px
}

.contact-form {
  display: grid;
  width: 100%;
  gap: .5rem
}

.contact-form__inputs {
  display: grid;
  gap: 2px
}

.price {
  --tw-bg-opacity: 1;
  background-color: rgb(29 33 40 / var(--tw-bg-opacity));
  background-image: url(../assets/img/price-bg.png);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 1256px 560px
}

@media (min-width: 1920px) {
  .price {
      background-position-x:calc(50% + 468px)
  }
}

.price__container {
  padding-top: 5rem;
  padding-bottom: 5rem
}

@media (min-width: 768px) {
  .price__container {
      padding-top:120px;
      padding-bottom: 120px
  }
}

@media (min-width: 1366px) {
  .price__container {
      display:grid;
      grid-template-columns: 600px 496px;
      align-items: center;
      justify-content: space-between;
      padding-top: 5rem;
      padding-bottom: 5rem
  }
}

@media (min-width: 1920px) {
  .price__container {
      grid-template-columns:920px 496px
  }
}

.page-main {
  position: relative;
  z-index: 1
}

.container {
  transition: padding .3s ease 0s,width .3s ease 0s
}
