/*!
Theme Name: EZ2Group
Theme URI: pprintdim.com
Author: pprintdim.com
Author URI: pprintdim.com
Description: Description
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: best-garage-door
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready
*/
 
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Fonts
   ========================================================================== */

@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  src: url('assets/fonts/montserrat-v31-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 500;
  src: url('assets/fonts/montserrat-v31-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 600;
  src: url('assets/fonts/montserrat-v31-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 700;
  src: url('assets/fonts/montserrat-v31-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* inter-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  src: url('assets/fonts/inter-v20-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* inter-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  src: url('assets/fonts/inter-v20-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* inter-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  src: url('assets/fonts/inter-v20-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* Main
   ========================================================================== */
html {
   font-size: 16px;
   font-family: 'Montserrat',sans-serif;
   font-size: 16px;
   font-style: normal;
   scroll-behavior: smooth;
}

body {
   max-width: 1440px;
   margin: 0 auto;
   background: #D9D9D9;
}

body, * {
   font-family: inherit;
   font-size: inherit;
   font-style: normal;

}

:before,
:after {
   display: block;
   background-repeat: no-repeat;
}

:before,
:after,
* {
   box-sizing: border-box;
}
input[type="submit"],
button {
   display: flex;
   background: unset;
   border: unset;
   outline: unset;
}

button {
   padding: 0;
   margin: 0;
}

input[type="email"],
input[type="text"],
input[type="num"],
input[type="tel"] {
   display: flex;
   align-items: center;
   padding: 0 12px;
   height: 40px;
   line-height: 1.3;
   border: unset;
   outline: unset;
}

input:placeholder,
textarea:placeholder {
   font-family: inherit;
   font-size: inherit;
   font-weight: inherit;
   line-height: inherit;
   color: #BFBFBF;
}

ul,ol {
   margin: 0;
   padding: 0;
   display: flex;
   flex-direction: column;
}

li,p {
   display: inline-block;
}
h1,h2,h3,h4 {
   display: block;
   font-weight: 600;
   margin: 0;
}

h1 {
   font-size: 72px;
   line-height: 1.2;
}

h2 {
   font-size: 42px;
}

img {
   display: block;
   width: auto;
   height: auto;
}

a {
   text-decoration: unset;
}
a:hover {
   color: #00407F;
}
.menu li.active > a,
.menu li:hover > a {
   color: #00407F;
}
section {
   padding: 80px 0;
}

#wpadminbar .quicklinks ul {
   flex-direction: row;
}
#wpadminbar + #top-nav {
   top: 32px;
}

.swiper-wrapper {
   flex-direction: row;
}
.swiper {
   overflow: hidden;
}

@media (max-width: 768px) {
   section {
      padding: 45px 0;
   }

   h1 {
      font-size: 54px;
   }
}

@media (max-width: 520px) {

   h1 {
      font-size: 48px;
   }

   h2 {
      font-size: 32px;
   }
   input[type="email"], 
   input[type="text"], 
   input[type="num"], 
   input[type="tel"] {
      font-size: .9em;
   }
}

/* All classes
   ========================================================================== */
.container {
   padding: 0 24px;
   max-width: 1256px;
   margin: 0 auto;
}
.main-btn {
   display: flex;
   align-items: center;
   justify-content: center;
   min-height: 50px;
   padding: 0 20px;
   max-width: 220px;
   width: 100%;
   text-align: center;
   font-size: 1em;
   line-height: 1.1;
   border: 1px solid transparent;
   font-weight: 500;
   border-radius: 5px;
}

.main-btn.has-icon {
   gap: 0 7px;
}

.main-btn.white {
   background: #ffffff;
   border-color: #ffffff;
   color: #000000;
}

.main-btn.blue {
   border-color: #17A3D7;
   background: #17A3D7;
   
   color: #ffffff;
}
.main-btn.dark-blue {
   border-color: #005C86;
   background: #005C86;
   
   color: #ffffff;
}

.main-btn.darkblue {
   background: #003E63;
   border-color: #003E63;
   color: #ffffff;
}

.main-btn.only-border {
   background: transparent;
}

.main-btn.only-border.white {
   color: #ffffff;
}

.heading-title {
   text-align: center;
   display: block;
   margin-bottom: 45px;
}

.heading-titles .heading-title {
   margin-bottom: 0;
}

.heading-titles {
   margin-bottom: 35px;
   display: flex;
   flex-direction: column;
   gap: 12px 0;
   align-items: center;
}

.heading-subtitle {
   text-align: center;
   display: block;
   font-size: 1.1em;
   line-height: 1.2;
}

.form-group {
   display: flex;
   flex-direction: column;
   gap: 12px 0;
}


.form-group__input {
   border-bottom: 1px solid #D9D9D9!important;
   font-size: 1em;
   background: transparent;
   outline: unset;
   width: 100%;
}
.checkbox-group {
   display: flex;
   gap: 0 10px;
}
.checkbox-group__text {
   font-size: .9em;
   color: inherit;
   display: block;
}
.checkbox-group__text a {
   text-decoration: underline;
   color: #7BB2FF;
}
.checkbox-group__text * {
   display: inline;
   color: inherit;
   font-size: inherit;
   line-height: inherit;
}
.checkbox-group__input {
   margin: 0;
   accent-color: inherit;
   color: inherit;
   width: 20px;
   height: 20px;
   display: block;
   border: 1px solid #E3E3E3!important;
}

.checkbox-group__input:checked {
   accent-color: #083852;
}
@media (max-width: 520px) {

   .container {
      padding: 0 15px;
   }

    .heading-title {
      margin-bottom: 25px;
   }

   .main-btn {
      width: 100%;
      max-width: 100%;
   }

   .heading-subtitle {
      font-size: .9em;
   }
}

/* Thanks sec
   ========================================================================== */
.thanks-sec .container {
   min-height: 80vh;
   display: flex;
   justify-content: center;
   align-items: center;
}
.thanks-sec__main-block {
   max-width: 860px;
   border-radius: 16px;
   padding: 30px 24px;
   background: #ffffff;
   width: 100%;
}
.thanks-sec__page-title {
   margin-bottom: 20px;
   text-align: center;
}
.thanks-sec__content p {
   width: 100%;
}
.thanks-sec__btn {
   margin-left: auto;
   margin-right: auto;
}
/* Posts Card
   ========================================================================== */
.post-cards {
   display: grid;
   grid-gap: 35px;
   grid-template-columns: repeat(auto-fill,minmax(350px,1fr));
}
.post-card {
   display: flex;
   flex-direction: column;
}
.post-card__thumb {
   margin-bottom: 20px;
   overflow: hidden;
   display: block;;
}
.post-card__img {
   width: 100%;
   aspect-ratio: 1/.9;
   object-fit: cover;
}
.post-card__content {
   display: flex;
   flex-direction: column;
   gap: 12px 0;
}
.post-card__title {
   font-size: 1.1em;
   color: #001928;
   line-height: 1.3;
}
.post-card__excerpt {
   color: #5D5D5D;
   font-size: .9em;
   line-height: 1.3;
}
.post-card__btn {
   display: flex;
   align-items: center;
   gap: 0 8px;
   font-weight: 500;
   color: #00407F;
   line-height: 1.1;
   font-size: 1em;
   margin-top: 20px;
}
.post-card__btn svg {
   min-width: 24px;
   height: 24px;
}
@media (max-width:520px) {
   .post-cards {
      grid-template-columns: 100%;
   }
   .post-card__excerpt {
      font-size: .8em;
   }

   .post-card__img {
      aspect-ratio: 16/9;
   }
}
/* Blog section
   ========================================================================== */
.blog-sec__top-wrapper {
   display: flex;
   align-items: center;
   justify-content: space-between;
   width: 100%;
   margin-bottom: 24px;
}

.blog-sec .heading-title {
   text-align: left;
   margin-bottom: 0;
}

.blog-sec__btn {
   display: flex;
   align-items: center;
   gap: 0 12px;
   align-items: center;
   line-height: 1.2;
   font-weight: 500;
   color: #9E9E9E;
   font-size: 1em;
}

/* Small Content section
   ========================================================================== */
.sm-content-sec {
   background-color: #ffffff;
}

.sm-content-sec__content h2 + *,
.sm-content-sec__content h3 + *,
.sm-content-sec__content h4 + * {
   margin-top: 20px;
} 

.sm-content-sec__main-block {
   padding: 60px 0;
}
.sm-content-sec__content {
   max-height: 240px;
   overflow-y: auto;
   padding-right: 35px;
   -webkit-overflow-scrolling: auto;
   scrollbar-width: thin; /* Firefox */
   scrollbar-color: #828282 transparent; /* Firefox */
}

/* Chrome, Edge, Safari */
.sm-content-sec__content::-webkit-scrollbar {
   width: 3px;
}

.sm-content-sec__content::-webkit-scrollbar-track {
   background: transparent;
}

.sm-content-sec__content::-webkit-scrollbar-thumb {
   background-color: #828282;
   border-radius: 0; /* без скруглення */
}

.sm-content-sec__content ul,
.sm-content-sec__content ol {
   padding-left: 14px;
}

.sm-content-sec__content li {
   display: list-item;
   list-style-type: inherit;
}
.sm-content-sec__content li,
.sm-content-sec__content p,
.sm-content-sec__content span {
   font-size: 1em;
   line-height: 1.5;
}

@media (max-width: 768px) {
   .sm-content-sec__main-block {
      padding: 0;
   }
}
@media (max-width:520px) {
   .sm-content-sec__content h2 {
      font-size: 26px;
   }

   .sm-content-sec__content p,
   .sm-content-sec__content li,
   .sm-content-sec__content span {
      font-size: .9em;
   }
}
/* Post hero
   ========================================================================== */
.post-hero {
   background-size: cover;
   background-position: center;
   background-repeat: no-repeat;
   position: relative;
}
.post-hero:after {
   content: '';
   position: absolute;
   left: 0;
   top: 0;
   width: 100%;
   height: 100%;
   background-color: rgba(0, 0, 0, .6);
}
.post-hero__main-block {
   padding-top: 120px;
   padding-bottom: 60px;
   position: relative;
   z-index: 1;
   display: flex;
   flex-direction: column;
   gap: 13px 0;
}
.post-hero__page-title {
   color: #ffffff;
}

.post-hero__breadcrumbs {
   color: #FFFFFF;
   display: flex;
   flex-wrap: wrap;
   align-items: center;
   font-size: .9em;
   line-height: 1.1;
}

.post-hero__breadcrumbs * {
   color: inherit;
   font-size: inherit;
   display: flex;
   align-items: center;
}

.post-hero__breadcrumbs > *:after {
   content: '>';
   font-size: inherit;
   font-weight: inherit;
   color: inherit;
   line-height: inherit;
   margin: 0 5px;
}

.post-hero__breadcrumbs > *:hover:after {
   color: #ffffff;
}
@media (max-width: 768px) {
   .post-hero__page-title {
      font-size: 42px;
   }
}
@media (max-width: 520px) {
   .post-hero__main-block {
      gap: 0;
   }
   .post-hero__page-title {
      font-size: 30px;
   }
   .post-hero__breadcrumbs {
      font-size: .75em;
      margin-bottom: 12px;
   }
}
/* Content section
   ========================================================================== */
.content-sec__main-block {
   margin-top: 50px;
}
.post-sec__main-block,
.content-sec__main-block {
   padding: 50px 30px;
   background: #ffffff;
   margin-left: auto;
   margin-right: auto;
   max-width: 1200px;
   width: 100%;
   border-radius: 16px;
}

/* TEXT */

.content-sec p,
.post-sec p,
.content-sec li,
.post-sec li {
   font-size: 16px;
   line-height: 1.6;
   color: #333;
}

.content-sec p,
.post-sec p {
   margin: 0;
}

.content-sec p + *, 
.post-sec p + * {
   margin-top: 20px;
}

/* HEADINGS */

.post-sec h1,
.content-sec h1 {
   font-size: 36px;
   margin-bottom: 20px;
}

.post-sec h2,
.content-sec h2 {
   font-size: 28px;
   margin-bottom: 20px;
}

.post-sec h3,
.content-sec h3 {
   font-size: 22px;
   margin-bottom: 16px;
}

.post-sec h4,
.content-sec h4 {
   font-size: 18px;
   margin-bottom: 12px;
}

/* LISTS */

.post-sec ul,
.post-sec ol,
.content-sec ul,
.content-sec ol {
   padding-left: 20px;
   margin: 0;
}

.post-sec li,
.content-sec li {
   margin-bottom: 6px;
}

.post-sec li,
.content-sec li {
   list-style-type: inherit;
   display: list-item;
}

/* LINKS */

.post-sec a,
.content-sec a {
   color: #0073aa;
   text-decoration: underline;
}

.post-sec a:hover,
.content-sec a:hover {
   text-decoration: none;
}

/* IMAGES */

.post-sec img,
.content-sec img {
   max-width: 100%;
   height: auto;
   border-radius: 12px;
}

.post-sec img + *,
.content-sec img + * {
   margin-top: 20px;
}

/* BLOCKQUOTE */

.post-sec blockquote,
.content-sec blockquote {
   padding: 20px;
   border-left: 4px solid #0073aa;
   background: #f8f9fb;
   font-style: italic;
   margin: 0;
}

.post-sec blockquote + *,
.content-sec blockquote + * {
   margin-top: 20px;
}

/* TABLE */

.post-sec table,
.content-sec table {
   width: 100%;
   border-collapse: collapse;
   margin-top: 10px;
}

.post-sec th,
.post-sec td,
.content-sec th,
.content-sec td {
   border: 1px solid #ddd;
   padding: 10px;
   text-align: left;
}

.post-sec th,
.content-sec th {
   background: #f5f5f5;
}

/* CODE */

.post-sec code,
.content-sec code {
   background: #f4f4f4;
   padding: 2px 6px;
   border-radius: 4px;
   font-size: 14px;
}

.post-sec pre,
.content-sec pre {
   background: #1e1e1e;
   color: #fff;
   padding: 20px;
   overflow-x: auto;
   border-radius: 10px;
}

/* HR */

.post-sec hr,
.content-sec hr {
   border: none;
   height: 1px;
   background: #ddd;
   margin: 30px 0;
}

/* SMALL / MARK */

.post-sec small,
.content-sec small {
   font-size: 13px;
   color: #777;
}

.post-sec mark,
.content-sec mark {
   background: #fff3cd;
   padding: 2px 4px;
}

/* SPACING FIXES */

.post-sec ol + *,
.post-sec ul + *,
.content-sec ol + *,
.content-sec ul + *,
.post-sec table + *,
.content-sec table + * {
   margin-top: 20px;
}

@media (max-width: 520px) {
   .post-sec__main-block, 
   .content-sec__main-block {
      padding: 24px 16px;
   }

   .post-sec th, 
   .post-sec td, 
   .content-sec th, 
   .content-sec td {
      font-size: .9em;
   }

   .post-sec pre, 
   .content-sec pre {
      padding: 12px;
      font-size: .9em;
   }

   .post-sec h1, 
   .content-sec h1 {
      font-size: 28px;
   }
   .post-sec h2, 
   .content-sec h2 {
      font-size: 24px;
      margin-bottom: 12px;
   }
   .post-sec h3, 
   .content-sec h3 {
      font-size: 20px;
   }
   .post-sec h4, 
   .content-sec h4 {
      font-size: 18px;
   }
   .content-sec p, 
   .post-sec p, 
   .content-sec li,
   .post-sec li {
      font-size: .9em;
   }

   .content-sec p + *, 
   .post-sec p + * {
      margin-top: 12px;
   }


}

/* Top Nav
   ========================================================================== */

.top-nav {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   z-index: 111;
}

.menu-open .top-nav,
.top-nav.fixed {
   position: fixed;
}
#wpadminbar + #top-nav:after,
body:not(.home) .top-nav:after,
.menu-open .top-nav:after,
.top-nav.fixed:after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    backdrop-filter: blur(10px); /* правильно */
    background: rgba(0, 0, 0, 0.6);
}

.top-nav__menu {
   flex-direction: row;
   gap:0 30px;
   justify-content: center;
   align-items: center;
   width: 100%;
}

.top-nav__menu li a {
   color: #ffffff;
   font-weight: 500;
   font-size: 1em;
}

.top-nav__main-block {
   position: relative;
   z-index: 1;
   min-height: 85px;
   display: grid;
   grid-gap: 0 20px;
   grid-template-columns: max-content 1fr max-content;
   align-items: center;
   justify-content: space-between;
}
.top-nav__btn.only-border {
   background: #313D4D;
}
.top-nav__btn {
   border: 0.6px solid #FFFFFF;
   min-width: max-content;
   border-radius: 10px;
}

.top-nav__logo {
   display: block;
}
.top-nav__logo-img {
   display: block;
   height: 70px;
   max-width: 100px;
}

.top-nav__burger-btn {
   display: none;
}

.top-nav__buttons-column {
   display: flex;
   align-items: center;
   gap: 0 30px;
}

.top-nav__switcher {
   display: grid;
   grid-template-columns: repeat(3,max-content);
   align-items: center;
   grid-gap: 0 12px;
   height: 40px;
   padding: 0 20px;
   background: #FFFFFF;
   border-radius: 40px;
   cursor: pointer;
}
.top-nav .switcher__btn {
   min-width: 50px;
   height: 24px;
   position: relative;
   cursor: pointer;
   border-radius: 24px;
   border: 2px solid #00407F;
}

.top-nav .switcher__btn span {
   display: block;
   position: absolute;
   left: -2px;
   top: -2px;
   width: 24px;
   height: 24px;
   border-radius: 50%;
   background-color: #00407F;
   transition: left .4s;
}

.top-nav .switcher.active .btn span {
   left: calc(100% - 22px);
}

.top-nav .switcher svg {
   width: 28px;
   height: 28px;
}

.top-nav .switcher.active .right-icon,
.top-nav .switcher:not(.active) .left-icon {
   color: #00407F;
}
.top-nav .switcher.active .left-icon,
.top-nav .switcher:not(.active) .right-icon {
   color: #BFBFBF;
}

@media (max-width: 1080px) {
   .top-nav__menu {
      display: none;
   }

   .top-nav__burger-btn {
      display: flex;
      align-items: center;
      justify-content: center;
      position: relative;
      padding: 0;
   }

   .menu-open .top-nav__burger-btn svg {
      opacity: 0;
      width: 24px;
      height: 24px;
   }

   .menu-open .top-nav__burger-btn:before,
   .menu-open .top-nav__burger-btn:after {
      position: absolute;
      content: '';
      background: #ffffff;
      width: 80%;
      height: 1px;

   }

   .menu-open .top-nav__burger-btn:before {
      transform: rotate(45deg);
   }
   .menu-open .top-nav__burger-btn:after {
      transform: rotate(-45deg);
   }

   .top-nav__btn {
      margin-left: auto;
   }
}

@media (max-width: 520px) {
   .top-nav__buttons-column {
      gap: 0 12px;
   }
   .menu-open .top-nav {
      background-color: rgba(0, 0, 0, .8);
   }
   .top-nav__logo-img {
      height: 45px;
   }
   .top-nav__main-block {
      min-height: 70px;
      display: flex;
      justify-content: space-between;
   }
   .top-nav__btn {
      display: none;
   }

   .top-nav__switcher {
      background-color: transparent;
      height: auto;
      padding: 0;
      gap: 0;
   }
   .top-nav .switcher__left-icon {
      display: none;
   }
   .top-nav .switcher__btn {
      border-color: #BFBFBF;
      order: 2;
   }


   .top-nav .switcher.active .btn {
      border-color: #ffffff;
   }

   .top-nav .switcher svg {
      width: 24px;
      height: 24px;
   }

   .top-nav .switcher__right-icon {
      order: 1;
      margin-right: 8px;
   }

   .top-nav .switcher.active .right-icon {
      color: #BFBFBF;
   }

   .top-nav .switcher__btn span {
      background-color: #BFBFBF;
   }

   .top-nav .switcher.active .btn span {
      background-color: #ffffff;
   }

}
/* BURGER MENU
   ========================================================================== */
.mob-menu-wrapper {
   position: fixed;
   visibility: hidden;
   overflow: hidden;
   width: 0;
   height: 0;
   display: flex;
   gap: 15px 0;
   flex-direction: column;
   z-index: -11111;
   max-width: 320px;
   right: -320px;
   transition: right .5s;
   border-top: 1px solid #ffffff;
}

.mob-menu-wrapper.active {
   z-index: 1111;
   visibility: visible;
   width: 100%;
   right: 0;
   height: fit-content;
}

.mob-menu-wrapper.active:after {
   content: '';
   position: absolute;
   left: 0;
   top: 0;
   width: 100%;
   height: 100%;
   backdrop-filter: blur(10px);
   background: rgba(0, 0, 0, 0.6);
}

.mob-menu-wrapper__main-block {
   position: relative;
   z-index: 1;
   padding: 30px 20px;
}

.mob-menu-wrapper__menu {
   display: flex;
   gap: 15px;
   flex-direction: column;
}

.mob-menu-wrapper__menu li a {
   color: #ffffff;
   font-size: 1.2em;
   font-weight: 500;
}

.mob-menu-wrapper__btn {
   margin-top: 20px;
   max-width: 100%;
}
@media (max-width: 520px) {
   .mob-menu-wrapper__menu li a {
      font-size: 1em;
   }

   .mob-menu-wrapper {
      max-width: 100%;
   }

   .mob-menu-wrapper.active:after {
      background-color: rgba(0, 0, 0, .8);
   }
}
/* HERO
   ========================================================================== */
.hero-sec {
   position: relative;
   overflow: hidden;
}
.hero-sec__text-wrapper {
   background: rgba(0, 0, 0, .6);
   position: absolute;
   left: 0;
   top: 0;
   width: 100%;
   height: 100%;
}

.hero-sec .container {
   height: 100%;
}
.hero-sec__main-block {
   height: 100%;
   display: flex;
   align-items: center;
}
.hero-sec * {
   color: #ffffff;
}

.hero-sec__img {
   height: 100vh;
   width: 100%;
   object-fit: cover;
}
.hero-sec__text-column {
   max-width: 1200px;
   display: flex;
   flex-direction: column;
   gap: 35px 0;
}
.hero-sec__top-wrapper {
   display: flex;
   flex-direction: column;
   gap: 35px 0;
}
.hero-sec__title-group {
   display: flex;
   flex-direction: column;
   gap: 8px 0;
}


.hero-sec__list {
   gap: 8px 0;
}
.hero-sec__list li {
   display: flex;
   align-items: center;
   gap: 0 6px;
   font-weight: 600;
   font-size: 18px;
   color: #FFFFFF;
   line-height: 1.2;
}
.hero-sec__list li:before {
   content: '';
   width: 24px;
   height: 24px;
   background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.4375 12.9375L9.8125 17.3125L18.5625 7.9375' stroke='%2300C04D' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}

.hero-sec__button-group {
   display: flex;
   flex-direction: column;
   gap: 20px 0;
} 
.hero-sec__text {
   font-size: 1em;
   line-height: 1;
}

.hero-sec__btn {
   max-width: 300px;
}
@media (max-width: 520px) {
   .hero-sec__text {
      font-size: .9em;
      line-height: 1.2;
      text-align: left;
   }
   .hero-sec__btn {
      max-width: 100%;
   }

   .hero-sec__sub-title {
      font-size: .9em;
   }

   .hero-sec__list li {
      font-size: .9em;
   }

   .hero-sec__img {
      height: 80vh;
   }
}
/* Benefits Section
   ========================================================================== */
.benefits-sec__main-block {
   max-width: 1260px;
   margin-left: auto;
   margin-right: auto;
}
.benefits-sec__list {
   flex-direction: row;
   flex-wrap: wrap;
   justify-content: center;
   gap: 25px;
   
}

.benefits-sec__item {
   padding-top: 70px;
   position: relative;
   flex: 1 1 calc(25% - 25px);
   min-width: 280px;
   padding: 25px 16px;
   background: #FFFFFF;
   box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.1);
   border-radius: 8px;
   display: flex;
   flex-direction: column;
   justify-content: space-between;
   gap: 25px 0;
}


.benefits-sec .item__text-group {
   display: flex;
   flex-direction: column;
   gap: 12px 0;
}


.benefits-sec .item__title {
   font-size: 20px;
   color: #001A28;
   line-height: 1.1;
}
.benefits-sec .item__descr {
   display: block;
   color: #5D5D5D;
   line-height: 1.4;
}


.benefits-sec .item__icon {
   width: 60px;
   height: 60px;

}
@media(max-width:520px) {
   .benefits-sec .item__title {
      font-size: 18px;
   }
   
   .benefits-sec .item__descr br,
   .benefits-sec .item__title br {
      display: none;
   }

   .benefits-sec .item__descr {
      font-size: .9em;
   }

   .benefits-sec .item__text-group {
      gap:8px 0;
   }

   .benefits-sec .item__icon {
      width: 45px;
      height: 45px;
   }
}

/* Projects Section
   ========================================================================== */

.projects-sec {
   background: #ffffff;
}
.projects-sec .swiper__swiper-wrapper {
   display: grid;
   grid-gap: 20px;
   grid-template-columns: repeat(auto-fill,minmax(280px, 1fr));
}

.projects-sec .swiper__next-btn,
.projects-sec .swiper__prev-btn {
   display: none;
}

.projects-sec .swiper__swiper-slide,
.projects-sec .swiper .swiper-slide__link {
   display: block;
}


.projects-sec .swiper .swiper-slide__link {
   overflow: hidden;
}


.projects-sec .swiper .swiper-slide__img {
   transition: transform .5s;
   object-fit: cover;
   width: 100%;
   aspect-ratio: 1/1.2;
   transform: scale(1);
}

.projects-sec .swiper .swiper-slide:hover .img {
   transform: scale(1.1);
}
@media (max-width: 768px) {

   .projects-sec .swiper {
      padding: 0 12px;
      position: relative;
   }
   .projects-sec .swiper__next-btn,
   .projects-sec .swiper__prev-btn {
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 32px;
      height: 32px;
      top: 50%;
      transform: translateY(-50%);
      position: absolute;
      z-index: 11;
      background: rgba(243, 243, 243, 0.8);
      border-radius: 50%;
   }
   .projects-sec .swiper__next-btn {
      right: 0;
   }
   .projects-sec .swiper__next-btn svg {
      transform: scale(-1,1);
   }
   .projects-sec .swiper__prev-btn {
      left: 0;
   }
   .projects-sec .swiper__swiper-wrapper {
      display: flex;
      grid-gap: 0;
   }

   .projects-sec .swiper-pagination-bullets {
      position: unset;
      transform: unset!important;
      margin-top: 15px;
      margin-left: auto;
      margin-right: auto;
   }

   .projects-sec .swiper-pagination-bullet {
      width: 8px;
      height: 8px;
   }

   .projects-sec .swiper-pagination-bullet-active {
      background: #FA6A17;
   }

   .projects-sec .swiper .swiper-slide__img {
      aspect-ratio: 1/1;
   }

   .benefits-sec__bottom-group {
      padding-top: 24px;
   }

   .benefits-sec .bottom-group__btn {
      max-width: 100%;
   }

   .benefits-sec .bottom-group__title {
      font-size: 18px;
      text-align: center;
   }
}

/* Footer
   ========================================================================== */
.footer,
.subfooter {
   background: #00131E;
}
.footer * {
   color: #FFFFFF;
}

.footer__main-block {
   padding: 60px 0;
}

.footer__columns {
   display: grid;
   grid-gap: 0 100px;
   grid-template-columns: repeat(2, 1fr);
}

.footer__heading-title {
   text-align: center;
}
.footer__left-column {
   display: flex;
   flex-direction: column;
   gap: 25px 0;
}
.footer__title {
   font-size: 25px;
}
.footer__contacts-flex {
   display: flex;
   flex-direction: column;
   gap: 15px 0;

}
.footer__email,
.footer__phone,
.footer__address,
.footer__open {
   font-weight: 400;
   font-size: .85em;
   color: #FFFFFF;
}
.footer__contacts-wrapper {
   display: flex;
   flex-wrap: wrap;
   gap: 15px 20px;
}

.footer__contacts-wrapper > * {
   flex: 1 1 calc(33.3% - 20px);
   min-width: 120px;
}

.footer__submit-btn {
   width: 100%;
}
.footer__map-block {
   overflow: hidden;
   background: grey;
   width: 100%;
   height: 300px;
}
.footer__map-block iframe {
   height: 100%;
   display: block;
   border: unset!important;
}
.footer__form {
   display: flex;
   flex-direction: column;
   gap: 40px 0;
}

.footer__fields-group {
   display: flex;
   flex-direction: column;
   gap: 20px 0;
}
.footer__button-group {
   display: flex;
   flex-direction: column;
   gap: 20px 0;
}
.footer .form__submit-btn {
   max-width: 100%;
}
.subfooter {
   border-top: 1px solid #DEDEDE;
}
.subfooter__main-block {
   padding: 30px 0;
   display: flex;
   align-items: center;
   justify-content: center;
}
.subfooter__powered {
   text-align: center;
   font-size: .9em;
   color: #DEDEDE;
   text-align: center;
}

.footer__form-text-wrapper {
   display: flex;
   flex-direction: column;
   gap: 12px 0;
}
.footer__title {
   font-size: 25px;
}

.footer__descr {
   font-size: 1em;
}

@media (max-width: 1080px) {
   .footer__columns {
      grid-gap: 0 30px;
   }
}

@media (max-width: 768px) {
   .footer__columns {
      display: flex;
      flex-direction: column;
      gap: 30px 0;
   }
   .footer__right-column{
      order: 1;
   }
   .footer__left-column  {
      order: 2;
   }
}

@media (max-width: 520px) {
   .footer__form-text-wrapper {
      margin-bottom: 30px;
   }
   .footer__contacts-wrapper {
      flex-direction: column;
      gap: 15px;
   }

   .footer__main-block {
      padding: 30px 0;
   }

   .footer__map-block {
      height: 200px;
   }

   .footer__title {
      font-size: 22px;
   }
}
/* Reviews Section
   ========================================================================== */
.reviews-sec__top-group {
   display: flex;
   justify-content: space-between;
}
.reviews-sec__top-group > * {
   display: flex;
   flex-direction: column;
   gap: 10px 0;
}

.reviews-sec__rating-group {
   display: flex;
   gap: 0 10px;
   align-items: center;
}
.reviews-sec__b-name,
.reviews-sec__total-r {
   display: block;
   font-size: 12px;
   opacity: .5;
   line-height: 1.1;
}

.reviews-sec__title {
   display: flex;
   gap: 0 8px;
   align-items: center;
   font-size: 22px;
   font-weight: 500;
   line-height: 1.1;
}
.reviews-sec__stars {
   flex-direction: row;
   gap: 0 6px;
}

.reviews-sec__stars li {
   height: fit-content;
   width:fit-content;
}
.reviews-sec__stars svg {
   color: #FFC107;
}
.reviews-sec__title span {
   font-weight: inherit;
   color: inherit;
   font-size: inherit;
   line-height: inherit;

}

.reviews-sec__write-btn {
   min-height: 45px;
   border-radius: 8px;
}

.reviews-sec__slider-block {
   margin-top: 30px;
   overflow: hidden;
   position: relative;
   padding: 0 40px;
}
.reviews-sec .slider-block__prev-btn,
.reviews-sec .slider-block__next-btn {
   top: 50%;
   position: absolute;
   transform: translateY(-50%);
}

.reviews-sec .swiper-wrapper {
   align-items: center;
}
.reviews-sec .slider-block__next-btn {
   right: 0;
  
}
.reviews-sec .slider-block__prev-btn {
   left: 0;
}

.reviews-sec .slider-block__next-btn svg {
   transform: scale(-1,1);
}
.reviews-sec .swiper-slide__rating {
   flex-direction: row;
   align-items: center;
   gap: 0 4px;
}
.reviews-sec .swiper-slide__btn {
   max-width: 100%;
   min-height: 35px;
   font-size: 1em;
   border-radius: 8px;
}
.reviews-sec .swiper-slide__rating svg {
   color: #FFC107;
   width: 20px;
   height: 20px;
}

.reviews-sec .swiper {
   padding: 4px;
}
.reviews-sec .swiper__swiper-slide {
   height: auto;
   box-sizing: border-box;
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   gap: 15px 0;
   padding: 24px;
   background: #FFFFFF;
   border: 0.5px solid #D9D9D9;
   box-shadow: 0px 28px 11px rgba(0, 0, 0, 0.01), 0px 16px 9px rgba(0, 0, 0, 0.05), 0px 7px 7px rgba(0, 0, 0, 0.09), 0px 2px 4px rgba(0, 0, 0, 0.1);
   border-radius: 10px;
}
.reviews-sec .swiper-slide__top-group {
   width: 100%;
   display: flex;
   align-items: center;
   gap: 0 14px;
   justify-content: space-between;
}
.reviews-sec .swiper-slide__text-group {
   display: flex;
   gap: 8px 0;
   flex-direction: column;
}
.reviews-sec .swiper-slide__name {
   display: block;
   font-weight: 600;
   color: #1A1A1A;
   font-size: .95em;
}
.reviews-sec .swiper-slide__date {
   font-size: 12px;
   line-height: 1.1;
   display: block;
   opacity: .5;
}

.reviews-sec .swiper-slide__avatar {
   width: 40px;
   height: 40px;
}

.reviews-sec .swiper .swiper-slide__descr {
   line-height: 1.2;
   color: #1A1A1A;
   font-size: .9em;
   overflow: hidden;
   display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    overflow: hidden; 
    text-overflow: ellipsis; 
    color: #5D5D5D;
}
.reviews-sec .swiper-slide__g-icon {
   width: 24px;
   height: 24px;
}
@media (max-width: 768px) {
   .reviews-sec .swiper-wrapper {
      align-items: unset;
   }

   .reviews-sec .swiper .swiper-slide__descr {
      height: 50px;
      -webkit-line-clamp: 3; 
      -webkit-box-orient: vertical;
   }
}
@media (max-width: 520px) {
   .reviews-sec__g-logo {
      max-width: 80px;
   }

   .reviews-sec .swiper .swiper-slide__descr {
      font-size: .9em;
   }

   .reviews-sec__title {
      font-size: 1.1em;
   }

   .reviews-sec__stars svg {
      width: 15px;
      height: 15px;
   }

   .reviews-sec .swiper-slide__rating svg {
      width: 15px;
      height: 15px;
   }
   .reviews-sec__slider-block {
      padding: 0 24px;
   }

   .reviews-sec__write-btn {
      font-size: .9em;
   }

}

@media (max-width: 430px) {
   .reviews-sec__top-group {
      max-width: 230px;
      margin-left: auto;
      margin-right: auto;
      align-items: center;
      flex-direction: column;
      gap: 15px 0;
   }

   .reviews-sec__title {
      justify-content: center;
   }

   .reviews-sec__b-name {
      display: none;
   }

   .reviews-sec__top-group > * {
      gap: 0;
   }
}
/* Banner Section
   ========================================================================== */
.banner-sec {
   background: #B7E7F3;
   padding: 0;
}

.banner-sec__columns {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 0 60px;
   padding: 20px 0;
}
.banner-sec__img {
   width: 100%;
   max-width: 400px;
   height: auto;
   object-fit: contain;
}
.banner-sec__main-block {
   max-width: 1120px;
   margin-right: auto;
   margin-left: auto;
}

.banner-sec__text-wrap {
   display: flex;
   gap: 20px 0;
   flex-direction: column;
   align-items: center;
   justify-content: center;
}
.banner-sec__title {
   font-weight: 600;
   line-height: 1.4;
   font-size: 30px;
   text-align: center;
   color: #001928;
}
.banner-sec__btn {
   border-radius: 12px;
   max-width: 320px;
   width: 100%;
}

@media (max-width: 920px) {
   .banner-sec__columns {
      display: block;
   }

   .banner-sec__img {
      margin-left: auto;
      margin-right: auto;
      margin-bottom: 30px;
   }
}
@media (max-width: 520px) {
   .banner-sec__title {
      font-size: 20px;
   }
}

/* FAQ Section
   ========================================================================== */

.faq-sec {
   background-color: #ffffff;
}
.faq-sec__main-block {
   max-width: 880px;
   margin-left: auto;
   margin-right: auto;
}
.faq-sec__list {
   gap: 15px 0;
   width: 100%;
}
.faq-sec .list__item {
   padding: 16px 20px;
   background: #F3F3F3;
   border: 0.5px solid #D9D9D9;
   border-radius: 12px;
   overflow: hidden;
   position: relative;
   cursor: pointer;
   display: grid;
   grid-template-columns: max-content 1fr;
   width: 100%;
   gap: 0 16px;
}

.faq-sec .list .item__top-group {
   display: flex;
   justify-content: space-between;
   position: relative;
   z-index: 1;
}

.faq-sec .list__item.open {
   border: 0.5px solid #D9D9D9;
}

.faq-sec .list__item:after {
   content: '';
   position: absolute;
   left: 0;
   top: 0;
   width: 100%;
   height: 100%;
   background: #F3F3F3;
   backdrop-filter: blur(7.5px);
   width: 100%;
   height: 100%;
   border-radius: 12px;
}

.faq-sec .list__item.open:after {
   background: #FFFFFF;
   border: 1px solid #00B6ED;
   box-shadow: 0px 20px 20px -20px rgba(12, 46, 91, 0.35);
}

.faq-sec .list .item.open .icon__plus,
.faq-sec .list .item:not(.open) .icon__minus {
   display: none;
}
.faq-sec .list .item__icon {
   min-width: 24px;
}
.faq-sec .list .item__num {
   display: block;
   font-size: 32px;
   color: #000000;
   line-height: 1.1;
   position: relative;
   z-index: 1;
}

.faq-sec .list .item__answer {
   position: relative;
  display: grid;
  grid-template-rows: 0fr;
  overflow: hidden;
  transition: grid-template-rows 0.4s ease;
  font-size: .9em;
  line-height: 1.4;
  color: #5D5D5D;
  visibility: hidden;
  z-index: -1111;
}

.faq-sec .list .item__answer > * {
  overflow: hidden;
}

.faq-sec .list .item.open .item__answer {
   margin-top: 12px;
  grid-template-rows: 1fr;
  z-index: 1;
  visibility: visible;
}

@media (max-width: 520px) {
   .faq-sec .list__item {
      padding: 15px 12px;
   }

   .faq-sec .list .item__num {
      font-size: 26px;
   }

   .faq-sec .list .item__answer {
      font-size: .8em;
      line-height: 1.1;
   }
}

/* Products Section
   ========================================================================== */

.products-sec__products-list {
   flex-direction: row;
   flex-wrap: wrap;
   gap: 30px;
}
.products-sec .products-list__card {
   min-width: 380px;
   flex: 1 1 calc(33.3% - 30px);
   padding: 10px 15px;
   background: #FFFFFF;
   border: 0.5px solid #D9D9D9;
   box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.1);
   border-radius: 4px;
   display: flex;
   flex-direction: column;
   gap: 25px 0;
}
.products-sec .card__img {
   max-width: 100%;
   width: 100%;
   height: 240px;
   object-position: center;
   object-fit: cover;
}
.products-sec .card__title {
   text-align: center;
   line-height: 1.1;
   font-weight: 600;
   font-size: 26px;
   color: #000000;
}
.products-sec .card__bottom-group {
   display: flex;
   flex-direction: column;
   gap: 15px 0;
}

.products-sec .card__price {
   text-align: center;
   display: block;
   font-weight: 500;
   font-size: 24px;
   text-decoration-line: underline;
   color: 1976D2;
}
.products-sec .card__list li {
   line-height: 1.1;
   font-size: .9em;
   font-weight: 500;
   color: #5D5D5D;
   display: block;
   padding: 12px 16px;
   border-bottom: 1px solid #D9D9D9;
   position: relative;
}

.products-sec .card__list li:before {
   content: '';
   width: 5px;
   height: 5px;
   background-color: #5D5D5D;
   border-radius: 50%;
   position: absolute;
   left: 0;
   top: 50%;
   transform: translateY(-50%);
}

.products-sec .card__list li:first-child {
   border-top: 1px solid #D9D9D9;
}

.products-sec .card__order-btn {
   max-width: 100%;
   box-shadow: 0px 4px 11px rgba(0, 62, 99, 0.1);
}

.products-sec .card__order-btn:hover {
   box-shadow: 0px 4px 11px rgba(0, 62, 99, 0.4);
}
@media (max-width: 520px) {
   .products-sec__products-list {
      display: block;
      gap: 20px 0;
   }

    .products-sec__products-list .card {
      padding: 10px 15px;
      box-sizing: border-box;
      min-width: auto;
      flex: auto;
    }

    .products-sec__products-list .card + .card {
      margin-top: 24px;
    }

    .products-sec .card__img {
      height: auto;
      aspect-ratio: 1/1;
    }

    .products-sec .card__title {
      font-size: 22px;
    }
}