/*
Theme Name: Uncode Child
Description: Child theme for Uncode theme
Author: Undsgn™
Author URI: http://www.undsgn.com
Template: uncode
Version: 1.0.0
Text Domain: uncode
*/

/* ----------------------------- */
/* ----- SPECIFIC SECTIONS ----- */
/* ----------------------------- */

/* CHEVRON DOWN ANIMATION */
.hero-chevron-animation .circle-1, .hero-chevron-animation .circle-2, .hero-chevron-animation .circle-3, .hero-chevron-animation .chevron {
    opacity: 0;
    animation: hero-chevron-reveal .5s ease-in-out 3s 1 normal;
    animation-fill-mode: forwards;
    transform-origin: center center;
}
.hero-chevron-animation .circle-2 {
    animation-delay: 3.2s;
}
.hero-chevron-animation .circle-3 {
    animation-delay: 3.4s;
}
.hero-chevron-animation .chevron {
    animation-delay: 3.6s;
}

@keyframes hero-chevron-reveal {
    0% {
        transform: scale(.8);
        opacity: 0;
    }
    100% {
        transform: scale(1);
        opacity: 1;
    }
}


/* OLD WAY NEW WAY COMPARISION ROW */
#old-new-mobile .wpb_column {
    max-width: 500px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
}
#old-new-mobile .wpb_column:last-of-type {
    margin-top: 32px;
}



/* CTA SECTION NEW */
.rotessa-cta-mobile {
    max-width: 600px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
}
.rotessa-cta-mobile p, .rotessa-cta-mobile .heading-text {
    position: relative;
    z-index: 2;
}



/* TWO COLUMN HEADER ROW */
@media (max-width: 959px) {
    #two-column-header-row > .row > .wpb_row > .wpb_column {
        display: block !important;
        margin-left: auto;
        margin-right: auto;
    }
    #two-column-header-row > .row > .wpb_row > .wpb_column:first-of-type {
        margin-bottom: 24px;
    }
    #two-column-header-row> .row > .wpb_row > .wpb_column:last-of-type {
        max-width: 500px;
    }
}


/* TWO COLUMN PICTURE + TEXT */
@media (max-width: 959px) {
    .two-column-picture-text .picture-text-column-1, .two-column-picture-text .picture-text-column-2 {
        max-width: 500px;
        width: 100%;
        margin-left: auto;
        margin-right: auto;
    }
}



/* STATS ROW */
@media (max-width: 959px) {    
	.stats-row .wpb_column .wpb_row {
		margin-left: 0;
	}
  
	.stats-row .wpb_column .wpb_column {
  	width: 40%;
		padding: 0;
		padding-bottom: 24px !important;
	}
	.stats-row .wpb_column .row-container:last-of-type, .stats-row .wpb_column .row-container:last-of-type p {
		margin-top: 0;
	}
}

@media (max-width: 568px) {
    .stats-row .wpb_column .wpb_row {
    	margin-left: 0;
    	display: flex;
    	gap: 36px;
    	flex-wrap: wrap;
    	justify-contents: center;
    	align-items: center;
    }
	.stats-row .wpb_column .wpb_column {
		width: 100%;
		padding: 0 !important;
		padding-bottom: 32px !important;
	}
	.stats-row .wpb_column .row-container:last-of-type, .stats-row .wpb_column .row-container:last-of-type p {
		margin-top: 0;
	}
}



/* INTEGRATIONS ROW */
#integrations-row .integrations {
    position: relative;
    z-index: 3;
}
@media (max-width: 959px) {
	#integrations-row .vc_row .wpb_row {
		display: flex;
		flex-direction: row;
		justify-content: center;
		flex-wrap: wrap;
		height: auto !important;
		gap: 36px;
	}
	#integrations-row .vc_row .wpb_row .wpb_column {
	    padding-top: 0;
	}
	#integrations-row .wpb_row .wpb_column {
		display: block !important;
		height: unset !important;
	}
	#integrations-row .integrations {
		width: 350px;
	}
}
@media (max-width: 568px) {
    #integrations-row .integrations {
        width: 100%;
    }
}



/* A AND B PARTNER CAROUSEL ROW */
.a-and-b-carousel .carousel-item {
	padding: 16px;
	margin-left: 12px;
	margin-right: 12px;
	height: 100px;
	background: rgba(255, 255, 255, .85);
}
.a-and-b-carousel .slick-list {
	overflow: unset;
}
.a-and-b-carousel .carousel-item img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}
.a-and-b-carousel {
	-webkit-mask: linear-gradient(to right, transparent, black, black, transparent);
	mask: linear-gradient(to right, transparent, black, black, transparent);
}

@media (max-width: 568px) {
    .a-and-b-carousel {
        -webkit-mask: linear-gradient(to right, transparent, black, black, black, transparent);
	    mask: linear-gradient(to right, transparent, black, black, black, transparent);
    }
}