/* Home redesign — «Посмотрите, как меняются интерьеры»
   Figma: 360 / 768 / 1024 / 1280 / 1440 / 1920
   Before/after: jquery.twentytwenty (move_slider_on_hover)
*/

.bz-interiors {
  background-color: #1b1b1b;
  /* bottom: воздух после стрелок до следующей секции, не до стрелок. Figma: кнопка → низ секции = 120px */
  padding: 120px 10px 120px;
  margin: 0;
  box-sizing: border-box;
  color: #ffffff;
}

.bz-interiors__head {
  display: flex;
  flex-direction: column;
  gap: 24px;
  margin-bottom: 30px;
}

.bz-interiors__title {
  margin: 0 auto;
  max-width: 340px;
  color: #ffffff;
  font-family: Inter, sans-serif;
  font-size: 24px;
  font-weight: 500;
  line-height: 1.3;
  letter-spacing: 0;
  text-transform: uppercase;
  text-align: center;
}

.bz-interiors__lead {
  display: none;
  margin: 0;
  color: #a4a4a4;
  font-family: Inter, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: -0.02em;
}

.bz-interiors__all {
  display: none;
  align-items: center;
  justify-content: center;
  height: 48px;
  padding: 10px 20px;
  border-radius: 40px;
  background-color: var(--bz-prim, #f27e00);
  box-sizing: border-box;
  color: #ffffff;
  font-family: Inter, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.4;
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
}

.bz-interiors__all:hover,
.bz-interiors__all:focus {
  background-color: var(--bz-prim-hov, #ff9521);
  color: #ffffff;
  text-decoration: none;
}

.bz-interiors__swiper {
  overflow: hidden;
  width: 100%;
  margin-bottom: 0;
  padding-bottom: 0;
}

.bz-interiors__swiper > .swiper-wrapper {
  margin-bottom: 0;
  padding-bottom: 0;
}

.bz-interiors__pair {
  display: flex;
  flex-direction: column;
  gap: 30px;
}

.bz-interiors__compare {
  position: relative;
  width: 100%;
  border: 1px solid #ffffff;
  box-sizing: border-box;
  overflow: hidden;
  background: #2d2c2c;
}

.bz-interiors__tt {
  width: 100%;
}

.bz-interiors__tt .before-after-img,
.bz-interiors .twentytwenty-container img {
  width: 100%;
  height: 400px;
  max-height: none;
  min-height: 0;
  object-fit: cover;
}

.bz-interiors .twentytwenty-wrapper {
  width: 100% !important;
}

.bz-interiors .twentytwenty-container {
  height: 400px !important;
}

.bz-interiors .twentytwenty-before-label,
.bz-interiors .twentytwenty-after-label {
  opacity: 1!important;
}

.bz-interiors .twentytwenty-before-label:before,
.bz-interiors .twentytwenty-after-label:before {
  background: #1b1b1b;
  color: #ffffff;
  font-family: Inter, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.4;
  padding: 4px 10px;
  border-radius: 0;
  text-transform: none;
  /* сброс дефолта twentytwenty: top:50% + margin-top:-19px */
  margin: 0;
}

.bz-interiors .twentytwenty-horizontal .twentytwenty-before-label:before {
  /* Figma 360: left/top 16 внутри кадра 340×400 */
  top: 16px;
  left: 16px;
  bottom: auto;
  margin-top: 0;
}

.bz-interiors .twentytwenty-horizontal .twentytwenty-after-label:before {
  top: 16px;
  right: 16px;
  bottom: auto;
  margin-top: 0;
}

.bz-interiors .twentytwenty-handle {
  width: 48px;
  height: 48px;
  margin-left: -24px;
  margin-top: -24px;
  border: 0;
  background: #1b1b1b;
  box-shadow: none;
}

.bz-interiors .twentytwenty-horizontal .twentytwenty-handle:before,
.bz-interiors .twentytwenty-horizontal .twentytwenty-handle:after {
  width: 2px;
  background: #ffffff;
  margin-left: -1px;
  box-shadow: none;
}

.bz-interiors .twentytwenty-left-arrow,
.bz-interiors .twentytwenty-right-arrow {
  border-width: 6px;
}

.bz-interiors__info {
  background-color: #f7f6f1;
  color: var(--bz-b-100, #2d2c2c);
  padding: 16px;
  box-sizing: border-box;
}

.bz-interiors__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 12px;
  color: #7e7d7b;
  font-family: Inter, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: -0.02em;
}

.bz-interiors__project-title {
  margin: 0 0 16px;
  color: var(--bz-b-100, #2d2c2c);
  font-family: Inter, sans-serif;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.3;
  text-transform: uppercase;
}

.bz-interiors__desc {
  margin: 0 0 24px;
  color: var(--bz-b-100, #2d2c2c);
  font-family: Inter, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: -0.02em;
}

.bz-interiors__desc p {
  margin: 0 0 0.6em;
}

.bz-interiors__desc p:last-child {
  margin-bottom: 0;
}

.bz-interiors__results {
  margin-bottom: 24px;
}

.bz-interiors__results-label,
.bz-interiors__used-label {
  margin: 0 0 12px;
  color: #7e7d7b;
  font-family: Inter, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: -0.02em;
}

.bz-interiors__results-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.bz-interiors__results-item {
  display: flex;
  align-items: center;
  gap: 16px;
  color: var(--bz-b-100, #2d2c2c);
  font-family: Inter, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: 0;
}

.bz-interiors__results-item img {
  flex-shrink: 0;
}

.bz-interiors__product {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 12px;
  border-radius: 8px;
  background-color: #edeae7;
  box-sizing: border-box;
  transition:.3s all;
}
.bz-interiors__product:hover{
  background-color:#E3E2E1;
}

.bz-interiors__product-img {
  display: block;
  width: 79px;
  height: 58px;
  object-fit: cover;
}

.bz-interiors__product-name {
  margin: 0;
  color: var(--bz-b-100, #2d2c2c);
  font-family: Inter, sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.3;
  letter-spacing: -0.04em;
  text-transform: uppercase;
}

.bz-interiors__product-specs {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
}

.bz-interiors__product-specs > div {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 84px;
}

.bz-interiors__product-specs span {
  color: #7e7d7b;
  font-family: Inter, sans-serif;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.4;
}

.bz-interiors__product-specs strong {
  color: var(--bz-b-100, #2d2c2c);
  font-family: Inter, sans-serif;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.4;
}

.bz-interiors__product-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--bz-prim, #f27e00);
  font-family: Inter, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.4;
  text-decoration: none;
}

.bz-interiors__product-link:hover,
.bz-interiors__product-link:focus {
  color: var(--bz-prim-hov, #ff9521);
  text-decoration: none;
}

.bz-interiors__nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
  margin-top: 24px;
}

.bz-interiors__pair > .bz-interiors__nav {
  margin-top: 0;
}

.bz-interiors__arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  padding: 0;
  border: none;
  border-radius: 40px;
  background-color: #ffffff;
  color: #1b1b1b;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  transition: opacity 0.2s ease;
}

.bz-interiors__arrow:hover,
.bz-interiors__arrow:focus {
  opacity: 0.85;
}

.bz-interiors__arrow.swiper-button-disabled {
  opacity: 0.35;
  cursor: default;
}

.bz-interiors__counter {
  min-width: 50px;
  color: #ffffff;
  font-family: Inter, sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: -0.02em;
  text-align: center;
}

.bz-interiors__mobile-cta {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 30px;
  margin-top: 40px;
}

.bz-interiors__lead--mobile {
  display: block;
  text-align: center;
  max-width: 340px;
}

.bz-interiors__all--mobile {
  display: flex;
  width: 320px;
  max-width: 100%;
}

/* ——— 768 ———
   Figma 768 (итерация «Коллекции плёнок»): заголовок + оранжевая кнопка (край уходит за правый край),
   lead под заголовком; лента: слайд = 738 (вправо до края), сравнение 708, инфо-панель во всю ширину слайда;
   между сравнением и панелью — навигация (prev наполовину на фото, со смещением влево)
*/
@media (min-width: 768px) {
  .bz-interiors {
    padding: 140px 30px 120px;
    overflow: hidden;
  }

  .bz-interiors__head {
    position: relative;
    gap: 0;
    margin-bottom: 30px;
  }

  .bz-interiors__title {
    max-width: 491px;
    margin-left: 0;
    margin-right: 0;
    font-size: 32px;
    font-weight: 400;
    line-height: 1.3;
    letter-spacing: -0.04em;
    text-align: left;
  }

  .bz-interiors__lead {
    display: block;
    max-width: 408px;
    margin-top: 21px;
    letter-spacing: 0;
  }

  .bz-interiors__all {
    position: absolute;
    top: 0;
    right: -20px;
    display: inline-flex;
    width: 215px;
    border: 0;
  }

  .bz-interiors__mobile-cta {
    display: none;
  }

  .bz-interiors__swiper {
    /* влево пад 30 остаётся, вправо лента до края кадра */
    width: calc(100% + 30px);
    margin-right: -30px;
  }

  .bz-interiors__pair {
    gap: 0;
  }

  .bz-interiors__compare {
    width: 708px;
    max-width: 708px;
    border: 0;
  }

  .bz-interiors__tt .before-after-img,
  .bz-interiors .twentytwenty-container img {
    height: 480px;
  }

  .bz-interiors .twentytwenty-container {
    height: 480px !important;
  }

  .bz-interiors__info {
    width: 100%;
    padding: 16px;
  }

  .bz-interiors__meta {
    margin-bottom: 31px;
  }

  .bz-interiors__project-title {
    margin-bottom: 16px;
    font-size: 20px;
  }

  .bz-interiors__desc {
    margin-bottom: 27px;
    font-size: 14px;
  }

  .bz-interiors__results {
    margin-bottom: 37px;
  }

  .bz-interiors__results-label,
  .bz-interiors__used-label {
    margin-bottom: 12px;
  }

  .bz-interiors__results-item {
    font-size: 14px;
  }

  /* Figma 768: вместо галочек — зелёные прямоугольники 20×14 */
  .bz-interiors__results-item img {
    /* display: none; */
  }

  .bz-interiors__results-item::before {
    display:none;
    content: '';
    flex-shrink: 0;
    width: 20px;
    height: 14px;
    background-color: #0a602d;
  }

  .bz-interiors__results-item {
    gap: 16px;
  }

  .bz-interiors__product {
    flex-direction: row;
    align-items: flex-start;
    gap: 0;
    padding: 12px 16px;
  }

  .bz-interiors__product-img {
    margin-right: 16px;
  }

  .bz-interiors__product-specs {
    margin-top: 16px;
  }

  .bz-interiors__product-link {
    margin-top: 14px;
    align-self: flex-start;
  }

  .bz-interiors__nav {
    margin-top: 20px;
    align-items: center;
    gap: 0;
  }

  .bz-interiors__arrow--prev {
    margin-right: 68px;
    transform: translateX(15px);
  }

  .bz-interiors__arrow--next {
    margin-left: 12px;
  }

  .bz-interiors__counter {
    margin-left: -25px;
    margin-right: 12px;
  }
}

/* ——— 1024 ———
   Figma: title + btn в одном ряду; lead под title; до слайдера 20px
*/
@media (min-width: 1024px) {
  .bz-interiors {
    padding: 140px 30px 120px;
  }

  .bz-interiors__head {
    display: grid;
    grid-template-columns: minmax(0, 601px) minmax(0, 1fr) auto;
    grid-template-areas:
      "title . button"
      "lead . .";
    column-gap: 16px;
    row-gap: 20px;
    align-items: start;
    margin-bottom: 20px;
  }

  .bz-interiors__title {
    grid-area: title;
    max-width: 601px;
    font-size: 32px;
    font-weight: 400;
    line-height: 1.3;
    letter-spacing: -0.04em;
  }

  .bz-interiors__lead {
    grid-area: lead;
    display: block;
    max-width: 408px;
    margin: 0;
    color: #a4a4a4;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.4;
    letter-spacing: -0.02em;
  }

  .bz-interiors__all {
    position: static;
    right: auto;
    grid-area: button;
    display: inline-flex;
    width: 175px;
    justify-self: end;
    align-self: start;
  }

  .bz-interiors__mobile-cta {
    display: none;
  }

  .bz-interiors__swiper {
    width: 100%;
    margin-right: 0;
  }

  .bz-interiors__pair {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 15px;
    align-items: stretch;
  }

  .bz-interiors__compare,
  .bz-interiors__info {
    /* сброс 768: width/max-width 708px — иначе before/after наезжает на карточку */
    width: 100%;
    max-width: none;
    min-width: 0;
    min-height: 595px;
  }

  .bz-interiors__tt,
  .bz-interiors .twentytwenty-wrapper,
  .bz-interiors .twentytwenty-container {
    width: 100% !important;
    max-width: 100%;
  }

  .bz-interiors__tt .before-after-img,
  .bz-interiors .twentytwenty-container img {
    width: 100%;
    max-width: 100%;
    height: 595px;
  }

  .bz-interiors .twentytwenty-container {
    height: 595px !important;
  }

  .bz-interiors__info {
    display: flex;
    flex-direction: column;
    padding: 16px;
  }

  .bz-interiors__project-title {
    font-size: 20px;
  }

  .bz-interiors__desc {
    font-size: 14px;
  }

  .bz-interiors__results-item {
    font-size: 14px;
  }

  .bz-interiors__product {
    flex-direction: column;
    align-items: stretch;
    margin-top: auto;
  }

  .bz-interiors__product-img {
    width: 79px;
    height: 58px;
  }

  .bz-interiors__product-body {
    flex: 1 1 auto;
    min-width: 0;
  }

  .bz-interiors__product-link {
    position: static;
    top: auto;
    right: auto;
  }

  .bz-interiors__product-specs > div {
    min-width: 0;
    flex: 1 1 0;
  }

  .bz-interiors__product-specs span,
  .bz-interiors__product-specs strong {
    font-size: 12px;
  }

  .bz-interiors__nav {
    /* Figma 1024/1440: по центру, gap 24, одна линия; сброс хаков 768 */
    margin-top: 24px;
    gap: 24px;
    align-items: center;
    justify-content: center;
  }

  .bz-interiors__arrow--prev {
    margin-right: 0;
    transform: none;
  }

  .bz-interiors__arrow--next {
    margin-left: 0;
  }

  .bz-interiors__counter {
    width: 50px;
    min-width: 50px;
    margin-left: 0;
    margin-right: 0;
  }

  .bz-interiors__swiper {
    margin-bottom: 0;
    height: auto;
  }

  .bz-interiors__swiper > .swiper-wrapper,
  .bz-interiors__slide {
    height: auto;
  }
}

/* ——— 1280+: lead вровень с info-колонкой слайдера, btn справа ——— */
@media (min-width: 1280px) {
  .bz-interiors__head {
    /* Как .bz-interiors__pair: две равные колонки, gap 15 */
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    grid-template-areas: none;
    column-gap: 15px;
    row-gap: 0;
    margin-bottom: 40px;
  }

  .bz-interiors__title {
    grid-area: unset;
    grid-column: 1;
    grid-row: 1;
    max-width: 601px;
  }

  .bz-interiors__lead {
    grid-area: unset;
    grid-column: 2;
    grid-row: 1;
    justify-self: start;
    align-self: start;
    max-width: 408px;
    /* Figma 1440: lead y=184 при title y=140 */
    margin-top: 44px;
  }

  .bz-interiors__all {
    grid-area: unset;
    grid-column: 2;
    grid-row: 1;
    justify-self: end;
    align-self: start;
    /* Figma: button y=180 */
    margin-top: 40px;
  }

  .bz-interiors__compare,
  .bz-interiors__info {
    min-height: 595px;
  }

  .bz-interiors__tt .before-after-img,
  .bz-interiors .twentytwenty-container img {
    height: 595px;
  }

  .bz-interiors .twentytwenty-container {
    height: 595px !important;
  }

  .bz-interiors__info {
    padding: 24px;
  }

  .bz-interiors__project-title {
    font-size: 24px;
  }

  .bz-interiors__desc {
    font-size: 16px;
  }

  .bz-interiors__results-item {
    font-size: 16px;
  }

  .bz-interiors__product {
    flex-direction: row;
    align-items: center;
  }

  .bz-interiors__product-img {
    width: 135px;
    height: 100px;
  }

  .bz-interiors__product-link {
    position: absolute;
    top: 13px;
    right: 13px;
  }

  .bz-interiors__product-specs > div {
    min-width: 100px;
    flex: 0 1 auto;
  }

  .bz-interiors__product-specs span,
  .bz-interiors__product-specs strong {
    font-size: 14px;
  }
}

/* ——— 1440 / 1920 ——— */
@media (min-width: 1440px) {
  .bz-interiors {
    padding: 140px 30px 120px;
  }

  .bz-interiors__title {
    font-size: 42px;
    line-height: 1;
    letter-spacing: -0.04em;
  }

  .bz-interiors__lead {
    margin-top: 44px;
  }

  .bz-interiors__all {
    margin-top: 40px;
  }

  .bz-interiors__pair {
    gap: 15px;
  }

  .bz-interiors__compare,
  .bz-interiors__info {
    min-height: 595px;
  }

  .bz-interiors__tt .before-after-img,
  .bz-interiors .twentytwenty-container img {
    height: 595px;
  }

  .bz-interiors .twentytwenty-container {
    height: 595px !important;
  }
}

@media (min-width: 1920px) {
  .bz-interiors {
    max-width: 1920px;
    margin: 0 auto;
    padding: 140px 30px 120px;
  }
}

/*home-faq*/
#section-faq .bz-faq-row .col-2 {
  justify-content: flex-end;
  display: flex;
  padding: 0 40px;
}