@charset "UTF-8";
/* CSS Document */

/* CLS fixes: reserve space for common images */
.header .logo img {
  height: 40px;
  width: auto;
  display: block;
}

footer .footer_logo img {
  height: auto;
  max-height: 60px;
  width: auto;
  max-width: 100%;
  object-fit: contain;
  display: block;
}

.header .phone img,
.header .whatsapp_link img,
.footer_socials .phone img,
.footer_socials .whatsapp_link img,
.aside_menu .phone img,
.aside_menu .whatsapp_link img {
  width: 20px;
  height: 20px;
}

@media (max-width: 750px) {
  .header .logo img {
    height: 32px;
  }
  footer .footer_logo img {
    max-height: 46px;
  }
}

/* Animation smoothing */
:root {
  --animate-duration: 0.65s;
  --animate-delay: 0.1s;
  --animate-repeat: 1;
}

html {
  scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}

.animate__animated {
  animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1);
  animation-fill-mode: both;
}

@media (prefers-reduced-motion: reduce) {
  .animate__animated {
    animation: none !important;
  }
  .animate {
    opacity: 1 !important;
    transform: none !important;
  }
}

/* Remove side gradients in projects slider */
.projects_swiper::before,
.projects_swiper::after {
  content: none !important;
  display: none !important;
}

/* Micro-animations */
.button,
.whatsapp_link,
.header .burger_btn,
.advantages_card,
.step,
.project,
.faq,
.prices table tr,
.project_prev,
.project_next,
.swiper_review_prev,
.swiper_review_next,
.image_1_container img,
.image_2_container img,
.cta_wrapper .image_container img,
.inner_project_swiper .inner_slide img,
.inner_review_swiper img {
  transition: transform 0.25s ease, box-shadow 0.25s ease, background-color 0.25s ease, border-color 0.25s ease,
    color 0.25s ease, opacity 0.25s ease;
  will-change: transform;
}

.button:hover,
.whatsapp_link:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 20px rgba(8, 20, 35, 0.12);
}

.header .burger_btn:hover {
  transform: translateY(-2px);
}

.advantages_card:hover,
.project:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 36px rgba(8, 20, 35, 0.12);
}

.advantages_card .icon_container {
  transition: transform 0.25s ease;
}

.advantages_card:hover .icon_container {
  transform: translateY(-2px) rotate(-2deg);
}

.step:hover {
  transform: translateX(4px);
}

.prices table tr:hover {
  background-color: rgba(242, 202, 72, 0.08);
}

.project_prev:hover,
.project_next:hover {
  transform: none;
}

.swiper_review_prev:hover,
.swiper_review_next:hover {
  transform: scale(1.06);
}

.image_1_container img:hover,
.image_2_container img:hover,
.cta_wrapper .image_container img:hover,
.inner_project_swiper .inner_slide img:hover,
.inner_review_swiper img:hover {
  transform: scale(1.02);
}

.faq_title {
  transition: color 0.25s ease;
}

.faq_title:hover {
  color: #081423;
}

.faq .arrow {
  transition: transform 0.25s ease;
}

.faq.open .arrow {
  transform: rotate(180deg);
}

.faq_content {
  display: block !important;
  max-height: 0;
  opacity: 0;
  transform: translateY(-6px);
  padding-top: 0;
  overflow: hidden;
  transition: max-height 0.45s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.25s ease, transform 0.35s ease,
    padding-top 0.35s ease;
}

.faq {
  overflow: hidden;
  transition: background-color 0.3s ease, border-color 0.3s ease, padding-bottom 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.faq_title {
  transition: color 0.25s ease, padding 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.faq.open .faq_title {
  padding-bottom: 20px !important;
}

.faq.open .faq_content {
  max-height: 1200px;
  opacity: 1;
  transform: translateY(0);
  padding-top: 8px;
}

a.button:focus-visible,
.whatsapp_link:focus-visible,
.project_prev:focus-visible,
.project_next:focus-visible,
.swiper_review_prev:focus-visible,
.swiper_review_next:focus-visible {
  outline: 2px solid #f2ca48;
  outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
  .button,
  .whatsapp_link,
  .header .burger_btn,
  .advantages_card,
  .step,
  .project,
  .faq,
  .prices table tr,
  .project_prev,
  .project_next,
  .swiper_review_prev,
  .swiper_review_next,
  .image_1_container img,
  .image_2_container img,
  .cta_wrapper .image_container img,
  .inner_project_swiper .inner_slide img,
  .inner_review_swiper img {
    transition: none !important;
    transform: none !important;
  }
}

