.header{
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 100;
  background-color: var(--bg-base);
}
.header-wrap{
  display: flex;
  width: 100%;
  align-items: center;
  height: 72px;
  padding-top: 8px;
  padding-bottom: 8px;
}
.header-logo{
  max-width: 88px;
  width: 100%;
}
.header-nav{
  display: flex;
  align-items: center;
  margin-left: auto;
  gap: 0px 80px;
}
.header-nav__list{
  display: flex;
  flex-wrap: wrap;
  gap: 10px 32px;
}
.header-nav__list a:hover{
  color: var(--text-accent);
}
.header-nav__contact{
  display: flex;
  align-items: center;
  gap: 0px 24px;
}
.header-nav__contact a:hover{
  color: var(--text-accent);
}
.header-nav__contact ._btnPrimary{
  padding: 12px 10px;
  min-width: auto;
}
.header-login{
  margin-left: 12px;
  flex-shrink: 0;
}
.header-login__btn{
  width: 148px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 4px;
  padding: 5px;
  color: var(--bg-primary);
  border: solid 2px var(--bg-primary);
}
.header-login__btn:hover{
  background-color: var(--bg-primary);
  color: #fff;
}
.header-burger {
	 width: 44px;
	 height: 44px;
   background-color: var(--bg-secondary);
	 border-radius: 4px;
	 z-index: 10;
   position: relative;
   margin-left: 12px;
}
.header-burger > * {
	 pointer-events: none;
}
.header-burger span {
	 position: relative;
	 margin-top: 9px;
	 margin-bottom: 9px;
	 -webkit-user-select: none;
	 -moz-user-select: none;
	 -ms-user-select: none;
	 user-select: none;
	 position: absolute;
	 top: 50%;
	 left: 50%;
	 margin-left: -8px;
	 margin-top: -1.5px;
}
.header-burger span, .header-burger span::before, .header-burger span::after {
	 display: block;
	 width: 16px;
	 height: 2px;
	 border-radius: 5px;
	 background-color: var(--text-accent);
	 outline: 1px solid transparent;
	 -webkit-transition-property: background-color, -webkit-transform;
	 -moz-transition-property: background-color, -moz-transform;
	 -o-transition-property: background-color, -o-transform;
	 transition-property: background-color, transform;
	 -webkit-transition-duration: 0.3s;
	 -moz-transition-duration: 0.3s;
	 -o-transition-duration: 0.3s;
	 transition-duration: 0.3s;
}
.header-burger span::before, .header-burger span::after {
	 position: absolute;
	 content: "";
}
.header-burger span::before {
	 top: -6px;
}
.header-burger span::after {
	 top: 6px;
}
.header-burger.clicked span {
	 background-color: transparent;
}
.header-burger.clicked span::before {
	 -webkit-transform: translateY(6px) rotate(45deg);
	 -moz-transform: translateY(6px) rotate(45deg);
	 -ms-transform: translateY(6px) rotate(45deg);
	 -o-transform: translateY(6px) rotate(45deg);
	 transform: translateY(6px) rotate(45deg);
}
.header-burger.clicked span::after {
	 -webkit-transform: translateY(-6px) rotate(-45deg);
	 -moz-transform: translateY(-6px) rotate(-45deg);
	 -ms-transform: translateY(-6px) rotate(-45deg);
	 -o-transform: translateY(-6px) rotate(-45deg);
	 transform: translateY(-6px) rotate(-45deg);
}
.header-burger:hover {
	 cursor: pointer;
}
@media (max-width: 1199px) {
  .header-nav{
    gap: 0px 22px;
  }
  .header-nav__list{
    gap: 10px 16px;
  }
 
} 
@media (max-width: 991px) {
  .header-wrap{
    height: 60px;
  }
  .header-logo{
    max-width: 64px;
  }
  .header-nav {
      background-color: var(--bg-surface);
      position: fixed;
      flex-wrap: wrap;
      z-index: 9;
      top: 60px;
      left: 0;
      box-shadow: 0px 14px 10px rgba(0, 0, 0, 0.25);
      height: calc(100% - 60px);
      max-width: 515px;
      width: 100%;
      padding: 32px 32px;
      overflow-y: auto;
      -webkit-transform: translateX(-100%);
      -moz-transform: translateX(-100%);
      -ms-transform: translateX(-100%);
      -o-transform: translateX(-100%);
      transform: translateX(-100%);
      -webkit-transition: transform 0.55s cubic-bezier(0.785, 0.135, 0.15, 0.86);
      -moz-transition: transform 0.55s cubic-bezier(0.785, 0.135, 0.15, 0.86);
      -o-transition: transform 0.55s cubic-bezier(0.785, 0.135, 0.15, 0.86);
      transition: transform 0.55s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  }
  .header-nav.show {
    -webkit-transform: translateX(0px);
    -moz-transform: translateX(0px);
    -ms-transform: translateX(0px);
    -o-transform: translateX(0px);
    transform: translateX(0px);
  }
  .header-nav__contact{
    margin-top: auto;
    padding-top: 32px;
    flex-wrap: wrap;
    gap: 16px;
    width: 100%;
    justify-content: space-between;
  }
  .header-login{
    margin-left: auto;
  }
  .header-login__btn{
    width: 140px;
    height: 44px;
  }
  .header-nav__item{
    width: 100%;
  }

}

.banner{
  padding: 17px 0;
  position: relative;
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  min-height: calc(100vh - 60px);
  position: relative;
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25)),  url(../img/banner-bg.webp);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  border-radius: 0px;
}
.banner-container{
  display: flex;
  align-items: center;
}
.banner-info{
  color: #fff;
  max-width: 802px;
  width: 100%;
  display: inline-block;
}
.banner-info__txt{
  max-width: 482px;
}
.banner-info__btns{
  display: flex;
  flex-wrap: wrap;
  gap: 16px 24px;
  padding-top: 0;
  padding-bottom: 8px;
}
@media (min-width: 768px) {
  .banner{
    padding: 70px 0;
  }
  .banner-info__btns{
   padding-top: 8px;
    padding-bottom: 12px;
  }
}
@media (min-width: 992px) {
  .banner{
      padding: 100px 0;
      min-height: calc(100vh - 72px);
  }
}
@media (max-width: 767px) {
.banner-info__btns a{
    width: 100%;
  }
}

.services-item{
  display: flex;
  height: 100%;
  width: 100%;
  padding: 16px;
  border-radius: 4px;
  flex-direction: column;
  gap: 24px 0px;
  background-color: var(--bg-surface);
}
.services-item__title{
  display: flex;
  justify-content: space-between;
  gap: 7px;
  letter-spacing: -0.025em;
  padding-bottom: 16px;
  border-bottom: solid 1px #E5E6E7;
}
.services-item__img{
  width: 100%;
  height: auto;
}
.services-item__title span{
font-weight: 400;
font-size: 16px;
line-height: 160%;
color: var(--text-secondary);
}
.services-item__list li {
  margin-bottom: 12px;
  letter-spacing: -0.025em;
}
.services-item__list li:last-of-type{
  margin-bottom: 0;
}
@media (max-width: 767px) {
  .services-item{
    gap: 16px 0px;
  }
}

.calcForm-wrap{
  padding: 24px;
  border-radius: 4px;
  background-color: var(--bg-surface);
}
.calcForm-title{
  display: flex;
  gap: 12px;
  align-items: center;
}
.calcForm-title ._sprite{
  font-size: 21px;
  flex-direction: 0;
}
.calcForm-result__wrap{
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  padding: 24px 24px;
  background-color: var(--bg-base);
  border-radius: 4px;
  margin-bottom: 24px;
  gap: 24px;
}
.calcForm-result__price{
  font-weight: 700;
  font-size: 27px;
  line-height: 130%;
}
.calcForm-result__details{
  width: 100%;
}
.calcForm-result__details li{
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 10px;
  padding-top: 11px;
  padding-bottom: 8px;
  margin-bottom: 8px;
  border-bottom: solid 1px #E5E6E7;
}
.calcForm-result__details li b{
  font-weight: 700;
  font-size: 21px;
  line-height: 140%;
  flex-shrink: 0;
  color: var(--text-primary);
}
.calcForm-info{
  background-color: var(--bg-base);
  padding: 24px;
  border-radius: 4px;
  margin-top: 8px;
  display: inline-block;
  width: 100%;
  margin-bottom: 24px;
}
.calcForm-info__title{
  display: inline-block;
  width: 100%;
  margin-bottom: 16px;
  font-weight: 700;
  font-size: 21px;
  line-height: 140%;
}
.calcForm-info__list li{
  position: relative;
  width: 100%;
  padding-left: 34px;
  margin-bottom: 12px;
}
.calcForm-info__list li:last-of-type{
  margin-bottom: 0;
}
.calcForm-info__list .icon{
  position: absolute;
  font-size: 20px;  
  top: 2px;
  left: 0;
  color: var(--text-accent);
}
.calcForm-submit{
  width: 100%;
}
.calcForm-submit button{
  width: 100%;
}
.calcForm-tip{
  margin-top: 12px;
  margin-bottom: 0;
}
@media (max-width: 767px) {
  .calcForm-wrap{
    padding: 16px;
  }
  ._form-group__switch-text{
    padding: 9.5px 10px;
  }
  .calcForm-result__wrap{
    padding: 16px;
  }
  .calcForm-resultBtn,
  .calcForm-resultBtn ._btnPrimary{
    width: 100%;
  }
  .calcForm-result__details{
    margin-bottom: 8px;
   }
  .calcForm-result__details li{
    padding-top: 8px;
    padding-bottom: 8px;
    margin-bottom: 0px;
  }
  .calcForm-info{
    margin-top: 0;
    padding: 16px;
  }
}

.portfolio-item{
  position: relative;
  width: 100%;
  height: 100%;
  background: var(--bg-surface);
  overflow: hidden;
  border-radius: 4px;
  min-height: 231px;
}
.portfolio-item__img{
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 1;
  object-fit: cover;
  object-position: center center;
}
.portfolio-item__holder{
  padding: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  height: 100%;
  width: 100%;
  border-radius: 4px;
  border: 1px solid #E5E6E7;
  position: absolute;
  top: 0;
  left: 0;
}
.portfolio-hidden{
  margin-top: 16px;
}
.portfolio-toggle__btn{
  margin-top: 32px;
}
@media (max-width: 991px) {
  .portfolio-item{
    min-height: 183px;
    max-height: 231px;
  }
  .portfolio-toggle__btn{
    margin-top: 24px;
  }
}


.process-item{
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  padding: 20px;
  border-radius: 4px;
  background-color: var(--bg-surface);
  height: 100%;
  min-height: 285px;
}
.process-item__info{
  margin-top: 64px;
  width: 100%;
}
.process-item__info-title{
  margin-bottom: 4px;
  font-weight: 700;
  font-size: 21px;
  line-height: 140%;
}
@media (max-width: 767px) {
  .process-item{
    padding: 16px;
    min-height: auto;
  }
  .process-item__info{
    margin-top: 24px;
  }
}

.price-item{
  display: flex;
  flex-wrap: wrap;
  background-color: var(--bg-surface);
  border-radius: 4px;
  padding: 24px;
  height: 100%;
}
.price-item__top{
  margin-bottom: 24px;
  width: 100%;
}
.price-item__bottom{
  width: 100%;
  margin-top: auto;
}
.price-item__title{
  display: inline-block;
  width: 100%;
  margin-bottom: 4px;
  font-weight: 700;
  font-size: 21px;
  line-height: 140%;
}
.price-item__list{
  padding-top: 12px;
  margin-bottom: 0;
}
.price-item__list li{
  position: relative;
  width: 100%;
  padding-left: 34px;
  margin-bottom: 12px;
}
.price-item__list .icon {
  position: absolute;
  font-size: 20px;
  top: 2px;
  left: 0;
  color: var(--text-accent);
}
.price-item__price{
  display: inline-block;
  width: 100%;
  font-weight: 700;
  font-size: 27px;
  line-height: 130%;
  margin-bottom: 32px;
}
.price-item__btn{
  width: 100%;
}
@media (max-width: 767px) {
  .price-item{
    padding: 16px;
  }
  .price-item__list{
    padding-top: 8px;
  }
}

.contact{
  padding-bottom: 0;
}
.contactForm-wrap {
    padding: 24px;
    border-radius: 4px;
    background-color: var(--bg-surface);
}
.contactForm-title__wrap{
  margin-bottom: 8px;
  display: inline-block;
  width: 100%;
}
.contactForm-submit button {
    width: 100%;
}
.contactForm-submit__agree{
  position: relative;
  margin-bottom: 20px;
  display: inline-block;
  width: 100%;
  cursor: pointer;
}
.contactForm-submit__agree input{
  display: none;
}
.contactForm-submit__agree-txt{
  position: relative;
  padding-left: 29px;
  display: inline-block;
}
.contactForm-submit__agree-txt:before{
  content: "";
  position: absolute;
  top: 2px;
  left: 0;
  width: 18px;
  height: 18px;
  border: solid 1.5px var(--text-secondary);
  border-radius: 3px;
}
.contactForm-submit__agree-txt a{
  color: var(--text-accent);
}
.contactForm-submit__agree-txt a:hover{
  text-decoration: underline;
}
.contactForm-submit__agree input:checked + .contactForm-submit__agree-txt:before{
  background-color: var(--bg-primary);
  border-color: var(--bg-primary);
  background-image: url('data:image/svg+xml,<svg width="8" height="7" viewBox="0 0 8 7" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M7.69238 0.0969585C7.61804 0.0539402 7.53493 0.024402 7.44778 0.0100315C7.36063 -0.00433895 7.27117 -0.00326025 7.18449 0.013206C7.09781 0.0296723 7.01562 0.0612034 6.94261 0.105998C6.8696 0.150793 6.80721 0.207974 6.75899 0.274274L2.97728 5.47159L1.13299 3.95117C1.06792 3.89752 0.991639 3.85583 0.908499 3.82847C0.825359 3.80112 0.736989 3.78863 0.648436 3.79172C0.469594 3.79796 0.300858 3.86729 0.17935 3.98446C0.057842 4.10163 -0.00648609 4.25704 0.0005174 4.4165C0.00752089 4.57595 0.0852823 4.7264 0.216695 4.83474L2.63825 6.83094C2.63825 6.83094 2.70777 6.8843 2.73994 6.90295C2.81428 6.946 2.89742 6.97556 2.98459 6.98995C3.07176 7.00434 3.16125 7.00327 3.24796 6.9868C3.33466 6.97033 3.41688 6.93879 3.48991 6.89398C3.56293 6.84917 3.62534 6.79196 3.67355 6.72563L7.89125 0.929179C7.9395 0.862897 7.97263 0.788789 7.98875 0.711088C8.00487 0.633388 8.00366 0.553618 7.98519 0.476334C7.96672 0.399051 7.93136 0.325769 7.88112 0.260674C7.83088 0.19558 7.76674 0.139949 7.69238 0.0969585Z" fill="white"/></svg>');
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 8px 8px;
}
@media (max-width: 767px) {
  .contactForm-wrap{
    padding: 16px;
  }
}


.footer{
  background-color: var(--bg-base);
}
.footer-top{
  padding-bottom: 16px;
  border-bottom: solid 1px #E5E6E7;
}
.footer-bottom{
  padding-top: 72px;
}
.footer-logo{
  max-width: 88px;
  margin-bottom: 16px;
}
.footer-contact{
  font-weight: 700;
  font-size: 36px;
  line-height: 120%;
  letter-spacing: -0.015em;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 16px 48px;
}
.footer-contact__link:hover{
  color: var(--text-accent);
}
.footer-txt{
  max-width: 435px;
}
.footer-wrap{
  display: flex;
  align-items: flex-start;
  width: 100%;
  justify-content: space-between;
  gap: 32px 150px;
}
.footer-list li{
  display: inline-block;
  width: 100%;
  margin-bottom: 12px;
}
.footer-list li:last-of-type{
  margin-bottom: 0;
}
.footer-list a:hover{
  color: var(--text-accent);
}
.footer-social__wrap{
  display: flex;
  gap: 16px;
  flex-shrink: 0;
}

@media (max-width: 1379px) {
  .footer-contact{
    font-size: 30px;
  }
  .footer-wrap {
      gap: 32px 50px;
  }
}
@media (max-width: 1199px) {
  .footer-contact {
      font-size: 27px;
      gap: 16px 16px;
  }
  .footer-top{
    border: none;
    padding-bottom: 16px;
  }
  .footer-bottom{
    padding-top: 16px;
  }
  
}
@media (max-width: 991px) {
  .footer-contact{
    padding-top: 16px;
    justify-content: flex-start;
  }
}
@media (max-width: 767px) {
  .footer-logo{
    max-width: 70px;
  }
  .footer-wrap{
    flex-wrap: wrap;
  }
}


._accordion {
	list-style: none;
	margin: 0 auto 2em;
	padding: 0;
	overflow: hidden;
}
._accordion-item{
  width: 100%;
  background-color: var(--bg-surface);
  margin-bottom: 24px;
  border-radius: 4px;
  padding-bottom: 32px;
}
._accordion-item:last-of-type{
  margin-bottom: 0;
}
._accordion-head {
	cursor: pointer;
  display: inline-block;
  position: relative;
  width: 100%;
  padding: 48px 68px 16px 48px;
  font-weight: 700;
  font-size: 21px;
  line-height: 140%;
  user-select: none;
}
._accordion-head .icon{
  font-size: 14px;
  position: absolute;
  top: 32px;
  right: 48px;
  bottom: 0;
  margin: auto;
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: 0.3s;
}
._accordion ._panel {
	display: none;
  padding: 0px 48px 16px 48px;
}
._accordion-item.is-open{
  background-color: var(--bg-secondary);
  color: var(--text-accent);
}
._accordion-item.is-open .icon{
  transform: rotate(90deg);
}
._accordion.is-open ._panel {
	display: block;
}
@media (max-width: 767px) {
  ._accordion-item{
    padding-bottom: 8px;
    margin-bottom: 16px;
  }
  ._accordion-head{
    padding: 24px 48px 16px 24px;
  }
  ._accordion-head .icon{
    top: 10px;
    right: 20px;
  }
  ._accordion ._panel {
      padding: 0px 24px 16px 24px;
  }
}


._form-group {
	 width: 100%;
}
._fg-mb{
  margin-bottom: 20px;
}
._form-group__input {
    width: 100%;
    height: 56px;
    background-color: transparent;
    outline: none;
    border-radius: 4px;
    font-family: 'Manrope', sans-serif;
    font-weight: 400;
    background-color: var(--bg-base);
    font-size: 16px;
    line-height: 160%;
    padding-left: 16px;
    padding-right: 16px;
    color: var(--text-primary);
    border: solid 1px #E5E6E7;
    transition: 0.3s;
}
._form-group__input::placeholder{
  color: var(--text-secondary);
}
._form-group__input:focus::placeholder {
  color: transparent;
}
._form-group__area {
    width: 100%;
    background-color: transparent;
    outline: none;
    border-radius: 4px;
    font-family: 'Manrope', sans-serif;
    font-weight: 400;
    background-color: var(--bg-base);
    font-size: 16px;
    line-height: 160%;
    padding: 16px;
    resize: none;
    height: 136px;
    color: var(--text-primary);
    border: solid 1px #E5E6E7;
    transition: 0.3s;
}
._form-group__area::placeholder{
  color: var(--text-secondary);
}
._form-group__area:focus::placeholder {
  color: transparent;
}
._form-group__switch-label{
  position: relative;
  margin: 0;
  cursor: pointer;
}
._form-group__switch-text{
  font-weight: 400;
  font-size: 14px;
  line-height: 180%;
  display: inline-block;
  border: solid 1px #E5E6E7;
  border-radius: 4px;
  padding: 10px 10px;
  background-color: var(--bg-base);
}
._form-group__switch{
  display: none;
}
._form-group__switch:checked + ._form-group__switch-text{
  color: var(--text-accent);
  background-color: var(--bg-secondary);
  border-color: var(--bg-secondary);
}
._form-group__wrap{
  display: flex;
  flex-wrap: wrap;
  width: fit-content;
  border: solid 1px #E5E6E7;
  border-radius: 4px;
  overflow: hidden;
}
._form-group__wrap ._form-group{
  width: auto;
}
._form-group__wrap ._form-group__switch-text{
  width: auto;
  border-radius: 0px;
  border: none;
}
._form-group__wrap2{
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 16px 16px;
}
._form-group__wrap2 ._form-group{
  width: auto;
}
._form-group__tip{
  margin-top: 4px;
  display: inline-block;
  width: 100%;
}
._form-group__holder{
  margin-bottom: 8px;
  display: inline-block;
  width: 100%;
}
._form-group.req_error input {
    border-color: rgba(195, 44, 3, 0.901);
}
._form-group.req_error .req__text,
._form-group.error_error .error__text {
    display: block;
}
._form-group .req__text,
._form-group .error__text {
	 display: none;
	 margin-top: 5px;
   margin-bottom: 5px;
	 color: rgba(195, 44, 3, 0.901);
}
@media (max-width: 767px) {
  ._fg-mb{
    margin-bottom: 16px;
  }
}
/* --- TABLE STYLE (Adaptive & Light Theme) --- */
.table-wrap {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  margin: 1.5rem 0;
  border-radius: 12px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.05);
  background: #fff;
}

/* Основной стиль таблицы */
table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.95rem;
  line-height: 1.4;
  color: #333;
  background: #fff;
  min-width: 600px; /* предотвращает сжатие колонок на мобилках */
}

th, td {
  padding: 12px 16px;
  border-bottom: 1px solid #e5e7eb;
  text-align: left;
  vertical-align: middle;
}

th {
  background-color: #f9fafb;
  font-weight: 600;
  color: #111827;
  white-space: nowrap;
}

/* Зебра для строк */
tbody tr:nth-child(even) {
  background-color: #fdfdfd;
}

tbody tr:hover {
  background-color: #f3f4f6;
}

/* Скругления и адаптивность */
.table-wrap::-webkit-scrollbar {
  height: 6px;
}
.table-wrap::-webkit-scrollbar-thumb {
  background: rgba(0,0,0,0.1);
  border-radius: 3px;
}

/* Адаптивное поведение */
@media (max-width: 768px) {
  table {
    min-width: 100%;
    font-size: 0.9rem;
  }
  th, td {
    padding: 10px 12px;
  }
}

/* Подписи/примечания */
.table-caption {
  font-size: 0.9rem;
  color: #6b7280;
  margin-top: 0.5rem;
  text-align: center;
}
