.collection-page .section-top {
    padding-top: 50px
}

@media (max-width: 1700px) {
    .collection-page .section-top {
        padding-top: 60px
    }
}

@media (max-width: 1280px) {
    .collection-page .section-top {
        padding-top: 30px
    }
}

@media (max-width: 600px) {
    .collection-page .section-top {
        padding-top: 20px
    }
}

.collection-page .section-top .top {
    display: flex;
    position: relative;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    color: #fff;
    height: 35vw;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center
}

@media (max-width: 1280px) {
    .collection-page .section-top .top {
        height: 49vw
    }
}

@media (max-width: 600px) {
    .collection-page .section-top .top {
        height: auto
    }
}

.collection-page .section-top .top:before {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, .4) 100%);
    z-index: 0
}

.collection-page .section-top .top > * {
    display: flex;
    position: relative;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-end;
    padding: 0 110px 75px;
    z-index: 1;
    flex-grow: 1
}

@media (max-width: 1700px) {
    .collection-page .section-top .top > * {
        padding: 0 110px 60px
    }
}

@media (max-width: 1280px) {
    .collection-page .section-top .top > * {
        padding: 0 0 60px;
        align-self: stretch
    }
}

@media (max-width: 600px) {
    .collection-page .section-top .top > * {
        padding: 90px 0 35px
    }
}

.collection-page .section-top .top .header {
    font-size: 64px;
    line-height: 72px
}

.collection-page .section-top .top .header .new {
    display: inline-block;
    vertical-align: top;
    position: relative
}

.collection-page .section-top .top .header .new:before {
    content: 'NEW';
    display: block;
    position: absolute;
    right: -30px;
    top: -10px;
    font-size: 13px;
    line-height: 1em;
    padding: 5px 5px 4px;
    border: 1px solid #fff;
    color: #fff;
    border-radius: 2px
}

@media (max-width: 1280px) {
    .collection-page .section-top .top .header .new:before {
        right: -40px
    }
}

@media (max-width: 600px) {
    .collection-page .section-top .top .header .new:before {
        top: -5px
    }
}

@media (max-width: 1280px) {
    .collection-page .section-top .top .header {
        font-size: 48px;
        line-height: 56px
    }
}

@media (max-width: 600px) {
    .collection-page .section-top .top .header {
        font-size: 32px;
        line-height: 40px
    }
}

.collection-page .section-top .top .info {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    margin-top: 40px
}

@media (max-width: 1280px) {
    .collection-page .section-top .top .info {
        margin-top: 20px
    }
}

@media (max-width: 980px) {
    .collection-page .section-top .top .info {
        align-self: stretch;
        max-width: 640px
    }
}

@media (max-width: 600px) {
    .collection-page .section-top .top .info {
        flex-wrap: wrap
    }
}

.collection-page .section-top .top .info .aside {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    justify-content: flex-start;
    height: 67px
}

@media (max-width: 600px) {
    .collection-page .section-top .top .info .aside {
        height: 40px;
        width: 100%;
        padding-bottom: 10px
    }
}

.collection-page .section-top .top .info .icon {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    justify-content: flex-start;
    border: 1px dashed #fff
}

.collection-page .section-top .top .info .icon > * {
    width: auto;
    height: 100%
}

.collection-page .section-top .top .info .text {
    font-size: 14px;
    line-height: 19px;
    letter-spacing: .02em;
    align-self: center;
    padding-left: 25px;
    max-width: 115px
}

@media (max-width: 600px) {
    .collection-page .section-top .top .info .text {
        padding-left: 15px
    }
}

.collection-page .section-top .top .info .space {
    display: none;
    flex-grow: 1
}

@media (max-width: 980px) {
    .collection-page .section-top .top .info .space {
        display: block
    }
}

@media (max-width: 600px) {
    .collection-page .section-top .top .info .space {
        display: none
    }
}

.collection-page .section-top .top .info .item {
    display: flex;
    position: relative;
    flex-direction: row;
    align-items: stretch;
    justify-content: flex-start;
    height: 43px;
    margin-left: 40px
}

@media (max-width: 980px) {
    .collection-page .section-top .top .info .item {
        margin-left: 20px
    }
}

@media (max-width: 600px) {
    .collection-page .section-top .top .info .item {
        height: 32px;
        margin: 15px 25px 0 0
    }
}

.collection-page .section-top .top .info .item .title {
    position: absolute;
    left: 50%;
    top: calc(100% + 10px);
    -webkit-transform: translate(-50%, 0);
    -moz-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    box-shadow: 0 3px 7px rgba(0, 0, 0, .1);
    pointer-events: none;
    opacity: 0;
    -webkit-transition: opacity 200ms ease;
    -moz-transition: opacity 200ms ease;
    -ms-transition: opacity 200ms ease;
    transition: opacity 200ms ease;
    will-change: opacity
}

.collection-page .section-top .top .info .item:hover .title {
    opacity: 1
}

.collection-page .section-top .top .info .item .title:before {
    content: '';
    display: block;
    position: absolute;
    left: 50%;
    top: 0;
    background: #fff;
    height: 8px;
    width: 8px;
    box-shadow: 0 3px 7px rgba(0, 0, 0, .1);
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
    -moz-transform: translate(-50%, -50%) rotate(45deg);
    -ms-transform: translate(-50%, -50%) rotate(45deg);
    transform: translate(-50%, -50%) rotate(45deg)
}

.collection-page .section-top .top .info .item .title:after {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: #fff
}

.collection-page .section-top .top .info .item .title > * {
    position: relative;
    z-index: 2;
    padding: 5px 7px;
    font-size: 12px;
    line-height: 1em;
    color: #000
}

.collection-page .section-top .top .info .item .img {
    width: auto;
    height: 100%
}

.collection-page .section-top .advantages {
    padding-top: 80px;
    padding-bottom: 80px
}

@media (max-width: 1280px) {
    .collection-page .section-top .advantages {
        padding-top: 60px;
        padding-bottom: 60px
    }
}

@media (max-width: 980px) {
    .collection-page .section-top .advantages {
        padding-top: 50px;
        padding-bottom: 70px
    }
}

.collection-page .section-top .advantages > * {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: flex-start;
    padding: 0 0 0 110px
}

@media (max-width: 1280px) {
    .collection-page .section-top .advantages > * {
        flex-direction: column;
        padding: 0
    }
}

.collection-page .section-top .advantages .left {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    flex-wrap: wrap;
    flex-basis: 0%;
    flex-grow: 1
}

@media (max-width: 1280px) {
    .collection-page .section-top .advantages .left {
        flex-wrap: wrap;
    }
}

@media (max-width: 980px) {
    .collection-page .section-top .advantages .left {
        max-width: 510px
    }
}

@media (max-width: 600px) {
    .collection-page .section-top .advantages .left {
        width: calc(100% + 20px)
    }
}

.collection-page .section-top .advantages .left > * {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    width: 50%;
    padding-right: 40px;
    box-sizing: border-box;
    margin-bottom: 35px
}

@media (max-width: 980px) {
    .collection-page .section-top .advantages .left > * {
        padding-right: 50px
    }
}

@media (max-width: 600px) {
    .collection-page .section-top .advantages .left > * {
        flex-direction: column;
        align-items: flex-start;
        margin-bottom: 25px;
        padding-right: 0
    }

    .collection-page .section-top .advantages .left > *:nth-child(odd) {
        padding-right: 20px
    }
}

.collection-page .section-top .advantages .left .icon {
    width: 50px;
    height: 50px;
    flex-shrink: 0;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center center
}

@media (max-width: 980px) {
    .collection-page .section-top .advantages .left .icon {
        width: 42px;
        height: 42px
    }
}

@media (max-width: 600px) {
    .collection-page .section-top .advantages .left .icon {
        width: 50px;
        height: 50px
    }
}

.collection-page .section-top .advantages .left .text {
    font-size: 14px;
    line-height: 1.25em;
    box-sizing: border-box;
    padding-left: 25px
}

@media (max-width: 980px) {
    .collection-page .section-top .advantages .left .text {
        padding-left: 20px
    }
}

@media (max-width: 600px) {
    .collection-page .section-top .advantages .left .text {
        padding-left: 0;
        margin-top: 15px;
        align-self: stretch
    }

    .collection-page .section-top .advantages .left .text br {
        display: none
    }
}

.collection-page .section-top .advantages .right {
    width: calc(50% + 45px);
    font-size: 18px;
    line-height: 24px
}

@media (max-width: 1280px) {
    .collection-page .section-top .advantages .right {
        width: auto;
        font-size: 16px;
        line-height: 1.25em;
        max-width: 730px
    }
}

@media (max-width: 600px) {
    .collection-page .section-top .advantages .right {
        padding-top: 10px
    }
}

.collection-page .section-top .advantages .right > * + * {
    margin-top: 20px
}

.collection-page .section-top .advantages .right .light {
    color: #969696
}

@media (max-width: 1280px) {
    .collection-page .section-top .advantages .right .light {
        max-width: 530px
    }
}

.collection-page .section-advantages {
    border-top: 1px solid #dbdbdb;
    padding-top: 80px;
    padding-bottom: 80px;
    overflow: hidden
}

@media (max-width: 1280px) {
    .collection-page .section-advantages {
        padding-top: 60px;
        padding-bottom: 60px
    }
}

@media (max-width: 600px) {
    .collection-page .section-advantages {
        padding: 50px 0
    }
}

.collection-page .section-advantages > .section-inner {
    position: relative;
    padding: 0 110px
}

@media (max-width: 1280px) {
    .collection-page .section-advantages > .section-inner {
        padding: 0
    }
}

.collection-page .section-advantages .slider {
    overflow: visible;
    z-index: 0
}

.collection-page .section-advantages .slider .swiper-slide {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: flex-start;
    opacity: .5;
    -webkit-transition: opacity 200ms ease;
    -moz-transition: opacity 200ms ease;
    -ms-transition: opacity 200ms ease;
    transition: opacity 200ms ease;
    will-change: opacity
}

@media (max-width: 980px) {
    .collection-page .section-advantages .slider .swiper-slide {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        opacity: 1
    }
}

.collection-page .section-advantages .slider .swiper-slide-active {
    opacity: 1
}

.collection-page .section-advantages .slider .swiper-slide > * {
    flex-basis: 0%;
    flex-grow: 1
}

.collection-page .section-advantages .slider .swiper-slide .info {
    box-sizing: border-box;
    padding-right: 100px
}

@media (max-width: 980px) {
    .collection-page .section-advantages .slider .swiper-slide .info {
        order: 2;
        padding-right: 0
    }
}

@media (max-width: 600px) {
    .collection-page .section-advantages .slider .swiper-slide .info {
        padding: 0 20px
    }
}

.collection-page .section-advantages .slider .swiper-slide .info .header {
    font-size: 48px;
    line-height: 56px
}

@media (max-width: 1280px) {
    .collection-page .section-advantages .slider .swiper-slide .info .header {
        font-size: 32px;
        line-height: 40px
    }
}

@media (max-width: 980px) {
    .collection-page .section-advantages .slider .swiper-slide .info .header {
        padding-top: 50px
    }
}

@media (max-width: 600px) {
    .collection-page .section-advantages .slider .swiper-slide .info .header {
        padding-top: 40px
    }
}

.collection-page .section-advantages .slider .swiper-slide .info .text {
    margin-top: 25px;
    font-size: 18px;
    line-height: 24px
}

@media (max-width: 980px) {
    .collection-page .section-advantages .slider .swiper-slide .info .text {
        margin-top: 10px
    }
}

.collection-page .section-advantages .slider .swiper-slide .image {
    min-height: 21vw;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center
}

.lazyloaded {
    min-height: 21vw;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}

.collection-page .section-projects .top-title-navs {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
}

.collection-page .section-projects .slide-to {
    display: flex;
    gap: 15px;
}

.collection-page .section-projects .slide-to .prev,
.collection-page .section-projects .slide-to .next {
    position: relative;
    width: 36px;
    height: 36px;
    opacity: .3;
    -webkit-transition: opacity 200ms ease;
    -moz-transition: opacity 200ms ease;
    -ms-transition: opacity 200ms ease;
    transition: opacity 200ms ease;
    will-change: opacity;
    cursor: pointer;
}

.collection-page .section-projects .slide-to .prev:hover,
.collection-page .section-projects .slide-to .next:hover {
    opacity: 1;
}

.collection-page .section-projects .slide-to .prev.hidden,
.collection-page .section-projects .slide-to .next.hidden {
    pointer-events: none;
    opacity: .3;
}

.collection-page .section-projects .slide-to .prev::before,
.collection-page .section-projects .slide-to .prev::after,
.collection-page .section-projects .slide-to .next::before,
.collection-page .section-projects .slide-to .next::after {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: url("../img/rounded-next-2ee5188507c47ba66418fadf5796b589.svg") no-repeat center center/contain;
    opacity: 1;
    -webkit-transition: opacity 200ms ease;
    -moz-transition: opacity 200ms ease;
    -ms-transition: opacity 200ms ease;
    transition: opacity 200ms ease;
    will-change: opacity;
}

.collection-page .section-projects .slide-to .prev::after,
.collection-page .section-projects .slide-to .next::after {
    background: url("../img/rounded-next-gray-9af8afa1a058312b02c9aaf6f312afc3.svg") no-repeat center center/contain;
    opacity: 0;
}

.collection-page .section-projects .slide-to .prev.hidden::before,
.collection-page .section-projects .slide-to .next.hidden::before {
    background: url("../img/rounded-next-gray-9af8afa1a058312b02c9aaf6f312afc3.svg") no-repeat center center/contain;
    opacity: 0;
}

.collection-page .section-projects .slide-to .prev.hidden::after,
.collection-page .section-projects .slide-to .next.hidden::after {
    background: url("../img/rounded-next-gray-9af8afa1a058312b02c9aaf6f312afc3.svg") no-repeat center center/contain;
    opacity: 1;
}

.collection-page .section-projects .slide-to .prev {
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}

@media (max-width: 1700px) {
    .collection-page .section-advantages .slider .swiper-slide .image {
        min-height: 28vw
    }
}

@media (max-width: 1280px) {
    .collection-page .section-advantages .slider .swiper-slide .image {
        min-height: 35vw
    }
}

@media (max-width: 980px) {
    .collection-page .section-advantages .slider .swiper-slide .image {
        order: 1;
        min-height: 50vw
    }

    .collection-page .section-projects .slide-to {
        display: none;
    }
}

@media (max-width: 600px) {
    .collection-page .section-advantages .slider .swiper-slide .image {
        min-height: 67vw
    }
}

.collection-page .section-advantages .nav {
    display: flex;
    position: relative;
    flex-direction: row;
    align-items: flex-start;
    justify-content: flex-start;
    top: -10px;
    z-index: 1
}

@media (max-width: 1280px) {
    .collection-page .section-advantages .nav {
        display: inline-flex;
        padding: 0 112px;
        top: -33px
    }
}

@media (max-width: 980px) {
    .collection-page .section-advantages .nav {
        display: flex;
        position: absolute;
        top: calc(50vw + 15px);
        width: 100%;
        left: 0;
        text-align: center;
        padding: 0
    }
}

@media (max-width: 600px) {
    .collection-page .section-advantages .nav {
        top: calc(67vw + 15px)
    }
}

.collection-page .section-advantages .nav .inner {
    display: flex;
    position: relative;
    flex-direction: row;
    align-items: flex-start;
    justify-content: flex-start
}

@media (max-width: 980px) {
    .collection-page .section-advantages .nav .inner {
        flex-grow: 1;
        justify-content: center
    }
}

.collection-page .section-advantages .nav .inner > * {
    position: relative;
    width: 8px;
    height: 8px;
    border-radius: 5px;
    border: 1px solid #c4c4c4;
    cursor: pointer;
    -webkit-transition: border-color 200ms ease;
    -moz-transition: border-color 200ms ease;
    -ms-transition: border-color 200ms ease;
    transition: border-color 200ms ease;
    will-change: border-color
}

.collection-page .section-advantages .nav .inner > *:hover {
    border-color: #1069BB
}

@media (max-width: 980px) {
    .collection-page .section-advantages .nav .inner > * {
        width: 6px;
        height: 6px
    }
}

.collection-page .section-advantages .nav .inner > * + * {
    margin-left: 20px
}

@media (max-width: 980px) {
    .collection-page .section-advantages .nav .inner > * + * {
        margin-left: 8px
    }
}

.collection-page .section-advantages .nav .inner > *:before {
    content: '';
    display: block;
    position: absolute;
    left: -1px;
    top: -1px;
    width: 10px;
    height: 10px;
    border-radius: 6px;
    background: #1069BB;
    opacity: 0;
    -webkit-transition: opacity 200ms ease;
    -moz-transition: opacity 200ms ease;
    -ms-transition: opacity 200ms ease;
    transition: opacity 200ms ease;
    will-change: opacity
}

@media (max-width: 980px) {
    .collection-page .section-advantages .nav .inner > *:before {
        width: 8px;
        height: 8px
    }
}

.collection-page .section-advantages .nav .inner > *.active:before {
    opacity: 1
}

.collection-page .section-advantages .prev, .collection-page .section-advantages .next {
    display: none;
    position: absolute;
    width: 56px;
    height: 56px;
    top: calc(50% - 28px);
    opacity: .3;
    -webkit-transition: opacity 200ms ease;
    -moz-transition: opacity 200ms ease;
    -ms-transition: opacity 200ms ease;
    transition: opacity 200ms ease;
    will-change: opacity;
    z-index: 1;
    cursor: pointer
}

.collection-page .section-advantages .prev:hover, .collection-page .section-advantages .next:hover {
    opacity: 1
}

.collection-page .section-advantages .section-inner > .prev, .collection-page .section-advantages .section-inner > .next {
    display: block
}

@media (max-width: 1280px) {
    .collection-page .section-advantages .section-inner > .prev, .collection-page .section-advantages .section-inner > .next {
        display: none
    }

    .collection-page .section-advantages .prev, .collection-page .section-advantages .next {
        display: block
    }
}

@media (max-width: 980px) {
    .collection-page .section-advantages .prev, .collection-page .section-advantages .next {
        display: none
    }
}

.collection-page .section-advantages .prev.hidden, .collection-page .section-advantages .next.hidden {
    pointer-events: none;
    opacity: .3
}

.collection-page .section-advantages .prev:before, .collection-page .section-advantages .prev:after, .collection-page .section-advantages .next:before, .collection-page .section-advantages .next:after {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: url("../img/rounded-next-2ee5188507c47ba66418fadf5796b589.svg") no-repeat center center/contain;
    opacity: 1;
    -webkit-transition: opacity 200ms ease;
    -moz-transition: opacity 200ms ease;
    -ms-transition: opacity 200ms ease;
    transition: opacity 200ms ease;
    will-change: opacity
}

.collection-page .section-advantages .prev:after, .collection-page .section-advantages .next:after {
    background: url("../img/rounded-next-gray-9af8afa1a058312b02c9aaf6f312afc3.svg") no-repeat center center/contain;
    opacity: 0
}

.collection-page .section-advantages .prev.hidden:before, .collection-page .section-advantages .next.hidden:before {
    background: url("../img/rounded-next-gray-9af8afa1a058312b02c9aaf6f312afc3.svg") no-repeat center center/contain;
    opacity: 0
}

.collection-page .section-advantages .prev.hidden:after, .collection-page .section-advantages .next.hidden:after {
    background: url("../img/rounded-next-gray-9af8afa1a058312b02c9aaf6f312afc3.svg") no-repeat center center/contain;
    opacity: 1
}

.collection-page .section-advantages .prev {
    left: 0;
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg)
}

.collection-page .section-advantages .next {
    right: 0
}

.collection-page .section-design {
    background: #f1f1f1;
    padding-top: 90px;
    padding-bottom: 35px
}

@media (max-width: 1280px) {
    .collection-page .section-design {
        padding-top: 55px;
        padding-bottom: 60px
    }
}

@media (max-width: 980px) {
    .collection-page .section-design {
        padding-bottom: 30px
    }
}

@media (max-width: 600px) {
    .collection-page .section-design {
        padding-bottom: 20px
    }
}

.collection-page .section-design .header {
    font-size: 48px;
    line-height: 56px
}

@media (max-width: 1280px) {
    .collection-page .section-design .header {
        font-size: 32px;
        line-height: 40px
    }
}

.collection-page .section-design .list {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: flex-start;
    margin-top: 35px;
    width: calc(100% + 50px)
}

@media (max-width: 1280px) {
    .collection-page .section-design .list {
        margin-top: 25px;
        width: calc(100% + 20px)
    }
}

.collection-page .section-design .list > * {
    width: calc(50% - 50px);
    margin-bottom: 60px;
    margin-right: 50px
}

.collection-page .section-design .list > *.short {
    width: calc(25% - 50px)
}

@media (max-width: 1280px) {
    .collection-page .section-design .list > * {
        width: calc(50% - 20px);
        margin-bottom: 40px;
        margin-right: 20px
    }

    .collection-page .section-design .list > *.short {
        width: calc(25% - 20px)
    }
}

@media (max-width: 980px) {
    .collection-page .section-design .list > * {
        margin-bottom: 25px
    }
}

@media (max-width: 600px) {
    .collection-page .section-design .list > * {
        margin-bottom: 25px;
        width: 100%
    }

    .collection-page .section-design .list > *.short {
        margin-bottom: 25px;
        width: calc(50% - 20px)
    }
}

.collection-page .section-design .list .image {
    height: 100px;
    width: 100%;
    -webkit-transition: opacity 200ms ease;
    -moz-transition: opacity 200ms ease;
    -ms-transition: opacity 200ms ease;
    transition: opacity 200ms ease;
    will-change: opacity
}

.collection-page .section-design .list > *.short .image {
    height: auto
}

.collection-page .section-design .list > *:hover .image {
    opacity: .75
}

@media (max-width: 980px) {
    .collection-page .section-design .list .image {
        height: 80px
    }
}

.collection-page .section-design .list .title {
    margin-top: 10px;
    font-size: 24px;
    line-height: 32px
}

@media (max-width: 600px) {
    .collection-page .section-design .list .title {
        margin-top: 10px;
        font-size: 18px;
        line-height: 24px
    }
}

.collection-page .section-slider {
    padding-top: 80px;
    padding-bottom: 75px;
    overflow: hidden
}

@media (max-width: 1700px) {
    .collection-page .section-slider {
        padding-top: 90px;
        padding-bottom: 90px
    }
}

@media (max-width: 1280px) {
    .collection-page .section-slider {
        padding-top: 60px;
        padding-bottom: 60px
    }
}

.collection-page .section-slider > .section-inner {
    position: relative;
    padding: 0 110px
}

@media (max-width: 1280px) {
    .collection-page .section-slider > .section-inner {
        padding: 0 60px 0 0
    }
}

@media (max-width: 600px) {
    .collection-page .section-slider > .section-inner {
        padding: 0
    }
}

.collection-page .section-slider > .section-inner > * {
    position: relative;
    z-index: 0
}

.collection-page .section-slider .header {
    font-size: 48px;
    line-height: 56px
}

@media (max-width: 1280px) {
    .collection-page .section-slider .header {
        font-size: 32px;
        line-height: 40px
    }
}

.collection-page .section-slider .slider {
    margin-top: 60px
}

@media (max-width: 1280px) {
    .collection-page .section-slider .slider {
        position: relative;
        left: -20px;
        margin-top: 25px
    }
}

@media (max-width: 600px) {
    .collection-page .section-slider .slider {
        left: 0
    }
}

.collection-page .section-slider .slider .swiper-slide {
    opacity: .5;
    -webkit-transition: opacity 200ms ease;
    -moz-transition: opacity 200ms ease;
    -ms-transition: opacity 200ms ease;
    transition: opacity 200ms ease;
    will-change: opacity
}

.collection-page .section-slider .slider .swiper-slide.swiper-slide-active {
    opacity: 1
}

.collection-page .section-slider .slider .swiper-slide .image {
    height: 620px;
    object-fit: cover;
    width: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center
}

@media (max-width: 1700px) {
    .collection-page .section-slider .slider .swiper-slide .image {
        height: 620px
    }
}

@media (max-width: 1280px) {
    .collection-page .section-slider .slider .swiper-slide .image {
        height: 53vw
    }
}

@media (max-width: 980px) {
    .collection-page .section-slider .slider .swiper-slide .image {
        height: 53vw
    }
}

.collection-page .section-slider .slider .swiper-slide .title {
    font-size: 24px;
    line-height: 32px;
    margin-top: 32px;
    opacity: 0;
    -webkit-transition: opacity 200ms ease;
    -moz-transition: opacity 200ms ease;
    -ms-transition: opacity 200ms ease;
    transition: opacity 200ms ease;
    will-change: opacity
}

@media (max-width: 1280px) {
    .collection-page .section-slider .slider .swiper-slide .title {
        opacity: .5;
        box-sizing: border-box;
        padding: 0 20px;
        margin-top: 50px
    }
}

@media (max-width: 980px) {
    .collection-page .section-slider .slider .swiper-slide .title {
        opacity: 0
    }
}

@media (max-width: 600px) {
    .collection-page .section-slider .slider .swiper-slide .title {
        padding: 0
    }
}

.collection-page .section-slider .slider .swiper-slide.swiper-slide-active .title {
    opacity: 1
}

.collection-page .section-slider .slider .swiper-slide .text {
    font-size: 18px;
    line-height: 24px;
    opacity: 0;
    -webkit-transition: opacity 200ms ease;
    -moz-transition: opacity 200ms ease;
    -ms-transition: opacity 200ms ease;
    transition: opacity 200ms ease;
    will-change: opacity
}

@media (max-width: 1280px) {
    .collection-page .section-slider .slider .swiper-slide .text {
        box-sizing: border-box;
        padding: 0 20px;
        margin-top: 5px;
        opacity: .5
    }
}

@media (max-width: 980px) {
    .collection-page .section-slider .slider .swiper-slide .text {
        opacity: 0
    }
}

@media (max-width: 600px) {
    .collection-page .section-slider .slider .swiper-slide .text {
        padding: 0
    }
}

.collection-page .section-slider .slider .swiper-slide.swiper-slide-active .text {
    opacity: 1
}

.collection-page .section-slider .prev, .collection-page .section-slider .next {
    position: absolute;
    width: 56px;
    height: 56px;
    top: calc(50% - 28px);
    opacity: .3;
    -webkit-transition: opacity 200ms ease;
    -moz-transition: opacity 200ms ease;
    -ms-transition: opacity 200ms ease;
    transition: opacity 200ms ease;
    will-change: opacity;
    z-index: 1;
    cursor: pointer
}

.collection-page .section-slider .prev:hover, .collection-page .section-slider .next:hover {
    opacity: 1
}

@media (max-width: 1280px) {
    .collection-page .section-slider .prev, .collection-page .section-slider .next {
        display: none
    }
}

.collection-page .section-slider .prev.hidden, .collection-page .section-slider .next.hidden {
    pointer-events: none;
    opacity: .5
}

.collection-page .section-slider .prev:before, .collection-page .section-slider .prev:after, .collection-page .section-slider .next:before, .collection-page .section-slider .next:after {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    -webkit-transition: opacity 200ms ease;
    -moz-transition: opacity 200ms ease;
    -ms-transition: opacity 200ms ease;
    transition: opacity 200ms ease;
    will-change: opacity;
    background: url("../img/rounded-next-2ee5188507c47ba66418fadf5796b589.svg") no-repeat center center/contain;
    opacity: 1
}

.collection-page .section-slider .prev:after, .collection-page .section-slider .next:after {
    background: url("../img/rounded-next-gray-9af8afa1a058312b02c9aaf6f312afc3.svg") no-repeat center center/contain;
    opacity: 0
}

.collection-page .section-slider .prev.hidden:before, .collection-page .section-slider .next.hidden:before {
    opacity: 0
}

.collection-page .section-slider .prev.hidden:after, .collection-page .section-slider .next.hidden:after {
    opacity: 1
}

.collection-page .section-slider .prev {
    left: 20px;
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg)
}

.collection-page .section-slider .next {
    right: 20px
}

.collection-page .section-slider .nav {
    display: none;
    position: absolute;
    flex-direction: row;
    align-items: flex-start;
    justify-content: center;
    top: calc(53vw + 80px);
    left: 0;
    width: 100%;
    z-index: 1
}

@media (max-width: 1280px) {
    .collection-page .section-slider .nav {
        display: flex
    }
}

@media (max-width: 600px) {
    .collection-page .section-slider .nav {
        top: calc(53vw + 90px)
    }
}

@media (max-width: 400px) {
    .collection-page .section-slider .nav {
        top: calc(53vw + 120px)
    }
}

.collection-page .section-slider .nav > * {
    position: relative;
    width: 8px;
    height: 8px;
    border-radius: 5px;
    border: 1px solid #c4c4c4;
    cursor: pointer;
    -webkit-transition: border-color 200ms ease;
    -moz-transition: border-color 200ms ease;
    -ms-transition: border-color 200ms ease;
    transition: border-color 200ms ease;
    will-change: border-color
}

@media (max-width: 980px) {
    .collection-page .section-slider .nav > * {
        width: 6px;
        height: 6px
    }
}

.collection-page .section-slider .nav > *:hover {
    border-color: #1069BB
}

.collection-page .section-slider .nav > * + * {
    margin-left: 20px
}

@media (max-width: 980px) {
    .collection-page .section-slider .nav > * + * {
        margin-left: 8px
    }
}

.collection-page .section-slider .nav > *:before {
    content: '';
    display: block;
    position: absolute;
    left: -1px;
    top: -1px;
    width: 10px;
    height: 10px;
    border-radius: 6px;
    background: #1069BB;
    opacity: 0;
    -webkit-transition: opacity 200ms ease;
    -moz-transition: opacity 200ms ease;
    -ms-transition: opacity 200ms ease;
    transition: opacity 200ms ease;
    will-change: opacity
}

@media (max-width: 980px) {
    .collection-page .section-slider .nav > *:before {
        width: 8px;
        height: 8px
    }
}

.collection-page .section-slider .nav > *.active:before {
    opacity: 1
}

.collection-page .section-video {
    padding: 0 210px 80px
}

@media (max-width: 1700px) {
    .collection-page .section-video {
        padding: 0 0 80px
    }
}

@media (max-width: 1280px) {
    .collection-page .section-video {
        padding: 0 0 60px
    }
}

@media (max-width: 600px) {
    .collection-page .section-video {
        padding: 0 0 45px
    }
}

.collection-page .section-video .video {
    display: flex;
    position: relative;
    padding-bottom: 56%
}

.collection-page .section-video .video > * {
    box-sizing: border-box;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%
}

.collection-page .section-faq {
    background: #f1f1f1;
    padding: 90px 0;
}

@media (max-width: 1280px) {
    .collection-page .section-faq {
        padding: 60px 0
    }
}

@media (max-width: 600px) {
    .collection-page .section-faq {
        padding: 45px 0
    }
}

.collection-page .section-faq .header {
    font-size: 48px;
    line-height: 56px
}

@media (max-width: 1280px) {
    .collection-page .section-faq .header {
        font-size: 32px;
        line-height: 40px
    }
}

.collection-page .section-faq .list {
    margin-top: 45px
}

@media (max-width: 1700px) {
    .collection-page .section-faq .list {
        margin-top: 40px
    }
}

@media (max-width: 1280px) {
    .collection-page .section-faq .list {
        margin-top: 20px
    }
}

.collection-page .section-faq .list .caption {
    position: relative;
    font-size: 24px;
    line-height: 32px;
    background: #fff;
    padding: 20px;
    cursor: pointer;
    -webkit-transition: background 200ms ease, color 200ms ease;
    -moz-transition: background 200ms ease, color 200ms ease;
    -ms-transition: background 200ms ease, color 200ms ease;
    transition: background 200ms ease, color 200ms ease;
    will-change: background, color
}

@media (max-width: 1280px) {
    .collection-page .section-faq .list .caption {
        padding: 20px 15px
    }
}

@media (max-width: 980px) {
    .collection-page .section-faq .list .caption {
        font-size: 18px;
        line-height: 24px;
        padding: 24px 75px 24px 15px
    }
}

@media (max-width: 600px) {
    .collection-page .section-faq .list .caption {
        padding: 12px 75px 12px 15px
    }
}

.collection-page .section-faq .list > *.active .caption {
    background: #1069BB;
    color: #fff
}

.collection-page .section-faq .list .caption:before, .collection-page .section-faq .list .caption:after {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    right: 24px;
    width: 32px;
    height: 0;
    border-bottom: 1px solid #919191;
    -webkit-transition: -webkit-transform 200ms ease, border-color 200ms ease;
    -moz-transition: -moz-transform 200ms ease, border-color 200ms ease;
    -ms-transition: -ms-transform 200ms ease, border-color 200ms ease;
    transition: transform 200ms ease, border-color 200ms ease;
    will-change: border-color, transform
}

.collection-page .section-faq .list > *.active .caption:before, .collection-page .section-faq .list > *.active .caption:after {
    border-bottom-color: #fff
}

.collection-page .section-faq .list .caption:after {
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg)
}

.collection-page .section-faq .list > *.active .caption:before {
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg)
}

.collection-page .section-faq .list > *.active .caption:after {
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg)
}

.collection-page .section-faq .list .text {
    overflow: hidden;
    height: 0;
    -webkit-transition: height 200ms ease;
    -moz-transition: height 200ms ease;
    -ms-transition: height 200ms ease;
    transition: height 200ms ease;
    will-change: height
}

.collection-page .section-faq .list .text > * {
    padding-bottom: 45px
}

@media (max-width: 1700px) {
    .collection-page .section-faq .list .text > * {
        padding-bottom: 40px
    }
}

@media (max-width: 980px) {
    .collection-page .section-faq .list .text > * {
        padding-bottom: 30px
    }
}

@media (max-width: 600px) {
    .collection-page .section-faq .list .text > * {
        padding-bottom: 25px
    }
}

.collection-page .section-faq .list .text > * > * {
    background: #fff;
    padding: 15px 20px 20px;
    font-size: 18px;
    line-height: 24px
}

@media (max-width: 1700px) {
    .collection-page .section-faq .list .text > * > * {
        padding: 20px
    }
}

@media (max-width: 1280px) {
    .collection-page .section-faq .list .text > * > * {
        padding: 20px 15px
    }
}

@media (max-width: 980px) {
    .collection-page .section-faq .list .text > * > * {
        font-size: 16px;
        line-height: 1.25em
    }
}

.useful-info-block {
    text-align: center;
    padding: 24px 0;
    background: #f1f1f1
}

.question-icon {
    position: relative
}

.question-icon:after {
    right: 10px;
    bottom: -7px;
    content: "";
    width: 32px;
    height: 32px;
    background-image: url("../img/question-7b12e5cfbb805accdcc8d943db87c7dc.svg");
    display: inline-block;
    position: absolute
}


.collection-page .section-projects {
    padding: 80px 0;
    border-top: 1px solid #d6d6d6;
    overflow: hidden;
    max-width: 100vw;
}

@media (max-width: 1280px) {

    .collection-page .section-projects {
        padding: 60px 0;
    }

}

@media (max-width: 600px) {
    .collection-page .section-projects {
        padding: 60px 0 30px;
    }
}

.collection-page .section-projects .section-inner {
    overflow: visible;
}

.collection-page .section-projects .header {
    font-size: 48px;
    line-height: 56px;
}

@media (max-width: 1280px) {

    .collection-page .section-projects .header {
        font-size: 32px;
        line-height: 40px
    }

}

/*Статьи*/

.collection-page .section-blog {
    padding: 90px 0;
}

@media (max-width: 1280px) {
    .collection-page .section-blog {
        padding: 60px 0
    }
}

@media (max-width: 600px) {
    .collection-page .section-blog {
        padding: 45px 0
    }
}

.section-blog .header {
    font-size: 48px;
    line-height: 56px;
}

@media (max-width: 1280px) {

    .section-blog .header {
        font-size: 32px;
        line-height: 40px
    }

}

.section-blog .list {
    display: flex;
    position: relative;
    flex-direction: row;
    align-items: flex-start;
    justify-content: flex-start;
    margin-top: 32px;
}

@media (max-width: 600px) {
    .section-blog .list {
        margin-top: 80px;
    }
}

.section-blog .list .slide-to {
    display: flex;
    position: absolute;
    right: 0;
    top: -72px;
}

@media (max-width: 600px) {
    .section-blog .list .slide-to {
        right: initial;
        left: 0;
    }
}

.section-blog .list .slide-to > * {
    position: relative;
    width: 56px;
    height: 56px;
    opacity: .3;
    -webkit-transition: opacity 200ms ease;
    -moz-transition: opacity 200ms ease;
    -ms-transition: opacity 200ms ease;
    transition: opacity 200ms ease;
    will-change: opacity;
    z-index: 1;
    cursor: pointer
}

.section-blog .list .slide-to > * + * {
    margin-left: 16px;
}

.section-blog .list .slide-to > *:hover {
    opacity: 1
}

.section-blog .list .slide-to > *.hidden {
    pointer-events: none;
    opacity: .3
}

.section-blog .list .slide-to .prev {
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg)
}

.section-blog .list .slide-to > *:before,
.section-blog .list .slide-to > *:after {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: url("../img/rounded-next-2ee5188507c47ba66418fadf5796b589.svg") no-repeat center center/contain;
    opacity: 1;
    -webkit-transition: opacity 200ms ease;
    -moz-transition: opacity 200ms ease;
    -ms-transition: opacity 200ms ease;
    transition: opacity 200ms ease;
    will-change: opacity
}

.section-blog .list .slide-to > *:after {
    background: url("../img/rounded-next-gray-9af8afa1a058312b02c9aaf6f312afc3.svg") no-repeat center center/contain;
    opacity: 0
}

.section-blog .list .slide-to > *.hidden:before {
    background: url("../img/rounded-next-gray-9af8afa1a058312b02c9aaf6f312afc3.svg") no-repeat center center/contain;
    opacity: 0
}

.section-blog .list .slide-to > *.hidden:after {
    background: url("../img/rounded-next-gray-9af8afa1a058312b02c9aaf6f312afc3.svg") no-repeat center center/contain;
    opacity: 1
}

.section-blog .list .slides {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: flex-start;
    overflow: visible;
    flex-grow: 1;
    flex-basis: 0;
    min-width: 0;
}

.section-blog .list .slides > * {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: flex-start;
    overflow: visible;
}

.section-blog .list .slides > * > * {
}

.section-blog .list .slides .image {
    position: relative;
    background: url("../img/project-samples/default-e0872706603b88662098d1ada205fe5c.svg") no-repeat center center/92px auto, #E6E6E6;
}

.section-blog .list .slides .image:before {
    content: '';
    display: block;
    position: relative;
    width: 100%;
    padding-bottom: 67%;
    pointer-events: none;
}

.section-blog .list .slides .image > * {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
}

.section-blog .list .slides .title {
    font-size: 24px;
    line-height: 32px;
    margin-top: 16px;
}

@media (max-width: 600px) {
    .section-blog .list .slides .title {
        font-size: 18px;
        line-height: 26px;
    }
}

.section-blog .list {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
    width: calc(100% + 48px);
    margin-top: 80px;
}

@media (max-width: 1700px) {
    .section-blog .list {
        margin-top: 64px;
        width: calc(100% + 40px);
    }
}

@media (max-width: 1280px) {
    .section-blog .list {
        margin-top: 40px;
        width: calc(100% + 24px);
    }
}

@media (max-width: 900px) {
    .section-blog .list {
        margin-top: 32px;
        width: calc(100% + 16px);
    }
}

@media (max-width: 600px) {
    .section-blog .list {
        width: 100%;
    }
}

.section-blog .list > * {
    width: 33.33%;
    box-sizing: border-box;
    padding-right: 48px;
    margin-bottom: 64px;
}

@media (max-width: 1700px) {
    .section-blog .list > * {
        padding-right: 40px;
        margin-bottom: 40px;
    }
}

@media (max-width: 1280px) {
    .section-blog .list > * {
        width: 50%;
        padding-right: 24px;
    }
}

@media (max-width: 900px) {
    .section-blog .list > * {
        padding-right: 16px;
        margin-bottom: 32px;
    }
}

@media (max-width: 600px) {
    .section-blog .list > * {
        width: 100%;
        padding-right: 0;
    }
}

.section-blog .list > * > * {
    display: block;
}

.section-blog .list .image {
    position: relative;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center center;
    opacity: 1;
    transition: opacity 200ms ease;
    will-change: opacity;
    max-width: 100%;
}

.section-blog .list > * > *:hover .image {
    opacity: .8;
}

.section-blog .list .image:before {
    content: '';
    display: block;
    width: 100%;
    padding-bottom: 68%;
}

.section-blog .list .info {
    margin-top: 16px;
}

@media (max-width: 900px) {
    .section-blog .list .info {
        margin-top: 8px;
    }
}

.section-blog .list .info .title {
    font-size: 32px;
    line-height: 40px;
    transition: color 200ms ease;
    will-change: color;
}

@media (max-width: 1700px) {
    .section-blog .list .info .title {
        font-size: 24px;
        line-height: 32px;
    }
}

.section-blog .list > * > *:hover .info .title {
    color: #1069BB;
}

.section-blog .list .info .review {
    font-size: 18px;
    line-height: 26px;
    margin-top: 8px;
}

@media (max-width: 1700px) {
    .section-blog .list .info .review {
        font-size: 16px;
        line-height: 24px;
    }
}

.section-blog .list .info .info_row {
    display: flex;
    gap: 20px;
}

.section-blog .list .info .time,
.section-blog .list .info .views,
.section-blog .list .info .like {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    font-size: 16px;
    line-height: 24px;
    color: #646464;
    margin-top: 16px;
}

@media (max-width: 1700px) {
    .section-blog .list .info .time,
    .section-blog .list .info .views,
    .section-blog .list .info .like {
        margin-top: 12px;
    }
}

.section-blog .list .info .time:before {
    content: '';
    display: block;
    position: relative;
    top: -2px;
    width: 16px;
    height: 16px;
    margin-right: 8px;
    background: url("../img/time-1b875eb0fee7c85cca2e3b515ad23fc7.svg") no-repeat center center;
}

.section-blog .list .info .time:after {
    content: ' мин';
    white-space: pre;
}

.section-blog .list .info .views:before {
    content: '';
    display: block;
    position: relative;
    top: -2px;
    width: 24px;
    height: 16px;
    margin-right: 8px;
    background: url("../img/eye-e2b7019c96c23063b4c6c065fdc2f271.svg") no-repeat center center;
}

.section-blog .list .info .like:before {
    content: '';
    display: block;
    position: relative;
    width: 25px;
    height: 25px;
    margin-right: 8px;
    background: url("../img/heart-502cb2b775e08cea7d5c4ffc18bf1f06.svg") no-repeat center center;
    background-size: contain;
}

.btn-more {
    display: flex;
    padding: 40px 0;

    a {
        margin-left: auto;
        background: #E2E2E2;
        border: none;
        color: #000;
        border-radius: 26px;
        height: 50px;
        line-height: 48px;
        font-size: 16px;
        padding: 0 25px;
        transition: background 0.2s linear;
        width: 215px;
        text-align: center;

        &:hover {
            background: #c4c4c4;
        }
    }
}

@media (max-width: 600px) {
    .btn-more {
        a {
            margin: 0 auto;
        }
    }
}

.interior_designer-wrapper {
    padding-top: 60px;
    padding-bottom: 60px;
}

.interior_designer-container {
    position: relative;
    display: block;
    width: 100%;
    height: 480px;
    background-image: url("../img/collections/interior-designer-722873a00f4d310a208194e064a37ef2.webp");
    background-size: cover;

    &::after {
        content: "";
        position: absolute;
        inset: 0;
        display: block;
        width: 100%;
        height: 100%;
        background-color: #0000001f;
        transition: background-color 0.2s linear;
    }

    &:hover {
       &::after {
            background-color: #00000052;
       }
    }
}

.interior_designer-btn {
    position: absolute;
    display: flex;
    gap: 18px;
    bottom: 48px;
    right: 48px;
    font-size: 32px;
    font-weight: 400;
    line-height: 100%;
    z-index: 10;
    color: white;
    margin-top: auto;
    transition: border-bottom 0.2s linear;
}

.interior_designer-icon {
    display: block;
    width: 29px;
    height: 35px;
    background-image: url("../img/collections/arrow-30455af33ae4005836898ed3659de571.svg");
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}

@media (max-width: 980px) {
    .interior_designer-wrapper {
        padding-top: 30px;
        padding-bottom: 30px;
    }

    .interior_designer-container {
        height: 310px;
    }

    .interior_designer-btn {
        bottom: 20px;
        right: 20px;
        font-size: 24px;
    }

    .interior_designer-icon {
        width: 24px;
        height: 32px;
    }
}

@media (max-width: 480px) {
    .interior_designer-btn {
        font-size: 19px;
        gap: 11px;
    }

    .interior_designer-icon {
        width: 18px;
        height: 23px;
    }
}
