html{
  box-sizing: border-box;
}

body.resizing * {
  transition: all 0.3s ease;
}


*{
  font-family: 'Oswald', Arial, Helvetica, sans-serif;
}
body{
  background-color: black;
}
.container{
  max-width: 1220px;
  margin: 0 auto;
  padding: 0px 10px;
  position: relative;
}

a{
  text-decoration: none;
  color: white;
}

.header{
  height: 120px;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 100;
}


.header::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.801);
  backdrop-filter: blur(15px);
  -webkit-backdrop-filter: blur(15px);
  mask-image: linear-gradient(to bottom, black 0%, black 40%, rgba(0, 0, 0, 0.5) 70%, transparent 100%);
  -webkit-mask-image: linear-gradient(to bottom, black 0%, black 40%, rgba(0, 0, 0, 0.5) 70%, transparent 100%);
  pointer-events: none;
  z-index: -1;
}

.navbar {
  display: flex;
  height: 100px;
  justify-content: space-between;
  align-items: center; 
}

.logo{
  width: 150px;
}

.menu a {
  font-size: 16px;
  color: white;
  padding: 14px 27px;
  text-decoration: none;
}

.menu {
  display: flex;
  align-items: center;
  gap: 10px;
}

.dropdown {
  position: relative;
}

.dropdown-content {
  display: none;
  position: absolute;
  top: calc(100% + 10px); /* трохи нижче меню */
  left: 0;
  background: white;
  min-width: 150px;
  border-radius: 8px;
  box-shadow: 0 6px 15px rgba(0, 0, 0, 0.2);
  z-index: 1001;
  padding: 5px 0;
}

.dropdown-content a {
  display: block;
  padding: 10px 15px;
  color: black;
  text-decoration: none;
  font-size: 15px;
  text-align: center;
  white-space: nowrap;
}

.dropdown-content a:hover {
  background-color: #f2f2f2;
}

.dropdown:hover .dropdown-content {
  display: block;
}

.button-1, .button-4 {
  width: 170px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  font-size: 19px;
  border-radius: 40px;
  border: 2px solid transparent;
  background-color: transparent;
  position: relative;
  cursor: pointer; 
  transition: color 0.5s ease-in-out, background-color 0.5s ease-in-out;
}

.button-1::before, .button-4::before {
  content: "";
  position: absolute;
  height: 100%;
  width: 100%;
  border-radius: 40px;
  padding: 3px;
  background: linear-gradient(90deg, #A513D8, #3C04F3);
  -webkit-mask-composite: destination-out;
  -webkit-mask: linear-gradient(black, black) content-box, linear-gradient(black, black);
  mask-composite: exclude;
}

.button-1:hover, .button-4:hover {
  background: linear-gradient(90deg, #A513D8, #3C04F3);
}

.button-2, .button-3 {
  width: 170px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  background: linear-gradient(90deg, #A513D8, #3C04F3);
  border: none;
  font-size: 19px;
  border-radius: 40px;
  cursor: pointer; 
  overflow: hidden;
  transition: transform 10s ease-in-out;
}

.line{
  width: 10px;
  height: 100px;
  background-color: #d9d9d9e8;
  filter: blur(10px);
  transform: translate(-90px) rotate(-30deg);
}

.button-2:hover .line{
  animation: moveButton 1s ease-in-out ;
}

.button-3:hover .line{
  animation: moveButton 1s ease-in-out ;
}

@keyframes moveButton {
  0% {
    transform: translate(-90px) rotate(-30deg);
  }
  100%{
    transform: translate(150px) rotate(-30deg);
  }
}

.bg{
  position: relative;
 
}

.video{
  position: absolute;
  top: 300px;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 1200px;
}

.title-1{
  width: 600px;
  color: white;
  font-size: 45px;
  font-weight: 600;
  line-height: 125%;
  text-transform: capitalize;
}

.text-1{
  width: 570px;
  margin: 0px 30px 0px 0px;
  color: white;
  font-size: 19px;
  font-weight: 200;
  line-height: 137%;
}

.buttons{
  display: flex;
  margin-top: 40px;
  width: 380px;
  justify-content: space-between;
}

.title-2{
  text-align: center;;
  color: white;
  font-size: 30px;
  font-weight: 400;
  margin-top: 40px;
}

.logos-1{
  display: flex;
  width: 600px;
  justify-content: space-between;
  justify-items: center;
}

.logos-2{
  display: flex;
  width: 440px;
  margin-top: 20px;
  justify-content: space-between;
  justify-items: center;
}

.logos-center{
  justify-items: center;
  align-items: center;
  width: 100%;
  margin-top: 30px;
}

.short-inform{
  display: flex;
  justify-content: space-between;
  margin-top: 140px;
}


.card-imgs {
  display: flex;
  max-height: 250px;
}

.card-img-1 {
  position: relative;
  height: 250px;
  z-index: 2;
  width: 390px;
  transition: transform 0.2s ease-in, opacity 0.2s ease-in;
}

.card-img-2, .card-img-3 {
  position: absolute;
  opacity: 0;
  transition: transform 0.2s ease-in-out, opacity 0.2s ease-out;
}

.card-imgs:hover .card-img-1{
  transform: translateX(-30px);
}

.card-imgs:hover .card-img-2 {
  opacity: 1;
  transform: translateY(25px);
  z-index: 1;
}

.card-imgs:hover .card-img-3 {
  opacity: 1;
  transform: translateY(40px) translateX(20px);
  z-index: 0;
  }

.section-second, .section-trird, .section-fourth, .section-fifth, .footer{
  margin-top: 100px;
}

.title-3{
  text-align: center;;
  color: white;
  font-size: 30px;
  font-weight: 400;
  align-items: center;
}

.text-2, .text-3{
  margin-top: 20px;
  color: white;
  font-size: 19px;
  font-weight: 200;
  line-height: 137%;
  text-align: center;
  display: flex;
  align-items: center;
}

.text-2{
  width: 570px;
}

.text-block{
  justify-content: space-between;
  justify-items: center;
}

.inform-cards{
  margin-top: 30px;
  display: flex;

  color: white;
  column-gap: 45px;
  bottom: 0;
}

.card-block{
  justify-items: center;
  transition: transform 0.3s ease-out;
}

.information{
  position: relative;
  display: flex;
  flex-wrap: wrap;
  border-radius: 15px;
  background-color: #26263E;
  height: 140px;
  width: 370px;
  justify-content: space-between;
  padding-top: 60px;
  padding-bottom: 50px;
  align-items: center;
  flex-direction: column;
}

.icon-1, .icon-2, .icon-3{
  display: flex;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  border-radius: 10px;
  position: relative;
  top: 25px; 
  z-index: 1;
}

.icon-1{
filter: drop-shadow(#E38D28 0  0 30px);
 background-color: #E38D28;
}

.icon-2{
  filter: drop-shadow(#A014D3 0  0 30px);
  background-color: #A014D3;
}

.icon-3{
  filter: drop-shadow(#F0231E 0  0 30px);
  background-color: #F0231E;
}

.card-block:hover{
  transform: scale(1.1) translateY(-15px);
  transition: transform 0.3s ease-out;
}

.text-card{
  width: 280px;
  font-weight: 200;
  text-align: center;
  line-height: 137%;
}

.button-card{
  color: #E3A429;
  cursor: pointer;
  font-size: 13px;
}

.payments{
  margin-top: 100px;
  display: grid;
  grid-template-columns: repeat(2, 450px);
  grid-template-rows: 265px;
  column-gap: 250px;
}

.img-panments{
  position: relative;
  display: flex;
  display: none;
}

.card{
  position: absolute;
  z-index: -1;
  opacity: 1;
}

.card-hover{
  position: absolute;
  z-index: 1;
  opacity: 0;
}

.transactions{
  position: absolute;
  z-index: 2;
  transform: translateY(90px) translateX(240px);
  transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
}

.img-payments:hover .card-hover{
  opacity: 1;
  transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
}

.img-payments:hover .card{
  opacity: 0;
  transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
}

.img-payments:hover .transactions{
  transform: scale(1.05) translateY(80px) translateX(220px);
  transition: transform 0.3s ease-in-out;
}

.text-payments{
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
}

.text-payments p{
  width: 420px;
}

.text-3{
  width: 880px;
}

.respond {
  background-color: transparent;
  padding: 20px;
  border-radius: 16px;
  text-align: center;
  transition: transform 0.3s ease-out;
}

.respond:hover {
  transform: scale(1.05) translateY(-10px);
}

.respond img {
  width: 160px;
  height: 160px;
  object-fit: cover;
  border-radius: 50%;
  margin: 0 auto;
  display: block;
}

.name {
  color: white;
  font-size: 15px;
  margin-top: 15px;
}

.stars {
  display: flex;
  width: 100px;
  padding-top: 4px;
  margin: 0 auto;
  justify-content: space-between;
}

.stars img {
  width: 12px;
  height: 12px;
}

.slick-prev,
.slick-next {
  width: 40px;
  height: 40px;
  background-color: transparent;
  background-size: cover;
  background-repeat: no-repeat;
  border: none;
  z-index: 10;
}

.client{
  margin-top: 40px;
}

.section-fifth{
  padding:  40px 0px 40px 0px ;
}

.circle {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  width: 340px;
  height: 340px;
  margin: 0 auto;
  border-radius: 50%;
  background-color: black;
  color: white;
  position: relative;
}

.circle::before {
  content: "";
  position: absolute;
  top: -15px;
  left: 50%;
  width: 380px;
  height: 380px;
  transform: translateX(-50%);
  background: linear-gradient(to bottom, #A513D8, #3C04F3);
  border-radius: 50%;
  filter: blur(40px);
  z-index: -1;
}

.button-3{
  width: 190px;
}

.button-3 img{
  padding: 5px 0px 0px 3px;
}

.text-circle{
  font-size: 20px;
  line-height: 130%;
  width: 200px;
  margin-bottom: 20px;
}

.footer{
  height: auto;
  background-color: #090D21;
  padding: 60px 0px 60px 0px;
}

.footer-inf{
  display: flex;
  justify-content: space-between;
}

.navig{
  display: flex;
  flex-direction: column;
  gap: 82px;
  width: 600px;
}

.menu-footer{
  display: flex;
  flex-wrap: wrap;
  font-size: 19px;
  width: 60px;
  gap: 40px;
}

.copyright{
  display: flex;
  gap: 50px;
  font-size: 12px;
}

.copyright a:hover{
  text-decoration: underline;
}

.copyright-adaptation{
  display: none;
}

.news{
  display: flex;
  flex-direction: column;
  gap: 30px;
  width: 600px;
}

.title-4{
  color: white;
  font-size: 30px;
  font-weight: 400;
  align-items: center;
}

.text-4{
  width: 380px;
  color: white;
  font-size: 19px;
  font-weight: 200;
  line-height: 137%;
}

.button-4{
  color: #E3A429;
  font-size: 12px;
}

.button-4 img{
  padding: 2px 0px 0px 3px;
}

.contacts{
  width: 270px;
  display: flex;
  justify-content: space-between;
}

#scrollToTop {
  position: fixed;
  display: flex;
  align-items: center;
  justify-content: center;
  bottom: 30px;
  right: 30px;
  width: 60px;
  height: 60px;
  border-radius: 15px;
  cursor: pointer;
  border: 0.1px solid transparent;
  background-color: transparent;
  transition: color 0.5s ease-in-out, background-color 0.5s ease-in-out, border 0.5s ease-in-out;
  z-index: 1000;
}

#scrollToTop::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 15px;
  padding: 3px;
  background: linear-gradient(90deg, #A513D8, #3C04F3);
  mask: linear-gradient(black, black) content-box, linear-gradient(black, black);
  -webkit-mask-composite: exclude;
  mask-composite: exclude;
}

#scrollToTop img {
  width: 30px;
  height: 30px;
  transition: transform 0.3s ease-in-out;
}


#scrollToTop:hover {
  background: linear-gradient(90deg, #A513D8, #3C04F3);
  width: 60px;
  height: 60px;
}


.p-menu1{
  display: none;
}

.p-menu1{
  height: 100%;
}


.navigation{
  width: 40px;
  position: relative;

}


/* Responsive Adjustments */
@media (min-width: 768px) {
  .nav-menu {
    width: 750px;
  }
}
/*Medium Screens */
@media (min-width: 922px) {
  .nav-menu {
    width: 970px;
  }
}
/*Large Screens */
@media (min-width: 1200px) {
  .nav-menu {
    width: 1170px;
  }
}

/* Burger Icon Container */
.burger-container {
  position: fixed;
  top: 20px;
  right: 20px;
  z-index: 1000;
  cursor: pointer;
  width: 40px;
  height: 30px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 5px;
  border-radius: 5px;
  background: hwb(0 100% 0% / 0.1);
  backdrop-filter: blur(10px);
  box-shadow: 0 4px 6px #0000001a;
}

/* Burger Icon Lines */
.burger-line {
  width: 100%;
  height: 3px;
  background-color: var(--primary-color);
  border-radius: 2px;
  transform-origin: center;
  transition: all 0.4s ease-in-out;
}

/* Checkbox Hack */
#burger-toggle {
  display: none;
}

/* Navigation Styles */
.nav-menu {
  position: fixed;
  top: 0;
  right: -300px;
  width: 300px;
  height: 100%;
  background: linear-gradient(135deg, var(--primary-color) 0%, #273849 100%);
  transition: right 0.4s cubic-bezier(0.77, 0.2, 0.05, 1);
  box-shadow: -4px 0 15px #00000033;
  overflow-y: auto;
  padding-top: 100px;
}

.nav-menu::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 80px;
  background: #ffffff0d;
  backdrop-filter: blur(10px);
}

.nav-menu ul {
  list-style-type: none;
}

.nav-menu ul li {
  margin: 0 15px;
  border-bottom: 1px solid #ffffff1a;
}

.nav-menu ul li a {
  color: white;
  text-decoration: none;
  display: block;
  padding: 15px;
  font-weight: 500;
  position: relative;
  overflow: hidden;
}

.nav-menu ul li a::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: -100%;
  width: 100%;
  height: 2px;
  background-color: var(--secondary-color);
  transition: left 0.3s ease;
}

.nav-menu ul li a:hover::after {
  left: 0;
}

/* Burger Icon Animation on Checkbox Checked */
#burger-toggle:checked ~ .burger-container .burger-line:nth-child(1) {
  transform: rotate(45deg) translate(5px, 5px);
}

#burger-toggle:checked ~ .burger-container .burger-line:nth-child(2) {
  opacity: 0;
}

#burger-toggle:checked ~ .burger-container .burger-line:nth-child(3) {
  transform: rotate(-45deg) translate(5px, -5px);
}

/* Navigation Slide In */
#burger-toggle:checked ~ .nav-menu {
  right: 0;
}
/* Color Variables */
:root {
  --primary-color: #2c3e50;
  --secondary-color: #3498db;
  --background-color: #ecf0f1;
  --text-color: #333;
  --hover-color: #2980b9;
}


@media (max-width: 1199px){
  .container{

  }


  .buttons {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    margin:50px;
    width: auto;
    gap: 30px;
  }

  .scrollToTop {
    display: none;
  }

  .button-1, .button-2, .button-3, .button-4 {
    width: 380px;
    height: 85px;
    font-size: 30px;
  }

  .button-3{
    margin-top: 20px;
  }

  .line{
    display: none;
  }

  .p-menu1{
    display: block;
  }

  .short-inform {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  .card-img-1 {
    width: 300px;
    height: auto;
  }

  .logos-1, .logos-2 {
    flex-wrap: wrap;
    justify-content: center;
    width: 100%;
  }

  .logos-1{
    gap: 70px;
  }

  .logos-2{
    gap: 75px;
  }

  .title-2, .title-3, .title-4{
    font-size: 40px;
  }

  .logos-1 img{
    width: 80px;
  }

  .logos-2 img{
    width: 100px;
  }
  
  .container{
    width: 960px;
    margin: 0 auto;
    padding: 0px 20px;
    height: auto;
  }

  .menu, .header .button-1, .card-imgs{
  display: none;
 }

 .title-1{
  font-size: 70px;
  width: auto;
 }

 .text-1, .text-2, .text-3, .text-4, .text-payments p{
  font-size: 29px;
  width: auto;
  padding: 0px 20px;
  text-align: center;
  margin: 0 auto;
  margin-top: 25px;
 }

 .title-4{
  font-size: 50px;
 }


.inform-cards{
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
}

.text-block{
  justify-content: space-between;
  justify-items: center;
}


.information{
  position: relative;
  display: flex;
  flex-wrap: wrap;
  border-radius: 25px;
  background-color: #26263E;
  height: 300px;
  width: 650px;
  justify-content: space-between;
  padding-top: 60px;
  padding-bottom: 50px;
  align-items: center;
  flex-direction: column;
}

.title-card{
  font-size: 35px;
}

.text-card{
  font-size: 30px;
  width: 520px;
}

.button-card{
  font-size: 25px;
}

.button-card img{
  width: 22px;
}

.comp-logo{
  margin-top: 200px;
}

.img-payments{
  display: none;
}
.text-payments{
  display: flex;
  flex-wrap: nowrap;
  margin: 0 auto;
}
.payments{
  display: flex;
}

.text-payments .button-1{
  margin-top: 30px;
}

.circle{
  width: 600px;
  height: 600px;
}

.circle::before{
  width: 640px;
  height: 640px;
}
.text-circle{
  font-size: 40px;
  width: 420px;
}

.footer-inf{
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
}

.navig, .news{
  width: auto;
  align-items: center;
  justify-content: center;
}

.news{
  margin-top: 70px;
  gap: 40px;
}

.text-4{
  margin-top: -20px;
  width: 530px;
}

.contacts{
  gap: 65px;
  justify-content: center;
}

.contacts img{
  width: 75px;
  
}

.copyright{
  display: none;
}

.copyright-adaptation{
  display: block;
  display: flex;
  font-size: 20px;
  gap: 40px;
  align-items: center;
  justify-content: center;
  margin-top: 50px;

}

.menu-footer{
  text-align: center;
  font-size: 45px;
 flex-direction: column;
 width: auto;
}

.respond img{
  width: 200px;
  height: 200px;
}

.stars img{
  width: 20px;
  height: 20px;
}

.video{
  width: 100%;
  margin-top: 300px;
}

.name{
  font-size: 28px;
  text-align: center;
}

.icon-1, .icon-2, .icon-3{
  width: 80px;
  height: 80px;
  border-radius: 10px;
  position: relative;
  top: 40px; 
}

.icon-1 img, .icon-2 img , .icon-3 img {
  height: 37px;
}

.card-block:hover{
   transform: scale(1) translateY(0px);
}
.client-autoplay{
  width: 600px;
}

}

@media (max-width: 1000px){
  .container{
    width: 600px;
    padding:  20px;
    margin: 0 auto;
  }
  
  .title-1{
    font-size: 45px;
  }

  .text-1, .text-2, .text-3, .text-4, .text-payments p{
    font-size: 28px;
    margin: 0 auto;
    width: auto;
    margin-top: 30px;
    font-size: 25px;
  ;
  }
    .button-1, .button-2, .button-3, .button-4{
      width: 280px;
      height: 80px;
      font-size: 25px;
    }

    .logos-1 img{
      width: 70px;
    }
  
    .logos-2 img{
      width: 100px;
    }

    .logos-1{
      gap: 60px;
    }
  
    .logos-2{
      gap: 65px;
    }

    .video{
      margin-top: 370px;
      width: 620px;
    }

    .comp-logo{
      margin-top: 150px;
    }

    .information{
      width: 530px;
      height: 300px;
    }

    .title-card{
      font-size: 30px;
      margin-top: 25px;
    }
    
    .text-card{
      font-size: 25px;
      width: 440px;
    }

    .button-card{
      font-size: 25px;
    }

    .button-3 img{
      width: 20px;
    }

    .name{
      font-size: 22px;
    }

    .menu-footer{
      font-size: 35px;
    }

    .title-4{
      font-size: 45px;
    }
    
    .text-4{
      margin-top: -10px;
      gap: 10px;
    }

    .button-4 img{
      width: 20px;
      padding: 6px;
    }
  
}

@media (max-width: 685px){
  .container{
    width: 460px;
    padding: 10px;
    margin: 0 auto;

  }

  .title-1{
    font-size: 30px;
    width: 440px;
  }

  .text-1, .text-2, .text-3, .text-4, .text-payments p{
    font-size: 20px;
    width: 420px;
    display: flex;
    flex-direction: column;
  }

    .button-1, .button-2, .button-3, .button-4{
      width: 210px;
      height: 60px;
      font-size: 20px;
    }

  .title-2, .title-3{
    font-size: 30px;
  }

  .left, .right{
    display: none;
  }
  
  .comp-logo{
    margin-top: 100px;
  }

  .logos-1{
    gap: 55px;
  }

  .video{
    margin-top: 290px;
    width: 450px;
  }
  
  .text{
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .circle{
    width: 370px;
    height: 370px;
  }

  .circle::before{
    width: 400px;
    height: 400px;
  }

      .information{
      width: 400px;
      height: 200px;
    }

    .title-card{
      font-size: 25px;
      margin-top: -5px;
    }
    
    .text-card{
      font-size: 20px;
      width: 370px;
    }

    .button-card{
      font-size: 20px;
    }

  .icon-1, .icon-2, .icon-3{
  width: 65px;
  height: 65px;
  border-radius: 10px;
  top: 35px; 
}

.icon-1 img, .icon-2 img , .icon-3 img {
  height: 30px;
}

.text-circle{
  font-size: 25px;
  width: 240px;
}

.menu-footer{
  font-size: 30px;
 
}

.news{
  gap: 25px;
}

.title-4{
  font-size: 35px; 
}

.contacts{
  gap: 35px;
}

.contacts img{
  width: 50px;
}

.copyright-adaptation{
  font-size: 14px;
}

.client{
  width: 460px;
}

.section-one{
  overflow: hidden;
}
}

@media (max-width: 480px){
  .container{
    width: 300px;
    padding: 10px;
    margin: 0  auto;
  }

 .none{
  display: none;
 }

   .text-2, .text-3, .text-4, .text-payments p{
    font-size: 16px;
    width:300px;
    margin-top: 15px;
    margin-left: -20px;

  }

  .section-second p{
    margin-left: -20px;
  }

  .title-3{
    width: 300px;
  }

  .text-block{
    flex-direction: column;
    display: flex;
    justify-content: center;
  }

  .title-2, .title-3{
    font-size: 22px;
  }

  .text h1{
   font-size: 24px;
   width: 290px;
  }

  .text-4{
    margin-left: -5px;
  }

  .text{
    flex-direction: column;
  }

  .text p{
    font-size: 16px;
    width: 300px;
  }

  .buttons{
    gap: 10px;
  }

   .button-1, .button-2, .button-3, .button-4{
    width: 140px;
    height: 50px;
   font-size: 16px;
    }

    .comp-logo{
      margin-top: 50px;
    }

    .video{
      width: 320px;
      margin-top: 240px;
    }

    .logos-1 img{
      width: 60px;
    }

    .logos-1, .logos-2{
      gap: 50px;
    }

    .logos-2 img{
      height: 28px;
    }

    .logo{
      height: 50px;
    }

    .menu-footer{
      font-size: 22px;
      gap: 22px;
    }

    .title-4{
      font-size: 24px;
    }

    .text-4{
      margin-top: 5px;
    }

    .news{
      gap: 15px;
      margin-top: 30px;
    }

    .button-4::before{
      width: 222px;
    }

    .contacts{
      gap: 20px;
    }

    .news img{
      height: 40px;
    }

    .copyright-adaptation{
      font-size: 12px;
      width: 320px;
      margin-top: 10px;
    }
    
    .footer-inf{
    flex-direction: column;
    justify-content: center;
    margin-left: -15px;
    }

    .circle{
      width: 260px;
      height: 260px;
    }

    .circle::before{
      width: 280px;
      height: 280px;
      filter: blur(30px);
    }

    .text-circle{
      font-size: 18px;
      width: 180px;
      margin-bottom: -10px;
    }

        .information{
      width: 290px;
      height: 140px;
    }

    .title-card{
      font-size: 18px;

    }

    .card-block{
      padding: 0;
    }

    .text-card{
      font-size: 15px;
      width: 260px;
    }

    .button-card{
      font-size: 15px;
    }

    .button-card img{
      width: 10px;
    }

    .text-payments, .text-block{
      width: 320px;
    }

 

    .respond{
      width: 320px;
      overflow: hidden;
    }

    .stars img{
      width: 10px;
      height: 10px;
      gap: 2px;
    }

    .slick-slide{
      width: 300px;
    }

    .name{
      font-size: 15px;
    }

    .autoplay{
      width: 620px;
    }

    .section-fourth{
      overflow: hidden;
    }

    .navbar{
      height: 80px;
    }

    .section-second, .section-trird, .section-fourth, .section-fifth, .footer{
  margin-top: 50px;
}
}