/* HERO */
.page-template-home .hero  {
    position: relative;
    display: flex;
    width: 100%;
    height: 100vh;
}

.page-template-home .hero .hero-inner {
    position: relative;
    width: 100%;
    height: 100%;
}

.page-template-home .hero picture {
    position: relative;
    display: flex;
    width: 100%;
    height: 100vh;
	transition: all .4s ease;
	-webkit-transition: all .4s ease;
	-moz-transition: all .4s ease;
	-o-transition: all .4s ease;
}

.page-template-home .hero picture img,
.page-template-home .hero video {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
	transition: all .4s ease;
	-webkit-transition: all .4s ease;
	-moz-transition: all .4s ease;
	-o-transition: all .4s ease;
}

.page-template-home .hero .sm {
    display: none;
}


/* ABOUT */
.page-template-home .about  {
    position: relative;
    display: flex;
    width: 100%;
    height: fit-content;
}

.page-template-home .about .about-wrapper {
    position: relative;
    display: flex;
    width: 100%;
    height: fit-content;
}

.page-template-home .about .about-wrapper .left,
.page-template-home .about .about-wrapper .right {
    position: relative;
    display: inline-block;
    width: 50%;
}

.page-template-home .about .about-wrapper .right img {
    position: relative;
    display: block;
    width: 100%;
    height: 100vh;
    min-height: 31.25vw;
    max-height: 56.25vw;
    object-fit: cover;
    object-position: center center;
	transition: all .4s ease;
	-webkit-transition: all .4s ease;
	-moz-transition: all .4s ease;
	-o-transition: all .4s ease;
}

.page-template-home .about .about-wrapper .about-text-wrapper {
    position: relative;
    display: block;
    width: 100%;
    height: fit-content;
    padding: 2.76vw var(--lateralMargin) 2.447vw;
}

.page-template-home .about .about-wrapper .about-text-wrapper .about-text-inner {
    position: relative;
    display: flex;
    flex-flow: column;
    width: calc( ( (100vw - ( var(--lateralMargin) * 2 ) ) / 12 ) * 4);
    height: fit-content;
    row-gap: 1.02vw;
}


/* PROJECTS */
.page-template-home .projects {
    position: relative;
    display: block;
    width: 100%;
    height: fit-content;
}

.page-template-home .projects .projects-wrapper {
    position: relative;
    display: flex;
    width: 100%;
    height: fit-content;
}

.page-template-home .projects .projects-wrapper .left {
    position: relative;
    display: inline-block;
    width: 50%;
}

.page-template-home .projects .projects-wrapper .right {
    position: relative;
    display: inline-flex;
    width: 50%;
    flex-flow: column;
    flex-wrap: wrap;
    justify-content: space-between;
}

.page-template-home .projects .projects-wrapper .left img {
    position: relative;
    display: block;
    width: 100%;
    height: 100vh;
    min-height: 48.25vw;
    max-height: 58.25vw;
    object-fit: cover;
    object-position: center center;
	transition: all .4s ease;
	-webkit-transition: all .4s ease;
	-moz-transition: all .4s ease;
	-o-transition: all .4s ease;
}


.page-template-home .projects .projects-wrapper .right .image-wrapper {
    position: relative;
    display: block;
    width: calc( ( (100vw - ( var(--lateralMargin) * 2 ) ) / 12 ) * 4);
}

.page-template-home .projects .projects-wrapper .right img {
    /*position: relative;
    display: block;
    width: 100%;
    height: auto;*/
	transition: all .4s ease;
	-webkit-transition: all .4s ease;
	-moz-transition: all .4s ease;
	-o-transition: all .4s ease;
}

.page-template-home .projects .projects-wrapper .left .projects-text-inner-sm {
    display: none;
}

.page-template-home .projects .projects-wrapper .right .projects-text-inner {
    position: relative;
    display: flex;
    flex-flow: column;
    width: calc( ( (100vw - ( var(--lateralMargin) * 2 ) ) / 12 ) * 4);
    height: fit-content;
    row-gap: 1.02vw;
    padding: 0 0 3.229vw var(--lateralMargin);
}

.page-template-home .projects .projects-wrapper .right .projects-text-inner a {
    position: relative;
    display: inline-block;
    margin-top: 1.041vw;
    width: fit-content;
}

.page-template-home .projects .projects-wrapper .right .projects-text-inner a::after,
.page-template-home .projects .projects-wrapper .right .projects-text-inner a::after {
    content: "";
    position: absolute;
    display: block;
    width: 0%;
    height: 1px;
    background-color: var(--black);
    transition: width .4s ease;
    bottom: -.052vw;
    right: .8vw;
}

.page-template-home .projects .projects-wrapper .right .projects-text-inner a:hover::after,
.page-template-home .projects .projects-wrapper .right .projects-text-inner a:hover::after{
    width: calc(100% - .8vw);
    left: 0;
    right: auto;
}

.page-template-home .projects .projects-carousel {
    width: 100%;
    height: fit-content;
    overflow: hidden;
    margin-bottom: 3.958vw;
}

.page-template-home .projects .swiper-slide {
    position: relative;
    display: inline-block;
}

.page-template-home .projects .swiper-slide img {
    position: relative;
    display: block;
    width: 100%;
    height: auto;
}

.page-template-home .projects .swiper-slide:nth-child(odd) {
    width: calc((100% / 12) * 4);
}

.page-template-home .projects .swiper-slide:nth-child(even) {
    width: calc((100% / 12) * 3);
}

.page-template-home .projects .projects-bottom-text-wrapper {
    position: relative;
    display: block;
    width: 100%;
    height: fit-content;
    /*padding: 0 var(--lateralMargin) 3.43vw;*/
    padding: 0 var(--lateralMargin) 9.21vw;
}

.page-template-home .projects .projects-bottom-text-wrapper .projects-bottom-text-inner {
    position: relative;
    display: flex;
    flex-flow: column;
    width: calc( ( (100vw - ( var(--lateralMargin) * 2 ) ) / 12 ) * 3.8);
    height: fit-content;
    row-gap: 1.02vw;
}


/* SERVICES */
.page-template-home .services {
    position: relative;
    display: block;
    width: 100%;
    height: fit-content;
}

.page-template-home .services .columns {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    height: fit-content;
}

.page-template-home .services .columns .column {
    position: relative;
    display: inline-block;
    width: calc(100% / 3);
}

.page-template-home .services .columns .column .top,
.page-template-home .services .columns .column .bottom {
    position: relative;
    display: block;
    width: 100%;
}

.page-template-home .services .columns .column .top,
.page-template-home .services .columns .column:nth-child(1) .bottom,
.page-template-home .services .columns .column:nth-child(2) .bottom,
.page-template-home .services .columns .column:nth-child(3) .bottom {
    height: 38.125vw;
}

.page-template-home .services .columns .column:nth-child(4) .bottom,
.page-template-home .services .columns .column:nth-child(5) .bottom,
.page-template-home .services .columns .column:nth-child(6) .bottom {
    height: fit-content;
}

.page-template-home .services .columns .column:nth-child(4) {
    transform: translate(0,-38.125vw);
}


.page-template-home .services .columns .column .top .text-inner,
.page-template-home .services .columns .column .bottom .text-inner {
    position: relative;
    display: flex;
    width: 100%;
    row-gap: 1.02vw;
    flex-flow: column;
    padding: 0 var(--lateralMargin);
}

.page-template-home .services .columns .column .top .text-inner {
    /* padding: 0 var(--lateralMargin); */
    padding: 0 1.49vw 0 var(--lateralMargin);
}

.page-template-home .services .columns .column .bottom .text-inner {
    padding: 2.031vw 1.56vw 3.177vw var(--lateralMargin);
}

.page-template-home .services .columns .column picture {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
}

.page-template-home .services .columns .column img {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
	transition: all .4s ease;
	-webkit-transition: all .4s ease;
	-moz-transition: all .4s ease;
	-o-transition: all .4s ease;
}

.page-template-home .services-carousel {
    display: none;
}


@media only screen and (max-width: 1440px) {
    .page-template-home .about .about-wrapper .about-text-wrapper .about-text-inner,
    .page-template-home .projects .projects-wrapper .right .projects-text-inner,
    .page-template-home .projects .projects-bottom-text-wrapper .projects-bottom-text-inner,
    .page-template-home .services .columns .column .top .text-inner, 
    .page-template-home .services .columns .column .bottom .text-inner {
        row-gap: 18px;
    }

    .page-template-home .projects .projects-wrapper .right .projects-text-inner a {
        margin-top: 12px;
    }
}


@media only screen and (max-width: 1024px) {
    .page-template-home .projects .projects-wrapper .right .image-wrapper {
        width: calc( ( (100vw - ( var(--lateralMargin) * 2 ) ) / 12 ) * 5);
    }

    /*
    .page-template-home .projects .projects-wrapper .right img {
        width: calc( ( (100vw - ( var(--lateralMargin) * 2 ) ) / 12 ) * 5);
    }
    */

    .page-template-home .projects .projects-wrapper .right .projects-text-inner {
        width: calc( ( (100vw - ( var(--lateralMargin) * 2 ) ) / 12 ) * 5);
    }
}


@media only screen and (max-width: 980px) {
    /* HERO */
    .page-template-home .hero .lg {
        display: none;
    }

    .page-template-home .hero .sm {
        display: block;
    }

    /* ABOUT */
    .page-template-home .about .about-wrapper {
        flex-flow: column;
    }

    .page-template-home .about .about-wrapper .left, 
    .page-template-home .about .about-wrapper .right {
        width: 100%;
    }

    .page-template-home .about .about-wrapper .about-text-wrapper {
        padding: 53px var(--lateralMargin) 54px;
    }

    .page-template-home .about .about-wrapper .about-text-wrapper .about-text-inner {
        width: 100%;
        max-width: 384px;
        row-gap: 15px;
    }

    .page-template-home .about .about-wrapper .right img {
        height: auto;
        min-height: auto;
        max-height: none;
        object-fit: none;
    }


    /* PROJECTS */
    .page-template-home .projects .projects-wrapper {
        flex-flow: column-reverse;
    }

    .page-template-home .projects .projects-wrapper .left,
    .page-template-home .projects .projects-wrapper .right {
        width: 100%;
    }

    .page-template-home .projects .projects-wrapper .right .image-wrapper {
        width: 60%;
    }

    /*
    .page-template-home .projects .projects-wrapper .right img {
        width: 60%;
    }
    */

    .page-template-home .projects .projects-wrapper .right .projects-text-inner {
        display: none;
    }


    .page-template-home .projects .projects-wrapper .left .projects-text-inner-sm {
        position: relative;
        display: flex;
        flex-flow: column;
        width: 100%;
        height: fit-content;
        row-gap: 15px;
        padding: 53px var(--lateralMargin) 49px;
    }

    .page-template-home .projects .projects-wrapper .left .projects-text-inner-sm p {
        width: 100%;
        max-width: 390px;
    }

    .page-template-home .projects .projects-wrapper .left .projects-text-inner-sm a {
        position: relative;
        display: inline-block;
        margin-top: 12px;
        width: fit-content;
    }
    
    .page-template-home .projects .projects-wrapper .left .projects-text-inner-sm a::after,
    .page-template-home .projects .projects-wrapper .left .projects-text-inner-sm a::after {
        content: "";
        position: absolute;
        display: block;
        width: 0%;
        height: 1px;
        background-color: var(--black);
        transition: width .4s ease;
        bottom: 0px;
        right: 11px;
    }
    
    .page-template-home .projects .projects-wrapper .left .projects-text-inner-sm a:hover::after,
    .page-template-home .projects .projects-wrapper .left .projects-text-inner-sm a:hover::after{
        width: calc(100% - 11px);
        left: 0;
        right: auto;
    }    

    .page-template-home .projects .swiper-slide:nth-child(2n+1) {
        width: calc((100% / 6) * 5);
    }

    .page-template-home .projects .swiper-slide:nth-child(2n) {
        width: calc((100% / 6) * 3.7);
    }


    .page-template-home .projects .projects-carousel {
        margin-bottom: 32px;
    }

    .page-template-home .projects .projects-bottom-text-wrapper {
        padding: 0 var(--lateralMargin) 73px;
    }

    .page-template-home .projects .projects-bottom-text-wrapper .projects-bottom-text-inner {
        width: 100%;
        max-width: 390px;
        row-gap: 15px;
    }


    /* SERVICES */
    .page-template-home .services .columns .column {
        position: relative;
        display: inline-block;
        width: 100%;
    }

    .page-template-home .services .columns .column.column-lg {
        display: none;
    }

    .page-template-home .services .columns .column .top .text-inner {
        padding: 0 var(--lateralMargin) 55px;
        row-gap: 15px;
    }

    .page-template-home .services .columns .column .top .text-inner p {
        width: 100%;
        max-width: 390px;
    }

    .page-template-home .services .columns .column .top {
        height: fit-content;
    }

    .page-template-home .services-carousel {
        position: relative;
        display: block;
        width: 100%;
        height: fit-content;
        overflow: hidden;
    }

    .page-template-home .services-carousel .swiper-wrapper {
        width: calc((100% / 6) * 5);
    }

    .page-template-home .services-carousel img {
        position: relative;
        display: block;
        width: 100%;
        height: 95vw;
        object-fit: cover;
        object-position: center;
    }

    .page-template-home .services-carousel .text-inner {
        position: relative;
        display: flex;
        flex-flow: column;
        width: 100%;
        height: fit-content;
        padding: 36px var(--lateralMargin) 76px;
        row-gap: 15px;
    }

    .page-template-home .services-carousel .text-wrapper {
        opacity: 0;
        transition: opacity .4s ease;
        -webkit-transition: opacity .4s ease;
        -moz-transition: opacity .4s ease;
        -o-transition: opacity .4s ease;
    }

    .page-template-home .services-carousel .swiper-slide-active .text-wrapper {
        opacity: 1;
    }

    .page-template-home .services-carousel .text-inner p {
        width: 100%;
        max-width: 340px;
    }

    .page-template-home .services-carousel .button-next,
    .page-template-home .services-carousel .button-prev {
        position: absolute;
        display: block;
        width: calc( (100% / 6) * .28);
        height: 20px;
        top: calc(95vw + 33px);
        z-index: 2;
        cursor: pointer;
        background-repeat: no-repeat;
        background-image: url('../../images/arrow-black.svg');
        background-size: 6px 20px;
        background-position: 100% 0px;
    }

    .page-template-home .services-carousel .button-next {
        left: calc( ( 100% / 6 ) * 5.28 );
    }   
    
    .page-template-home .services-carousel .button-prev {
        left: calc( ( 100% / 6 ) * 5 );
        transform: rotate(180deg);
    }   
}


@media only screen and (max-width: 550px) {
    .page-template-home .services-carousel .button-next,
    .page-template-home .services-carousel .button-prev {
        top: calc(95vw + 32px);
        background-size: 5px 20px;
    }
}