:root {
  --global_padding: 0 30px;
}

.home {
  position: relative;
}

.hero {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: var(--global_padding);
  min-height: 550px;
  height: 87vh;
}

.hero p {
  padding: 0;
  margin-bottom: 23px;
}

.hero h1 {
  margin-bottom: 30px;
  font-size: 18px;
  line-height: 25px;
}

.hero .heroButton {
  display: flex;
  align-items: center;
}

.hero .rating {
  display: none;
  align-items: center;
  gap: 6px;
  margin-bottom: 20px;
}

.hero img {
  height: 14px;
}

.hero .rating img {
  height: 14px;
  width: auto;
}

.hero .line {
  background-color: var(--black);
  height: 2px;
  margin-left: -30px;
  width: 100%;
}

@-webkit-keyframes ButtonMove {
  0% {
    margin-top: 0;
  }
  50% {
    margin-top: 5px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes ButtonMove {
  0% {
    margin-top: 0;
  }
  50% {
    margin-top: 5px;
  }
  100% {
    margin-top: 0;
  }
}

.hero .button_container {
  position: relative;
  width: 54px;
  height: 54px;
  margin-right: 5px;
  margin-left: 20px;
}

.hero .button {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: var(--black);
  width: 54px;
  height: 54px;
  border-radius: 50%;
  cursor: pointer;
  padding: 0;
}

.hero .button img {
  width: 17px;
  height: 22px;
  -webkit-animation: ButtonMove infinite 1s;
  animation: ButtonMove infinite 1s;
}

.hero .button_back{
  position: absolute;
  width: 54px;
  height: 54px;
  border-radius: 50%;
  border: 1px solid var(--black);
  top: 5px;
  left: 5px;
  z-index: -1;
}
.privalumai .button_back {
  position: absolute;
  top: 5px;
  left: 5px;
  right: -5px;
  bottom: -5px;
  height: 100%;
  border-radius: var(--button_border_radius);
  z-index: 1;
  border: 1px solid var(--black);
}
.aboutUs {
  display: flex;
  padding-top: 130px;
  padding-bottom: 130px;
  gap: 50px;
}

.aboutUs .content h3 {
  margin-bottom: 40px;
}

.aboutUs .content p {
  margin-bottom: 36px;
}

.aboutUs .content .aboutUsButton {
  padding-top: 20px;
}

.aboutUs .clients_logos {
  width: 100%;
  max-width: 540px;
}

.aboutUs .clients_logos .row {
  display: flex;
  padding-top: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid #e2e2e2;
}

.aboutUs .clients_logos .row:first-child {
  padding-top: 0;
}

.aboutUs .clients_logos .row:last-child {
  padding-bottom: 0;
  border-bottom: unset;
}

.aboutUs .clients_logos .row .column {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 310px;
  border-right: 1px solid #e2e2e2;
  height: 100px;
  padding: 0 20px;
}

.aboutUs .clients_logos .row .column img {
  max-width: 210px;
  max-height: 90px;
  height: auto;
  width: auto;
}

.aboutUs .clients_logos .row .column:last-child {
  border-right: unset;
}

.aboutUs .clients_logos__tablet .row {
  display: flex;
  padding-top: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid #e2e2e2;
}

.aboutUs .clients_logos__tablet .row:first-child {
  padding-top: 0;
}

.aboutUs .clients_logos__tablet .row:last-child {
  padding-bottom: 0;
  border-bottom: unset;
}

.aboutUs .clients_logos__tablet .row .column {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 310px;
  border-right: 1px solid #e2e2e2;
  height: 100px;
  padding: 0 20px;
}

.aboutUs .clients_logos__tablet .row .column img {
  max-width: 210px;
  max-height: 90px;
  height: auto;
  width: auto;
}

.aboutUs .clients_logos__tablet .row .column:last-child {
  border-right: unset;
}

.aboutUs .clients_logos__tablet {
  display: none;
  max-width: 768px;
  margin: auto;
  width: fit-content;
}

.savybes {
  background-color: #f3f3f3;
  padding: 80px 0;
}

.savybes_heading_block {
  display: flex;
  gap: 100px;
  align-items: end;
  margin-bottom: 40px;
}

.savybes_heading_block .h2 {
  max-width: 600px;
}

.savybes_blocks {
  display: flex;
  gap: 16px;
}

.savybes_block {
  flex: 1;
  background-color: #ffffff;
  padding: 24px 16px;
  border-radius: 8px;
}

.savybes_block h4 {
  margin-top: 24px;
}

.projects {
  background: linear-gradient(
    170.5deg,
    #3f3e3e 0.46%,
    #181818 31.32%,
    #181818 100%
  );
  padding-bottom: 58px;
}

.projects .headline {
  padding: 54px 30px 0 30px;
  margin-bottom: 40px;
  color: #ffffff;
  text-align: center;
}

.projects .container {
  padding: var(--global_padding);
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
}

.projects .container .project_block:nth-child(2n) {
  margin-top: 80px;
}

.projects .button {
  display: flex;
  justify-content: center;
}

.privalumai {
  padding-top: 100px;
  padding-bottom: 170px;
}

.privalumai .headline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 50px;
  margin-bottom: 40px;
}

.privalumai .headline .hedline_button {
  display: block;
}

.privalumai .privalumai_block {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  align-items: flex-start;
}
.privalumai .privalumai_block .caption3 {
  padding-bottom: 20px;
}
.privalumai_column.open .button_container {
  display: none;
}
.privalumai .privalumai_block .box {
  flex: 1;
  padding: 16px 20px;
  border-radius: 8px;
  background-color: #ffffff;
  min-width: 300px;
  box-shadow: 0px 2px 12px rgba(0, 0, 0, 0.08);
}
.privalumai_block  .button_container:active > .button_back,.heroButton  .button_container:active > .button_back {
  top: 0px;
  left: 0px;
  right: 0;
  bottom: 0;
}
.privalumai .button_container .button {
  padding: 9px 13px;
}

.privalumai .button_back {
  width: 36px;
  height: 36px;

}
.privalumai .button_container img {
  width: 12px;
  height: 19px;
}

.privalumai_column .h3 {
  max-width: 259px;
}
.privalumai_column_flex {
  display: flex;
  justify-content: space-between;
  align-items: end;
  width: 100%;
  min-height: 75px;
}
.privalumai .description{
  margin-top: 10px;
  font-size: 16px;
  color: #444;
}
.privalumai .bottom_button {
  display: none;
}
.feedbacks {
  padding-bottom: 100px;
}

.feedbacks .qoute {
  margin:0 0 30px auto;
}
.feedbacks .headline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: var(--global_container_width);
  margin:0 auto 40px;
}

.feedbacks .qoute img {
  height: 50px;
  width: 55px;
  background-size: contain;
}

.feedbacks.container {
  max-width: calc(var(--global_container_width) + 144px);
}

.feedbacks .slider_container .block {
  padding: 30px;
  border: 1px solid #e2e2e2;
  border-radius: 20px;
  background-color: #ffffff;
  margin-inline: 22px;
}

.services {
  display: flex;
  flex-direction: column;
  margin-bottom: 100px;
}

.services .headline {
  padding-top: 100px;
  margin-bottom: 60px;
}

.list_container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 31px 0;
  border-top: 1px solid #24242425;
  cursor: pointer;
  text-decoration: none;
  color: var(--black);
}

.list_container:first-child {
  border-top: unset;
}

.services .container:last-child {
  border-bottom: 1px solid #24242425;
}

.services .block {
  display: flex;
  align-items: center;
}

.services .block span {
  margin-right: 14px;
}

.list_container .line {
  width: 84px;
  height: 3px;
  margin-top: 7px;
  background-color: var(--black);
  transition: all 0.5s ease;
}

.list_container:hover .line {
  width: 100%;
}

.services .arrow {
  margin-left: 10px;
}

.services_content {
  display: flex;
  gap: 50px;
  width: 100%;
}

.services_content .list {
  width: 100%;
  max-width: 555px;
}
.services_content .images {
  flex: 1;
  display: flex;
  justify-content: center;
  align-items: center;
}

.services_content .images_block {
  position: relative;
  width: 100px;
  height: 100px;
}

.services_content .images img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  visibility: hidden;
  opacity: 0;
  max-width: 600px;
  height: auto;
  transition: all 0.4s linear;
}
.feedback_top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid #E2E2E2;
  margin-bottom: 24px;
  padding-bottom: 10px;
}
.feedback_top .title {
  margin-bottom: 8px;
}
.feedbacks .slick-dots {
  bottom: -56px;
}
.feedbacks .slick-dots li button:before {
  font-size: 11px;
}
.feedbacks  .slick-dots li {
  margin: 0 1px;
}
@media screen and (max-width: 1300px) {

  .services_content .images img {
    max-width: 500px;
  }
  .feedbacks .headline {
    padding: 0 30px;
  }
  .feedbacks.container {
    max-width: calc(var(--global_container_width) + 160px);
    padding: 0 20px;
  }
}

@media screen and (max-width: 1190px) {
  .projects .container .project_block:nth-child(2n) {
    margin-top: unset;
  }
  .feedbacks .headline {
    padding: 0 10px;
  }
  .feedbacks.container {
    max-width: calc(var(--global_container_width) + 160px);
    padding: 0 40px;
  }
  .services_content .images img {
    max-width: 400px;
  }

}

@media screen and (max-width: 1170px) {
  .aboutUs {
    flex-direction: column;
  }

  .aboutUs .clients_logos {
    display: none;
  }

  .aboutUs .clients_logos__tablet {
    display: block;
  }
  .feedbacks .slider_container .block {
    margin-inline: 10px;
  }

}

@media screen and (max-width: 1080px) {
  .services .h2 {
    text-align: center;
  }

  .services_content {
    justify-content: center;
  }
  .services_content .images {
    display: none;
  }

  .privalumai .bottom_button .button_container {
    text-align: center;
    margin:30px auto 0;
  }
}

@media screen and (max-width: 950px) {

  .savybes_heading_block {
    gap: 50px;
  }
  .feedbacks {
    padding-bottom: 30px;
  }

  .privalumai {
    padding-bottom: 120px;
  }
  .privalumai_column_flex {
    min-height: auto;
  }
}

@media screen and (max-width: 880px) {
  .feedbacks .qoute img {
    display: none;
  }
  .feedbacks .slider_container .block {
    margin-inline: 10px;
  }
  .feedbacks .headline {
    display: flex;
    text-align: center;
    flex-direction: column-reverse;
  }
  .header_rating {
    justify-content: center;
  }
  .feedbacks .slick-dots {
    bottom: -50px;
  }
  .aboutUs .clients_logos__tablet .column {
    width: 180px !important;
  }

  .aboutUs .clients_logos__tablet .column img {
    max-width: 180px !important;
    max-height: 60px !important;
  }

  .feedbacks .slick-dots {
    right: 0;
  }
}

@media screen and (max-width: 800px) {
  .savybes_heading_block {
    flex-direction: column;
    gap: 20px;
  }

  .savybes_heading_block .h2 {
    max-width: unset;
  }

  .savybes_blocks {
    flex-direction: column;
  }
}

@media screen and (max-width: 750px) {
  .aboutUs .clients_logos {
    display: block;
    margin: auto;
    width: fit-content;
  }
  .privalumai .bottom_button {
    display: block;
  }
  .aboutUs .clients_logos__tablet {
    display: none;
  }

  .privalumai .headline .hedline_button {
    display: none;
  }
  .conversation {
    padding: 32px 30px 70px 30px !important;
  }

}

@media screen and (min-width: 750px) {
  .hero {
    margin: auto;
    padding: 0 50px;
    max-width: calc(var(--global_container_width) + 100px);
  }

  .hero p {
    font-size: 70px;
    line-height: 70px;
    max-width: 600px;
  }

  .hero h1 {
    margin-bottom: 90px;
    font-size: 25px;
    line-height: 20px;
  }

  .hero .heroButton {
    width: 200%;
    transform: translateX(-50%);
  }

  .hero .button_container {
    width: 71px;
    height: 71px;
  }

  .hero .button {
    width: 71px;
    height: 71px;
  }
  .hero .button_container img {
    width: 22px;
    height: 29px;
  }

  .hero .button_back {
    width: 71px;
    height: 71px;
  }

  .projects {
    padding-bottom: 130px;
  }

  .projects .headline {
    padding: 130px 50px 0 50px;
    margin-bottom: 65px;
  }

  .projects .container {
    margin: auto;
    padding: 0 50px 35px 50px;
    max-width: calc(var(--global_container_width) + 100px);
    align-items: flex-start;
  }

  .feedbacks__desktop {
    display: flex;
  }

}

@media screen and (max-width: 650px) {

  .hero .rating {
    display: flex;
  }
}

@media screen and (max-width: 610px) {
  .aboutUs .clients_logos .row {
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .aboutUs .clients_logos .row .column {
    width: 119px;
    height: 80px;
    padding: 0 10px;
  }

  .aboutUs .clients_logos .row .column img {
    max-width: 119px;
    max-height: 48px;
  }
  .aboutUs .clients_logos .row .column:first-child img {
    padding-right: 16px;
  }
  .aboutUs .clients_logos .row .column:last-child img {
    padding-left: 16px;    
  }

  .privalumai {
    padding-top: 100px;
    padding-bottom: 150px;
  }

  .privalumai .headline {
    justify-content: center;
  }

  .privalumai .privalumai_block .box {
    min-width: 240px;
  }
}

@media screen and (max-width: 500px) {
  .savybes_heading_block {
    gap: 16px;
  }
}

@media screen and (max-width: 400px) {
  .feedbacks .slider_container .block {
    margin-right: 5px;
  }
}
