@import url(./css/fonts.css);

:root {
   --main: #F9DE56;
   --second: #EAECEB;
   --bg: #F6F7F8;
   --white: #fff;
   --black: #333333;
   --red: #FF8181;
}

/* Preloader */

.preloader {
   position: fixed;
   z-index: 5000;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background: var(--main);
   transition: 0.5s ease-in-out;
}

.preloader.hide {
   opacity: 0;
   visibility: hidden;
}

.loader {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   width: 100px;
   height: 100px;
}

@media (max-width: 991px) {
   .loader {
      width: 60px;
      height: 60px;
   }
}

.loader span {
   display: block;
   border: 0;
   margin: 0;
   width: 40%;
   height: 40%;
   position: absolute;
   border-radius: 50%;
   animation: spin 2s ease infinite;
   background: var(--black);
}

.loader *:first-child {
   animation-delay: -1.5s
}

.loader *:nth-child(2) {
   animation-delay: -1s
}

.loader *:nth-child(3) {
   animation-delay: -0.5s
}

@keyframes spin {

   0%,
   100% {
      transform: translate(0)
   }

   25% {
      transform: translate(160%)
   }

   50% {
      transform: translate(160%, 160%)
   }

   75% {
      transform: translate(0, 160%)
   }
}

/* /Preloader */

body {
   font-size: 16px;
   background: var(--bg);
   font-family: 'Gilroy';
   line-height: 1.21;
   user-select: none;
}

body.hidden {
   overflow: hidden;
}

.wrapper {
   display: flex;
   flex-direction: column;
   min-height: 100vh;
   position: relative;
   opacity: 0;
}

.wrapper.show{
   opacity: 1;
   transition: 0.3s ease;
}

@media (min-width: 1200px) {
   ::-webkit-scrollbar {
      width: 12px;
      height: 5px;
      background: var(--white);
   }

   ::-webkit-scrollbar-button {
      display: none;
   }

   ::-webkit-scrollbar-thumb {
      background: var(--black);
      border-radius: 50px;
      border: 3px solid transparent;
      background-clip: content-box;
   }
}

.form-control {
   background: transparent;
   border: 1px solid #E7E8EA;
   border-radius: 6px;
   font-size: 18px;
   font-weight: 500;
   line-height: 1.21;
   color: var(--black);
   height: auto;
   letter-spacing: 0.02em;
   padding: 1em;
   transition: 0.3s ease, background-position 0s;
}

@media (max-width: 991px) {
   .form-control {
      font-size: 15px;
   }
}

@media (max-width: 575px) {
   .form-control {
      padding: 13px 18px;
   }
}

.form-control:hover {
   border-color: var(--black)
}

.form-control:focus {
   border-color: var(--black)
}

.form-control.is-invalid,
.was-validated .form-control:invalid {
   /* border-color: var(--red); */
   border-color: #E7E8EA;
   background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23FF8181'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23FF8181' stroke='none'/%3e%3c/svg%3e");
}

.form-control.is-valid,
.was-validated .form-control:valid {
   /* border-color: #3ad466; */
   border-color: #E7E8EA;
   background-image: none;
}

.form-control.is-invalid:focus,
.was-validated .form-control:invalid:focus,
.form-control.is-valid:focus,
.was-validated .form-control:valid:focus {
   border-color: var(--black)
}

.form-control::placeholder {
   font-weight: 500;
   color: #999999;
   opacity: 1;
}

input:focus,
textarea:focus {
   box-shadow: none !important;
   outline: none;
}

.textarea {
   transition: height 0s !important;
}

input::placeholder,
textarea::placeholder {
   opacity: 1;
   font-weight: 500;
}

input,
textarea {
   font-family: 'Gilroy';
}

textarea {
   resize: none;
}

/* Btn */

.btn {
   font-size: 16px;
   line-height: 1.21;
   transition: 0.3s ease;
   background: transparent;
   border-radius: 0;
   color: var(--black);
   text-align: center;
   padding: 0;
   border: 0;
   font-weight: 600;
   letter-spacing: 0.02em;
}

.btn > span{
   font-size: 16px;
   line-height: 1.21;
   font-weight: 600;
   letter-spacing: 0.02em;
   color: var(--black);
   text-align: center;
   position: relative;
}

.btn:focus,
button:focus {
   box-shadow: none !important;
   outline: none;
}

.btn-main{
   background: var(--main);
   color: var(--black);
   padding: 10px 1em;
   border-radius: 6px;
   position: relative;
   overflow: hidden;
}
.btn-main:before{
   content: '';
   display: block;
   width: 0;
   height: 100%;
   opacity: 0;
   background: rgba(255,255,255,0.4);
   transform: translateX(-50%);
   transition: 0.4s ease;
   position: absolute;
   left: 50%;
   top: 0;
}
.btn-main:hover:before{
   opacity: 1;
   width: 110%;
}
.btn-secondary{
   background: var(--second);
   color: var(--black);
   padding: 10px 1em;
   border-radius: 6px;
   position: relative;
   overflow: hidden;
}
.btn-secondary:before{
   content: '';
   display: block;
   width: 0;
   height: 100%;
   opacity: 0;
   background: rgba(255,255,255,0.4);
   transform: translateX(-50%);
   transition: 0.4s ease;
   position: absolute;
   left: 50%;
   top: 0;
}
.btn-secondary:hover:before{
   opacity: 1;
   width: 110%;
}

/* Links */

a {
   color: #272727;
   text-decoration: none;
   transition: 0.3s ease;
}

a:hover {
   color: var(--black);
}

/* Titles */

h1,
h2,
h3,
h4,
h5,
h6 {
   margin: 0;
   line-height: 1.21;
   font-weight: 600;
}

.title {
   font-size: 48px;
   text-align: center;
   font-weight: 600;
   color: var(--black);
   letter-spacing: 0.02em;
   margin-bottom: 60px;
}

@media (max-width: 1329px) {
   .title {
      font-size: 40px;
   }
}

@media (max-width: 767px) {
   .title {
      font-size: 32px;
      margin-bottom: 40px;
   }
}

@media (max-width: 575px) {
   .title {
      font-size: 26px;
   }
}

/* Container */

._container {
   padding: 0 20px;
   width: 100%;
   max-width: 1330px;
   margin: 0 auto;
}

@media (max-width: 1329px) {
   ._container {
      max-width: 992px;
   }
}

@media (max-width: 991px) {
   ._container {
      max-width: 768px;
   }
}

@media (max-width: 767px) {
   ._container {
      max-width: 576px;
   }
}

@media (max-width: 575px) {
   ._container {
      max-width: 100%;
   }
}

/* Main */

.main {
   flex-grow: 1;
   padding-top: 70px;
}
@media (max-width: 575px) {
   .main {
      padding-top: 52px;
   }
}

/* Header */

.header {
   position: fixed;
   top: 0;
   left: 0;
   width: 100vw;
   z-index: 1000;
   transition: 0.3s ease;
   background: var(--white);
   box-shadow: 0px 4px 14px rgba(0, 0, 0, 0.08);
}
.header-body {
   display: flex;
   justify-content: space-between;
   align-items: center;
   padding: 13px 0;
}
@media (max-width: 575px) {
   .header-body {
      padding: 9px 0;
   }
}
.header-logo {
   display: flex;
}
.header-logo a{
   display: flex;
   height: 44px;
}
@media (max-width: 575px) {
   .header-logo a{
      height: 34px;
   }
}
.header-logo img{
   height: 100%;
}
@media (max-width: 991px) {
   .header-nav{
      display: none;
   }
}
.header-connect{
   list-style: none;
   padding-left: 0;
   margin-bottom: 0;
   display: flex;
   align-items: center;
   column-gap: 30px;
}
.header-connect li{
   display: flex;
}
.header-connect li a{
   display: flex;
   align-items: center;
   column-gap: 10px;
}
.header-connect li a svg{
   width: 30px;
   height: 30px;
   fill: #272727;
}
.header-connect li a span{
   font-size: 15px;
   font-weight: 500;
   transition: 0.3s ease;
   position: relative;
}
.header-connect li a span:after{
   content: '';
   position: absolute;
   display: block;
   bottom: -2px;
   left: 50%;
   height: 1px;
   width: 0;
   opacity: 0;
   transition: 0.3s ease;
   background: #272727;
   transform: translateX(-50%);
}
.header-connect li a:hover span:after{
   width: 100%;
   opacity: 1;
}
.header-call {
   display: none;
}
.header-action .btn,
.header-action .btn span{
   font-size: 14px;
}
@media (max-width: 991px) {
   .header-action{
      display: flex;
      align-items: center;
      column-gap: 20px;
   }
   .header-call {
      display: flex;
   }
   .header-call svg{
      width: 28px;
      height: 28px;
      fill: #272727;
   }
}
@media (max-width: 575px) {
   .header-action .btn{
      display: none;
   }
}

/* Header end */

/* Footer */

.footer {
   margin-top: 60px;
}
.footer-header {
   background: var(--white);
   padding: 13px 0;
}
@media (max-width: 575px) {
   .footer-header {
      padding: 9px 0;
   }
}
.footer-logo {
   display: flex;
}
.footer-logo a{
   display: flex;
   height: 44px;
}
@media (max-width: 575px) {
   .footer-logo a{
      height: 34px;
   }
}
.footer-logo a img{
   height: 100%;
}
.footer-body-body {
   display: flex;
   padding: 40px 0;
   column-gap: 85px;
}
@media (max-width: 1329px) {
   .footer-body-body {
      column-gap: 40px;
   }
}
@media (max-width: 991px) {
   .footer-body-body {
      flex-wrap: wrap;
      row-gap: 50px;
   }
}
@media (max-width: 575px) {
   .footer-body-body {
      padding: 40px 0 30px;
   }
}
.footer-body-col {
   flex-grow: 1;
}
.footer-body-col:first-child{
   width: 100%;
   max-width: 391px;
}
@media (max-width: 1329px) {
   .footer-body-col:nth-child(2){
      max-width: 400px;
   }
}
.footer-title {
   color: #717172;
   font-size: 16px;
   margin-bottom: 30px;
}
@media (max-width: 575px) {
   .footer-title {
      margin-bottom: 20px;
   }
}
.footer-main {
   list-style: none;
   padding-left: 0;
   margin-bottom: 0;
   display: flex;
   flex-direction: column;
   gap: 10px;
}
.footer-main li{
   font-size: 14px;
   line-height: 1.5;
   color: #949495;
}
@media (max-width: 575px) {
   .footer-main li{
      font-size: 12px;
   }
}
.footer-text {
   font-size: 14px;
   line-height: 1.5;
   color: #949495;
   margin-bottom: 0;
}
@media (max-width: 575px) {
   .footer-text {
      font-size: 12px;
   }
}
.footer-contact{
   list-style: none;
   padding-left: 0;
   margin-bottom: 0;
   display: flex;
   flex-direction: column;
   gap: 20px;
}
@media (max-width: 575px) {
   .footer-contact{
      gap: 15px;
   }
}
.footer-contact li{
   display: flex;
}
.footer-contact li a{
   display: flex;
   align-items: center;
   column-gap: 10px;
}
.footer-contact li a svg{
   width: 30px;
   height: 30px;
   flex: 0 0 30px;
   fill: #949495;
}
.footer-contact li a span{
   font-size: 15px;
   font-weight: 500;
   transition: 0.3s ease;
   position: relative;
   white-space: nowrap;
   color: #949495;
}
.footer-contact li a span:after{
   content: '';
   position: absolute;
   display: block;
   bottom: -2px;
   left: 50%;
   height: 1px;
   width: 0;
   opacity: 0;
   transition: 0.3s ease;
   background: #949495;
   transform: translateX(-50%);
}
.footer-contact li a:hover span:after{
   width: 100%;
   opacity: 1;
}

/* Footer end */

/* Preview */

.preview {
   padding-top: 40px;
}
@media (max-width: 767px) {
   .preview {
      padding-top: 30px;
   }
}
.preview-banner {
   background: var(--white);
   border-radius: 30px;
   padding: 53px 70px;
   position: relative;
   display: flex;
   align-items: center;
   justify-content: space-between;
}
@media (max-width: 1329px) {
   .preview-banner {
      padding: 30px 40px;
   }
}
@media (max-width: 767px) {
   .preview-banner {
      flex-direction: column;
   }
}
@media (max-width: 575px) {
   .preview-banner {
      padding: 30px;
   }
}
.preview-content{
   width: 100%;
   max-width: 664px;
}
@media (max-width: 1329px) {
   .preview-content{
      max-width: 500px;
   }
}
@media (max-width: 767px) {
   .preview-content{
      max-width: 100%;
   }
}
.preview-title {
   font-size: 32px;
   font-weight: 700;
   line-height: 39px;
   margin-bottom: 30px;
   color: var(--black);
}
@media (max-width: 1329px) {
   .preview-title {
      font-size: 28px;
      line-height: 1.2;
      margin-bottom: 1em;
   }
}
@media (max-width: 575px) {
   .preview-title {
      font-weight: 600;
      font-size: 18px;
      margin-bottom: 10px;
   }
}
.preview-text {
   font-size: 22px;
   font-weight: 500;
   line-height: 27px;
   margin-bottom: 2em;
   color: var(--black);
}
@media (max-width: 1329px) {
   .preview-text {
      font-size: 18px;
      line-height: 1.4;
   }
}
@media (max-width: 767px) {
   .preview-text {
      margin-bottom: 30px;
   }
   .preview-btn {
      position: absolute;
      bottom: 45px;
      left: 50%;
      transform: translateX(-50%);
      white-space: nowrap;
   }
}
@media (max-width: 575px) {
   .preview-text {
      font-size: 14px;
      font-weight: 400;
      line-height: 1.5;
   }
   .preview-btn,
   .preview-btn span{
      font-size: 16px;
   }
   .preview-btn{
      padding: 10px 30px;
   }
}
.preview-img {
   width: 100%;
   max-width: 336px;
   margin-bottom: 0;
}
@media (max-width: 1329px) {
   .preview-img {
      max-width: 280px;
   }
}
@media (max-width: 575px) {
   .preview-img {
      max-width: 220px;
   }
}
.preview-img img{
   width: 100%;
}

/* Preview end */

/* Consultation */

.consultation {
   margin-top: 60px;
}
@media (max-width: 767px) {
   .consultation {
      margin-top: 50px;
   }
}
.consultation-body {
   background: var(--white);
   border-radius: 30px;
   padding: 53px 70px;
}
@media (max-width: 1329px) {
   .consultation-body{
      padding: 40px;
   }
}
@media (max-width: 575px) {
   .consultation-body{
      padding: 30px;
   }
}
.consultation-title {
   font-size: 24px;
   font-weight: 700;
   margin-bottom: 50px;
   color: var(--black);
}
@media (max-width: 1329px) {
   .consultation-title {
      margin-bottom: 40px;
   }
}
@media (max-width: 575px) {
   .consultation-title {
      font-size: 18px;
      font-weight: 600;
      margin-bottom: 20px;
   }
}
.consultation-form {
   display: flex;
   margin: 0 -10px 50px;
   row-gap: 20px;
   flex-wrap: wrap;
}
@media (max-width: 1329px) {
   .consultation-form {
      margin-bottom: 40px;
   }
}
@media (max-width: 767px) {
   .consultation-form {
      row-gap: 10px;
      margin-bottom: 60px;
   }
}
@media (max-width: 575px) {
   .consultation-form {
      margin-bottom: 30px;
   }
}
.consultation-form-group {
   flex: 0 0 33.3%;
   padding: 0 10px;
   position: relative;
}
@media (max-width: 991px) {
   .consultation-form-group {
      flex: 0 0 50%;
   }
   .consultation-form-group:last-child{
      flex: 0 0 100%;
      display: flex;
      column-gap: 20px;
   }
}
@media (max-width: 767px) {
   .consultation-form-group {
      flex: 0 0 100%;
   }
   .consultation-form-group:last-child{
      flex: 0 0 100%;
      display: block;
   }
}
.consultation-form-group span{
   position: absolute;
   display: block;
   width: 20px;
   height: 20px;
   border-radius: 50%;
   background: var(--main);
   left: 30px;
   top: 100%;
   transform: translateY(-50%);
}
@media (max-width: 575px) {
   .consultation-form-group span{
      display: none;
   }
}
.consultation-example {
   list-style: none;
   padding-left: 0;
   margin-bottom: 0;
   display: flex;
   column-gap: 20px;
   position: absolute;
   right: 10px;
   top: calc(100% + 10px)
}
@media (max-width: 991px) {
   .consultation-example {
      position: relative;
      flex: 0 0 calc(50% - 10px);
      right: 0;
      top: 0;
      align-items: center;
   }
}
@media (max-width: 767px) {
   .consultation-example {
      position: absolute;
      right: 10px;
      top: calc(100% + 10px)
   }
}
@media (max-width: 575px) {
   .consultation-example {
      position: relative;
      right: 0;
      top: 0;
      width: 100%;
      margin-top: 10px;
      justify-content: center;
   }
}
.consultation-example li{
   color: #ADADAD;
   transition: 0.3s ease;
   font-weight: 500;
   font-size: 14px;
   line-height: 20px;
   position: relative;
   cursor: pointer;
}
@media (max-width: 575px) {
   .consultation-example li{
      font-size: 12px;
   }
}
.consultation-example li:after{
   content: '';
   position: absolute;
   left: 0;
   height: 1px;
   width: 100%;
   bottom: 2px;
   background: #ADADAD;
   transition: 0.3s ease;
}
.consultation-example li:hover{
   color: var(--black);
}
.consultation-example li:hover:after{
   background: var(--black);
}
@media (max-width: 575px) {
   .consultation-form-btn{
      display: flex;
      justify-content: center;
   }
}

/* Consultation end */

/* Types */

.types {
   margin-top: 120px;
}
@media (max-width: 767px) {
   .types {
      margin-top: 50px;
   }
}
.types-body {
   display: flex;
   flex-wrap: wrap;
   margin: 0 -15px;
   row-gap: 20px;
}
@media (max-width: 991px) {
   .types-body {
      margin: 0 -7px;
   }
}
.types-item {
   flex: 0 0 33.3%;
   width: 33.3%;
   padding: 0 15px;
}
@media (max-width: 991px) {
   .types-item {
      padding: 0 7px;
   }
}
@media (max-width: 767px) {
   .types-item {
      flex: 0 0 100%;
   }
}
.types-item-body {
   padding: 30px 35px 40px;
   background: var(--white);
   border-radius: 30px;
   height: 100%;
   transition: 0.3s ease;
}
@media (max-width: 1329px) {
   .types-item-body {
      padding: 30px;
   }
}
@media (max-width: 1329px) {
   .types-item-body {
      padding: 30px 25px;
   }
}
@media (max-width: 767px) {
   .types-item-body {
      padding: 30px 23px 40px;
   }
}
.types-item-body:hover{
   background: var(--main);
}
.types-item-icon {
   margin-bottom: 20px;
}
.types-item-icon svg{
   width: 48px;
   height: 48px;
   fill: #767B81;
}
@media (max-width: 1329px) {
   .types-item-icon svg{
      width: 40px;
      height: 40px;
   }
}
.types-item-title {
   font-size: 24px;
   font-weight: 600;
   color: var(--black);
   margin-bottom: 50px;
}
@media (max-width: 1329px) {
   .types-item-title {
      font-size: 20px;
      margin-bottom: 30px;
   }
}
@media (max-width: 767px) {
   .types-item-title {
      font-size: 16px;
   }
}
.types-item-info {
   display: flex;
   column-gap: 26px;
}
@media (max-width: 1329px) {
   .types-item-info {
      column-gap: 16px;
   }
}
@media (max-width: 991px) {
   .types-item-info {
      flex-direction: column;
      gap: 10px;
   }
}
@media (max-width: 767px) {
   .types-item-info {
      flex-direction: row;
      gap: 20px;
   }
}
.types-item-info-item {
   display: flex;
   align-items: flex-end;
   column-gap: 10px;
   font-size: 20px;
   color: var(--black);
}
@media (max-width: 1329px) {
   .types-item-info-item {
      font-size: 16px;
   }
}
.types-item-info-item span{
   font-size: 35px;
   font-weight: 500;
   line-height: 1;
}
@media (max-width: 1329px) {
   .types-item-info-item span{
      font-size: 24px;
   }
}
@media (max-width: 991px) {
   .types-item-info-item span{
      font-size: 22px;
   }
}

/* Types end */

/* Scheme */

.scheme {
   margin-top: 120px;
}
@media (max-width: 767px) {
   .scheme {
      margin-top: 50px;
   }
}
.scheme-item {
   padding-top: 35px;
   position: relative;
}
@media (min-width: 992px) {
   .scheme-slider {
      display: flex;
      flex-wrap: wrap;
      margin: 0 -15px;
      row-gap: 60px;
      width: calc(100% + 30px);
   }
   .scheme-item {
      flex: 0 0 33.3%;
      width: 33.3%;
      padding: 35px 15px 0;
   }
}
@media (min-width: 1330px) {
   .scheme-item {
      flex: 0 0 25%;
      width: 25%;
      padding: 35px 15px 0;
   }
   .scheme-item:nth-child(5),
   .scheme-item:nth-child(6){
      flex: 0 0 50%;
   }
}
@media (max-width: 991px) {
   .scheme-slider .owl-stage{
      display: flex;
   }
   .scheme-item{
      height: 100%;
   }
}
.scheme-item-body {
   background: var(--white);
   border-radius: 30px;
   height: 100%;
   padding: 75px 32px 35px;
}
@media (max-width: 991px) {
   .scheme-item-body {
      padding: 75px 24px 30px;
   }
}
.scheme-item-number {
   position: absolute;
   width: 70px;
   height: 70px;
   border-radius: 20px;
   background: var(--black);
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: 36px;
   color: var(--white);
   top: 0;
   left: 50%;
   transform: translateX(-50%);
}
.scheme-item-title {
   text-align: center;
   font-size: 26px;
   font-weight: 600;
   color: var(--black);
   margin-bottom: 20px;
}
@media (max-width: 991px) {
   .scheme-item-title {
      font-size: 22px;
   }
}
.scheme-item-text {
   text-align: center;
   font-size: 18px;
   letter-spacing: 0.02em;
   margin-bottom: 0;
   line-height: 1.33;
   font-weight: 500;
   color: var(--black);
}
@media (max-width: 991px) {
   .scheme-item-text {
      font-size: 15px;
   }
}
@media (max-width: 991px) {
   .owl-dots {
      position: absolute;
      width: 100%;
      display: flex;
      align-items: center;
      justify-content: center;
      bottom: -30px;
      column-gap: 12px;
   }

   .owl-dot {
      display: block;
      width: 10px;
      height: 10px;
      flex: 0 0 10px;
      transition: 0.3s ease;
      border-radius: 50%;
      background: #D9D9D9 !important;
   }

   .owl-dot.active {
      background: var(--main) !important;
   }
}

/* Scheme end */

/* Banner */

.banner {
   margin-top: 60px;
}
@media (max-width: 767px) {
   .banner{
      margin-top: 90px;
   }
}
.banner-body {
   background: var(--white);
   border-radius: 30px;
   position: relative;
   padding: 53px 70px;
   padding-right: 406px;
   overflow: hidden;
}
@media (max-width: 1329px) {
   .banner-body{
      padding: 40px 50px;
      padding-right: 260px;
   }
}
@media (max-width: 767px) {
   .banner-body{
      padding: 30px 30px 20px;
   }
   .banner-content{
      display: flex;
      flex-direction: column;
      align-items: center;
      position: relative;
      z-index: 10;
   }
}
.banner-title {
   margin-bottom: 45px;
   font-size: 36px;
   font-weight: 600;
   line-height: 1.2;
   color: var(--black);
}
@media (max-width: 1329px) {
   .banner-title {
      font-size: 28px;
   }
}
@media (max-width: 991px) {
   .banner-title {
      margin-bottom: 35px;
      font-size: 24px;
   }
}
@media (max-width: 767px) {
   .banner-title {
      font-size: 20px;
      margin-bottom: 157px;
   }
}
.banner-btn {
}
.banner-img {
   margin-bottom: 0;
   position: absolute;
}
.first-banner .banner-img {
   width: 548px;
   right: -27px;
   top: 0;
}
@media (max-width: 1329px) {
   .first-banner .banner-img {
      width: 460px;
      bottom: 0;
      top: auto
   }
}
.second-banner .banner-img {
   width: 448px;
   right: -25px;
   top: 50%;
   transform: translateY(-50%);
}
@media (max-width: 1329px) {
   .second-banner .banner-img {
      width: 320px;
   }
}
.banner-img img{
   width: 100%;
}
@media (max-width: 767px) {
   .banner-img{
      right: auto !important;
      left: 50% !important;
      transform: translateX(-50%) !important;
      width: 440px;
   }
   .second-banner .banner-img {
      top: auto;
      width: 330px;
      bottom: -10px;
   }
}

/* Banner end */

/* Prefer */

.prefer {
   margin-top: 120px;
}
@media (max-width: 767px) {
   .prefer {
      margin-top: 50px;
   }
}
@media (min-width: 992px) {
   .prefer-slider {
      display: flex;
      flex-wrap: wrap;
      margin: 0 -15px;
      row-gap: 30px;
      width: calc(100% + 30px);
   }
   .prefer-item {
      flex: 0 0 33.3%;
      width: 33.3%;
      padding: 0 15px;
   }
}
@media (max-width: 991px) {
   .prefer-slider .owl-stage{
      display: flex;
   }
   .prefer-item{
      height: 100%;
   }
}
.prefer-item-body {
   padding: 30px 30px 50px;
   background: var(--white);
   height: 100%;
   border-radius: 30px;
   transition: 0.3s ease;
}
.prefer-item-body:hover{
   background: var(--main);
}
.prefer-item-icon {
   margin-bottom: 30px;
}
.prefer-item-icon svg{
   width: 48px;
   height: 48px;
   fill: #767B81;
}
.prefer-item-title {
   margin-bottom: 0;
   font-size: 24px;
   line-height: 1.35;
   font-weight: 600;
   color: var(--black);
}
@media (max-width: 1329px) {
   .prefer-item-title{
      font-size: 20px;
   }
}
@media (max-width: 991px) {
   .prefer-item-title{
      font-size: 18px;
   }
}

/* Prefer end */


/* Spoilers */

.spoiler-item {
   border-bottom: 1px solid #DDDFE0;
}

.spoiler-item:last-child {
   border-bottom: 0;
}

.spoiler-item-header {
   cursor: pointer;
   display: flex;
   align-items: center;
   justify-content: space-between;
   padding: 18px 0;
}

@media (max-width: 575px) {
   .spoiler-item-header {
      padding: 14px 0;
   }
}

.spoiler-item-header>* {
   pointer-events: none;
}

.spoiler-item-header svg {
   transition: 0.3s ease;
}

.spoiler-item-header svg {
   width: 38px;
   height: 38px;
   flex: 0 0 38px;
   fill: var(--black);
   transition: 0.3s ease;
}

@media (max-width: 767px) {
   .spoiler-item-header svg {
      width: 25px;
      height: 25px;
      flex: 0 0 25px;
   }
}

.spoiler-item.show svg {
   transform: rotate(180deg);
}

.spoiler-item-body {
   display: none;
   padding-bottom: 10px;
}
.spoiler-item-body p{
   line-height: 1.4;
   font-weight: 500;
}
@media (max-width: 575px) {
   .spoiler-item-body p{
      font-size: 12px;
      line-height: 1.5;
   }
}

/* Spoilers end */

.faq {
   margin-top: 120px;
}
@media (max-width: 767px) {
   .faq{
      margin-top: 50px;
   }
}
.faq-body {
   background: var(--white);
   border-radius: 30px;
   padding: 40px 70px;
}
@media (max-width: 991px) {
   .faq-body{
      padding: 20px 40px;
   }
}
@media (max-width: 575px) {
   .faq-body{
      padding: 7px 22px;
   }
}
.spoiler-item-title{
   font-size: 24px;
   margin-bottom: 0;
}
@media (max-width: 991px) {
   .spoiler-item-title{
      font-size: 20px;
   }
}
@media (max-width: 575px) {
   .spoiler-item-title{
      font-size: 14px;
   }
}

/* Contacts */

.contacts {
   margin-top: 120px;
}
@media (max-width: 767px) {
   .contacts{
      margin-top: 50px;
   }
}
.contacts-body {
   display: flex;
   margin: 0 -15px;
}
@media (max-width: 767px) {
   .contacts-body {
      flex-wrap: wrap;
   }
}
.contacts-map {
   padding: 0 15px;
   flex: 0 0 66.6%;
}
@media (max-width: 991px) {
   .contacts-map{
      flex: 0 0 50%;
   }
}
@media (max-width: 767px) {
   .contacts-map{
      margin-bottom: 20px;
      flex: 0 0 100%;
      height: 232px;
   }
}
.contacts-map-frame{
   height: 100%;
   border-radius: 30px;
   overflow: hidden;
}
.contacts-map-frame iframe{
   width: 100%;
   height: 100%;
}
.contacts-info {
   padding: 0 15px;
   flex-grow: 1;
   max-width: 100%;
}
@media (max-width: 991px) {
   .contacts-info {
      flex: 0 0 50%;
   }
}
@media (max-width: 767px) {
   .contacts-info {
      flex: 0 0 100%;
   }
}
.contacts-info-content{
   height: 100%;
   background: var(--main);
   border-radius: 30px;
   padding: 50px;
   display: flex;
   flex-direction: column;
   gap: 50px;
}
@media (max-width: 1329px) {
   .contacts-info-content{
      padding: 50px 30px;
   }
}
@media (max-width: 575px) {
   .contacts-info-content{
      padding: 30px;
   }
}
.contacts-title {
   color: var(--black);
   margin-bottom: 20px;
   font-size: 26px;
   letter-spacing: 0.02em;
   font-weight: 600;
}
@media (max-width: 575px) {
   .contacts-title{
      font-size: 20px;
   }
}
.contacts-info .header-connect {
   flex-direction: column;
   gap: 15px;
   align-items: flex-start;
}

/* Contacts end */

/* Details */

.details {
   margin-top: 60px;
}
.details-top {
   margin: 0 -15px 30px;
   display: flex;
}
@media (max-width: 575px) {
   .details-top {
      flex-wrap: wrap;
      margin-bottom: 50px;
      row-gap: 30px;
   }
}
.details-top-item {
   padding: 0 15px;
   flex: 0 0 50%;
   width: 50%;
}
@media (max-width: 575px) {
   .details-top-item {
      flex: 0 0 100%;
      width: 100%;
   }
}
.details-top-item-body {
   height: 100%;
   border-radius: 30px;
   background: var(--white);
   padding: 55px 60px;
   position: relative;
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   gap: 112px;
}
@media (max-width: 991px) {
   .details-top-item-body {
      padding: 40px;
   }
}
.details-top-item-title {
   margin-bottom: 0;
   font-size: 36px;
   color: var(--black);
   font-weight: 600;
   line-height: 1.2;
   position: relative;
   z-index: 2;
}
@media (max-width: 991px) {
   .details-top-item-title {
      font-size: 28px;
   }
}
.details-top-item-btn{
   position: relative;
   z-index: 1;
}
.details-top-item-img {
   position: absolute;
   margin-bottom: 0;
   top: 50%;
   right: 70px;
   transform: translateY(-50%);
   width: 221px;
}
@media (max-width: 1329px) {
   .details-top-item-img{
      right: 0;
   }
}
@media (max-width: 991px) {
   .details-top-item-img{
      width: 180px;
   }
}
@media (max-width: 767px) {
   .details-top-item-img{
      width: 150px;
   }
}
.details-top-item-img img{
   width: 100%;
}
.details-bottom {
   display: flex;
   margin: 0 -15px;
}
@media (max-width: 991px) {
   .details-bottom {
      flex-wrap: wrap;
      row-gap: 20px;
   }
}
.details-bottom-item {
   flex: 0 0 33.3%;
   width: 33.3%;
   padding: 0 15px;
}
@media (max-width: 991px) {
   .details-bottom-item {
      flex: 0 0 100%;
      width: 100%;
   }
}
.details-bottom-title {
   display: flex;
   align-items: center;
   justify-content: center;
   padding: 20px;
   line-height: 1.5;
   height: 100%;
   background: var(--white);
   border-radius: 20px;
   text-align: center;
   font-size: 16px;
   font-weight: 500;
   color: var(--black);
}
@media (max-width: 575px) {
   .details-bottom-title {
      height: 61px;
      font-size: 14px;
      line-height: 1.21;
      padding-left: 30px;
      padding-right: 30px;
   }
}
.details-bottom-title:hover{
   background: var(--main);
}

/* Details end */

/* Modal callback */

.modal-content {
   border-radius: 30px;
   border: 0;
   position: relative;
}
.modal-close {
   position: absolute;
   top: 24px;
   right: 24px;
   z-index: 10;
}
.modal-body {
   padding: 50px 75px;
}
@media (max-width: 575px) {
   .modal-body{
      padding: 60px 20px 50px;
   }
}
.modal-title {
   font-size: 24px;
   text-align: center;
   font-weight: 700;
   color: var(--black);
   margin-bottom: 40px;
}
.modal-form-group {
   margin-bottom: 20px;
}
.modal-form-group:last-child{
   margin-bottom: 0;
}
.modal-form-group .form-control {
   background-color: #EDF1F6;
}
.modal-form-group .btn-main {
   width: 100%;
   padding: 18px;
}
.modal-form-group .btn-secondary {
   width: 100%;
   padding: 18px;
}
.modal-text{
   text-align: center;
   font-size: 18px;
   font-weight: 500;
   color: var(--black);
   line-height: 1.5;
   margin-top: -10px;
}

/* Modal end */

/* Feedback */

.feedback {
   margin-top: 120px;
   margin-bottom: 180px;
}
@media (max-width: 767px) {
   .feedback {
      margin-top: 90px;
      margin-bottom: 0;
   }
}
.feedback-video-slider {
   margin-bottom: 30px;
}
.feedback-video-item {
   background: var(--white);
   border-radius: 30px;
   overflow: hidden;
   position: relative;
}
.feedback-video-img {
   margin-bottom: 0;
   overflow: hidden;
   position: relative;
   padding-top: 55%;
}
@media (max-width: 575px) {
   .feedback-video-img{
      padding-top: 80%;
   }
}
.feedback-video-img img{
   width: 100%;
   height: 100%;
   object-fit: cover;
   position: absolute;
   top: 0;
   left: 0;
}
.feedback-video-btn {
   position: absolute;
   left: 50%;
   top: 50%;
   transform: translate(-50%, -50%);
}
.feedback-video-btn svg{
   width: 126px;
   height: 126px;
   fill: #CB0000;
}
@media (max-width: 991px) {
   .feedback-video-btn svg{
      width: 90px;
      height: 90px;
   }
}
.feedback-text-slider .owl-stage{
   display: flex;
}
.feedback-item {
   background: var(--white);
   border-radius: 30px;
   padding: 30px 24px 30px 30px;
   height: 100%;
}
.feedback-item-header {
   display: flex;
   align-items: center;
   column-gap: 15px;
   margin-bottom: 16px;
}
.feedback-item-img {
   margin-bottom: 0;
   width: 65px;
   flex: 0 0 65px;
   height: 65px;
   border-radius: 50%;
   overflow: hidden;
}
@media (max-width: 575px) {
   .feedback-item-img{
      width: 45px;
      flex: 0 0 45px;
      height: 45px;
   }
}
.feedback-item-img img{
   width: 100%;
   height: 100%;
   object-fit: cover;
}
.feedback-item-title {
   font-size: 18px;
   font-weight: 600;
   line-height: 1.21;
   color: var(--black);
   margin-bottom: 0;
}
@media (max-width: 575px) {
   .feedback-item-title {
      font-size: 16px;
   }
}
.feedback-item-text {
   font-size: 16px;
   margin-bottom: 0;
   line-height: 1.35;
   letter-spacing: 0.02em;
   color: var(--black);
   font-weight: 500;
}
@media (max-width: 575px) {
   .feedback-item-text {
      font-size: 14px;
   }
}
.feedback-text-slider .owl-dots {
   position: absolute;
   width: 100%;
   display: flex;
   align-items: center;
   justify-content: center;
   bottom: -60px;
   column-gap: 12px;
}
@media (max-width: 767px) {
   .feedback-text-slider .owl-dots{
      bottom: -30px;
   }
}
@media (max-width: 575px) {
   .feedback-text-slider .owl-dots{
      bottom: -50px;
      row-gap: 10px;
      flex-wrap: wrap;
      padding: 0 20px;
   }
}
.feedback-text-slider .owl-dot {
   display: block;
   width: 10px;
   height: 10px;
   flex: 0 0 10px;
   transition: 0.3s ease;
   border-radius: 50%;
   background: #D9D9D9 !important;
}
.feedback-text-slider .owl-dot.active {
   background: var(--main) !important;
}

/* Feedback end */

/* Subscribe */

.about {
   padding-top: 50px;
}
@media (max-width: 767px) {
   .about {
      padding-top: 30px;
   }
}
.about-title {
   font-size: 32px;
   margin-bottom: 80px;
   line-height: 1.21;
   color: var(--black);
   font-weight: 600;
}
@media (max-width: 991px) {
   .about-title{
      margin-bottom: 50px;
   }
}
@media (max-width: 767px) {
   .about-title{
      font-size: 20px;
      margin-bottom: 40px;
   }
}
.about-body {
   max-width: 1052px;
}
.about-body p{
   margin-bottom: 40px;
   font-size: 20px;
   line-height: 1.5;
   color: var(--black);
   font-weight: 300;
}
@media (max-width: 991px) {
   .about-body p{
      font-size: 16px;
      margin-bottom: 30px;
   }
}
@media (max-width: 767px) {
   .about-body p{
      font-size: 14px;
      margin-bottom: 20px;
   }
}
.about-body p a{
   font-weight: 600;
   border-bottom: 1px solid var(--black);
}
.about-body p a:hover{
   color: var(--main);
   border-bottom: 1px solid var(--main);
}
.about-body p:last-child{
   margin-bottom: 0;
}

.subscribe {
   margin-top: 85px;
}
@media (max-width: 767px) {
   .subscribe {
      margin-top: 50px;
   }
}
.subscribe-body {
   background: var(--white);
   border-radius: 30px;
   padding: 53px 70px 40px;
}
@media (max-width: 991px) {
   .subscribe-body {
      padding: 40px;
   }
}
@media (max-width: 767px) {
   .subscribe-body {
      padding: 30px;
   }
}
.subscribe-text {
   margin-bottom: 60px;
   font-size: 18px;
   line-height: 1.5;
   color: var(--black);
}
@media (max-width: 767px) {
   .subscribe-text {
      font-size: 16px;
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      margin-bottom: 30px;
   }
}
.subscribe-text a{
   font-weight: 600;
   border-bottom: 1px solid var(--black);
}
.subscribe-text a:hover{
   color: var(--main);
   border-bottom: 1px solid var(--main);
}
.subscribe-form-group {
   margin-bottom: 15px;
   display: flex;
   align-items: center;
   column-gap: 20px;
}
@media (max-width: 767px) {
   .subscribe-form-group {
      margin-bottom: 10px;
   }
}
.subscribe-form-group:last-child{
   margin-bottom: 0;
}
.subscribe-form-group > label:first-child{
   flex: 0 0 270px;
   font-size: 18px;
   font-weight: 600;
   color: var(--black);
   margin-bottom: 0;
   cursor: pointer;
}
@media (max-width: 991px) {
   .subscribe-form-group > label:first-child{
      font-size: 16px;
      flex: 0 0 200px
   }
}
@media (max-width: 767px) {
   .subscribe-form-group > label:first-child{
      display: none;
   }
}
.subscribe-form-group-date {
   display: flex;
   column-gap: 10px;
}
.date-btn{
   border: 1px solid #E7E8EA;
   padding: 8px;
   border-radius: 6px;
   cursor: pointer;
   pointer-events: none;
}
.date-btn svg{
   width: 38px;
   height: 38px;
}
@media (max-width: 767px) {
   .date-btn{
      padding: 7px;
   }
   .date-btn svg{
      width: 32px;
      height: 32px;
   }
}
.subscribe-form-accept {
   display: flex;
   margin-top: 50px;
   margin-bottom: 60px;
}
@media (max-width: 767px) {
   .subscribe-form-accept {
      margin-top: 30px;
      margin-bottom: 40px;
   }
}
.subscribe-form-accept label{
   margin-bottom: 0;
   display: flex;
   align-items: flex-start;
   column-gap: 15px;
   cursor: pointer;
   line-height: 1.5;
}
.subscribe-form-accept label span{
   display: flex;
   align-items: center;
   justify-content: center;
   width: 24px;
   height: 24px;
   flex: 0 0 24px;
   border-radius: 5px;
   border: 1px solid #E7E8EA;
   line-height: 1.5;
}
.subscribe-form-accept label span svg{
   width: 7px;
   height: 7px;
   fill: var(--white);
   transition: 0.3s ease;
}
.subscribe-form-accept label input:checked + span svg{
   fill: var(--black)
}
.subscribe-form-accept label p{
   margin-bottom: 0;
   font-size: 16px;
   letter-spacing: 0.02em;
}
@media (max-width: 767px) {
   .subscribe-form-accept label p{
      font-size: 14px;
   }
}
.subscribe-form-accept label p a{
   font-weight: 600;
   border-bottom: 1px solid var(--black);
}
.subscribe-form-accept label p a:hover{
   color: var(--main);
   border-bottom: 1px solid var(--main);
}
.subscribe-btn {
   display: flex;
   justify-content: center;
}

.modal .footer-contact{
   align-items: center;
   margin-top: -10px;
}
.modal .footer-contact span{
   color: var(--black);
}
.modal .footer-contact svg{
   fill: var(--black)
}