/******/
/*** SECTIONS ***/
/******/

/* CONTAINERS */

.content-container, .content-container-small {
	padding: 3rem;
	border-radius: var(--radius-3xl);
}

.content-container-small {
	padding: 2rem;
}

.content-container .eyebrow, .content-container-small .eyebrow {
	margin-block-start: 0!important;
}

.image-border-radius {
	border-radius: var(--radius-3xl);
	overflow: clip;
}

.background-navy.content-container {
	background-color: var(--color-navy);
	color: var(--color-white);
}

.background-navy.content-container a {
	color: var(--color-white);
}

.background-red.content-container {
	background-color: var(--color-red);
	color: var(--color-white);
}

@media screen and (max-width: 47.9375rem) {
	
	.content-container, .content-container-small {
		padding: 1.5rem;
	}
	
}

/* GRAPHICS */

.graphic-top_left {
	top: 1rem;
	left: 1rem;
}

.graphic-top_center {
	top: 1rem;
	left: 50%;
	transform: translateX(-50%);
}

.graphic-top_right {
	top: 1rem;
	right: 1rem;
}

.graphic-center_right {
	top: 50%;
	transform: translateY(-50%);
	right: 1rem;
}

.graphic-bottom_right {
	bottom: 1rem;
	right: 1rem;
}

.graphic-bottom_center {
	bottom: 1rem;
	left: 50%;
	transform: translateX(-50%);
}

.graphic-bottom_left {
	bottom: 1rem;
	left: 1rem;
}

.graphic-center_left {
	top: 50%;
	transform: translateY(-50%);
	left: 1rem;
}

.graphic {
	position: absolute;
	pointer-events: none;
}

.graphic img {
	display: block;
	height: auto;
	max-width: 100%;
}

/* CALL TO ACTION */

.call-to-action .content-container {
	position: relative;
	background-image: url("/wp-content/themes/conversion-logix/assets/images/home/cta-background.svg");
	background-repeat: no-repeat;
	background-position: bottom center;
	background-size: contain;
}

/* CASE STUDIES*/

.alignleft {
	float: left;
	margin: 0 1.5rem 1rem 0;
	max-width: 50%;
	height: auto;
}

.alignright {
	float: right;
	margin: 0 0 1rem 1.5rem;
	max-width: 50%;
	height: auto;
}

.aligncenter {
	display: block;
	margin: 1.5rem auto;
	text-align: center;
}

.wp-caption.alignleft,
.wp-caption.alignright {
	max-width: 50%;
}

.wp-caption.alignleft {
	float: left;
	margin: 0 1.5rem 1rem 0;
}

.wp-caption.alignright {
	float: right;
	margin: 0 0 1rem 1.5rem;
}

.wp-caption img {
	width: 100%;
	height: auto;
}

.truncate {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-bottom: 1rem;
}

.single-crb_case_study .intro .grid-60 img, .single-post header .featured-image img {
	aspect-ratio: 1.8 / 1;
	overflow: clip;
	object-fit: cover;
}

.single-crb_case_study .intro .grid-50 .content-container .grid-50:before, .single-crb_case_study .intro .content-container-small .grid-50:before, .single-post header .grid-parent.grid-100:before, .single-post header .grid-parent.grid-100:after  {
	position: absolute;
}

.single-crb_case_study .testimonial-info {
	padding-right: 0!important;
	margin-right: 0!important;
}

.single-crb_case_study .testimonial-info p {
	text-align: center;
}

.single-crb_case_study .intro .content-container-small img.grid-25 {
	transform: rotate(-45deg);
	margin-top: .5rem;
	max-width: 4rem;
}

.single-crb_case_study .intro .content-container-small img.grid-25.decrease {
	transform: rotate(45deg);
}

.single-crb_case_study .takeaways p.step {
	font-size: 2rem;
	color: var(--color-navy);
	background-color: var(--color-lime);
	border-radius: 50%;
	text-align: center;
	width: 3rem;
}

.case-study-chapters .grid-parent {
	border-bottom: solid .0625rem var(--color-navy);
}

section.case-studies .case-study-info {
	background-color: var(--color-lilac);
	border-radius: 1.5rem;
	padding: 1.5rem;
	margin-bottom: 1.5rem;
}

.case-study-info-wrapper {
	display:flex;
}

section.case-studies img {
	border-radius: 1.5rem;
	z-index: -1;
	position: relative;
	margin-bottom: -5rem;
}

.category {
	background: var(--color-white);
	border-radius: 1.5rem;
	margin-right: .5rem;
	padding: 0.375rem 0.5rem;
	font-size: .75rem!important;
}

.background-white .category {
	background: var(--color-lilac);
	border-radius: 1rem;
	width: fit-content;
}

/* CAREER FEED */

.career-item img {
	width: 1.5rem;
	padding-right: .5rem;
}

.career-info {
	margin-right: 5%;
}

/* COLUMNS NUMBERED */

.column-number {
	background: var(--color-white);
	width: 3.5rem;
	height: 3.5rem;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 1rem;
	color: var(--color-navy);
}

.columns-numbered-col {
	padding: 6rem 3rem;
	border-radius: 1rem;
}


/* IMAGE SCROLLER */

.logo-marquee {
	position: relative;
	overflow: hidden;
}

.logo-marquee::before,
.logo-marquee::after {
	content: "";
	position: absolute;
	top: 0;
	width: 120px;
	height: 100%;
	pointer-events: none;
	z-index: 2;
}

.logo-marquee::before {
	left: 0;
	background: linear-gradient(to right, var(--color-white) 0%, rgba(255,255,255,0) 100%);
}

.logo-marquee::after {
	right: 0;
	background: linear-gradient(to left, var(--color-white) 0%, rgba(255,255,255,0) 100%);
}


.logo-track {
	display: flex;
	align-items: center;
	gap: 3rem;
	width: max-content;
}

.logo-track img {
	height: 5rem
	width: auto;
	display: block;
}
	
.logo-track {
	will-change: transform;
}

/* ICON TEXT */

.icon-text h4 {
	margin-block-start: 0;
}

/* INTRO ABOUT */

.intro-about-images .intro-about-image{
	width:18.75rem;
	height:18.82313rem;
}

.intro-about-images .intro-about-image img{
	width:100%;
	height:100%;
	object-fit:cover;
}

.intro-about-images .image-0{
	top:-20%;
	left:0;
}

.intro-about-images .image-1{
	top:70%;
	left:0;
}

.intro-about-images .image-2{
	top:80%;
	left:50%;
	transform:translateX(-50%);
}

.intro-about-images .image-3{
	top:70%;
	right:0;
}

.intro-about-images .image-4{
	top:-20%;
	right:0;
}

.intro-about .padding-equalize {
	height: 30rem;
}

/* INTRO HOME */

.home-intro-graphic-container {
	max-width: 65rem;
	aspect-ratio: 1.745 / 1;
}

.home-intro-graphic-container .z-index-1 {
	
}

.home-intro-graphic-container .z-index-2 {
	width: 52.8%;
	top: 0;
	right: 13.46%;
}

.home-intro-graphic-container .z-index-3 {
	
}

.home-intro-graphic-container .z-index-4 {
	width: 18.65%;
	left: 35.57%;
	top: 1%;
}

.home-intro-graphic-container .z-index-5 {
	width: 25.96%;
	right: 16.92%;
	bottom: 16%;
}

.image-scroller {
	background: linear-gradient(180deg, rgba(246, 246, 255, 0) 0%, rgba(246, 246, 255, 1) 100%);
}

.stat-image {
	height: auto;
}

.stat-1 {
	width: 15rem;
	height: 8rem;
	top: 10%;
	left: 32%;
}

.stat-2 {
	width: 21rem;
	height: 5rem;
	bottom: 10%;
	right: 5%;
}

/* INTRO INNER */

.intro-inner p img {
	width: auto;
}

.intro-inner .content-container {
	padding: 0rem 0rem 0rem 1.5rem;
}

.intro-inner .content-container .display-flex {
	padding-right: 0rem;
}

.intro-inner .content-container-centered {
	padding: 1.5rem 1.5rem 1.5rem 1.5rem;
}

.intro-inner .content-container-centered .display-flex {
	padding-right: 1rem;
}

/* INTRO PLATFORM */

.intro-platform-image {
	width: 70vw;
}


/* TESTIMONIALS */

.testimonial-decoration {
	position: absolute;
	width: 21rem;
	bottom: 0;
	left: 30%;
}

.testimonials-swiper .button {
	color: var(--color-lime) !important;
}

.testimonial-stars {
	width: 8.5rem
}

.testimonial-card {
	border-radius: 1.5rem;
	overflow: hidden;
}

.testimonial-image img {
	border-radius: 1.5rem;
}

.testimonial-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.testimonial-info p {
	font-size: var(--text-base);
}

.attribution-logo img {
	width: 7.5rem;
}

.testimonials .swiper-button-prev,
.testimonials .swiper-button-next {
	position: relative;
	width: 3rem;
	height: 3rem;
	color: transparent;
}

.testimonials .swiper-button-prev {
	margin-right: 1rem;
}

.testimonials .swiper-button-prev::after,
.testimonials .swiper-button-next::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 3rem;
	height: 3rem;
	transform: translate(-50%, -50%);
	background-size: contain;
	background-repeat: no-repeat;
}

/* Right arrow */
.testimonials .swiper-button-next::after {
	background-image: url('/wp-content/themes/conversion-logix/assets/images/icons/arrow-white-right.svg');
}

/* Left arrow */
.testimonials .swiper-button-prev::after {
	background-image: url('/wp-content/themes/conversion-logix/assets/images/icons/arrow-white-left.svg');
}

/* PERSONAS */

.personas {
	background-repeat: no-repeat;
	background-size: contain;
	background-position: 57% 33%;
}

.persona-image {
	margin-bottom: -1rem;
}

.offset .persona-image {
	margin-bottom: 1rem;
}

/* PLATFORM */

.platform-content {
	display: none;
	align-items: stretch;
}

.platform-content.active {
	display: flex;
}

.platform-tab {
	cursor: pointer;
	opacity: .5;
	transition: opacity .3s ease;
	padding-bottom: 1rem;
	border-bottom: solid .125rem var(--color-red);
}

.platform-tab.active {
	opacity: 1;
	border-bottom: solid .125rem var(--color-white);
}

.platform .tab-image {
	flex: 1;
	display: flex;
}

.platform .tab-content {
	padding-bottom: 10rem;
}

section.platform .content-container {
	background-image: url('/wp-content/themes/conversion-logix/assets/images/home/platform-banner.svg');
	background-repeat: no-repeat;
	background-position: left bottom;
	background-size: auto;
}

/* TABS */

.tab-buttons .active .grid-10 img {
	transform: rotate(45deg);
}

.tablink {
	opacity: .25;
	transition: opacity 0.3s ease;
}

.tablink:hover {
	cursor: pointer;
}

.tablink .tab-content {
	display: none;
}

.tablink.active {
	opacity: 1;
	border-bottom: solid .0625rem var(--color-navy);
}

.content-container .tablink.active {
	border-bottom: solid .0625rem var(--color-white);
}

.tablink.active .tab-content {
	display: block;
}

.fade-out {
	opacity: 0;
	transition: opacity 0.3s ease;
}

.bubble {
	transition: opacity 0.3s ease;
}

/* TEXT IMAGE */

.text-image-images{
	position:relative;
}

.text-image-images .image-back{
	z-index:1;
}

.text-image-images .image-ribbon{
	top:29%;
	left:0;
	transform:translateY(-50%);
	width:50vw;
	z-index:2;
	pointer-events:none;
}

.flex-direction-row-reverse .text-image-images .image-ribbon{
	left:auto;
	right:0;
	transform:translateY(-50%) scaleX(-1);
}

.text-image-images .image-front{
	top:0;
	left:0;
	width:100%;
	height:100%;
	z-index:3;
}

.text-image-images .image-stat{
	top:15%;
	right:0;
	z-index:4;
}

.image-back img{
	display:block;
	width:100%;
}

.image-front img{
	width:100%;
	height:100%;
	object-fit:cover;
}

/* TEXT IMAGE REPEATER */

.text-image-repeater-inner {
	position: relative;
}

.ribbon {
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	pointer-events: none;
	z-index: -1;
}

.ribbon img {
	width: 100%;
	height: auto;
	display: block;
}

.ribbon-1 {
	top: 14%;
}

.ribbon-2 {
	top: 60%;
}

span.lime {
	color: var(--color-lime);
}

/* TEXT STATS*/

/* TEXT STATS */

.text-stats h3 {
	color: var(--color-navy);
}

.stat-number {
	color: var(--color-navy);
	font-size: 5rem;
	font-weight: 700;
}

.text-stats img {
	width: 3.25069rem;
}

.stat-text {
	font-weight: 600;
}

/* VIDEO CENTERED */

.video-wrapper {
	position: relative;
	padding-top: 56.25%;
	border-radius: var(--radius-3xl);
	overflow: hidden;
}

.video-wrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: 0;
	border-radius: var(--radius-3xl);
}

/* FOOTER */

.footer-menu ul, .socials-menu ul {
	display: -webkit-box;
  	display: -webkit-flex;
  	display: -ms-flexbox;
  	display: flex;
  	align-items: flex-start;
  	justify-content: flex-start;
	flex-wrap: wrap;
	column-gap: 1.5rem;
}

.footer-menu li, .socials-menu li {
	width: calc(50% - .75rem);
	margin-bottom: .75rem;
}

.socials-menu li {
	width: calc(100% - .75rem);
	margin-bottom: .75rem;
}

.footer-watermark img {
	opacity: .05;
	margin-bottom: -7.5rem;
}

.socials-menu img {
	width: 1.5rem;
	height: 1.5rem;
	padding-right: 1rem;
}

#menu-footer-menu {
	margin-block-start: 0rem;
}

.socials-menu a {
	padding-bottom: 1rem;
}

/* SECTIONS */

@media screen and (min-width: 64.0625rem) and (max-width: 100rem) {
	
	.intro-video .content-container {
		padding-top: 5rem;
	}
	
	.rotating-wrapper {
		padding: .75rem 0;
	}
	
	.rotating-wrapper h1 {
		max-width: 80%;
	}
	
	.rotating-wrapper p {
		height: 2.4375rem;
		float: left;
		margin-right: 0.3em;
	}
	
	.rotating-wrapper span {
		float: left;
		overflow: hidden;
		position: relative;
		height: 4.59375rem;
		top: .1rem;
	}

	.rotating-wrapper .rotating-inner {
		display: inline-block;
		position: relative;
		white-space: nowrap;
		top: 0;
		left: 0;

	/*animation*/
		-webkit-animation:move 6s;
   		-moz-animation:move 6s;
    	-ms-animation:move 6s;
     	-o-animation:move 6s;
        animation:move 6s;
	/*animation-iteration-count*/
		-webkit-animation-iteration-count:infinite;
   		-moz-animation-iteration-count:infinite;
    	-ms-animation-iteration-count:infinite;
     	-o-animation-iteration-count:infinite;
        animation-iteration-count:infinite;
	/*animation-delay*/
		-webkit-animation-delay:2s;
   		-moz-animation-delay:2s;
    	-ms-animation-delay:2s;
     	-o-animation-delay:2s;
        animation-delay:2s;
	}

	.rotating-wrapper .rotating-inner h2 {
		margin-top: -1.1875rem;
	}

	@keyframes move {
		0%  { top: 0; }
		33.3333% { top: -6.234375rem; }
		66.6666% { top: -12.46875rem; }
		/* 75% { top: -18.703125rem; } */
	}

	@-webkit-keyframes move {
		0%  { top: 0; }
		33.3333% { top: -6.234375rem; }
		66.6666% { top: -12.46875rem; }
		/* 75% { top: -18.703125rem; } */
	}

	@-moz-keyframes move {
		0%  { top: 0; }
		33.3333% { top: -6.234375rem; }
		66.6666% { top: -12.46875rem; }
		/* 75% { top: -18.703125rem; } */
	}

	@-o-keyframes move {
		0%  { top: 0; }
		33.3333% { top: -6.234375rem; }
		66.6666% { top: -12.46875rem; }
		/* 75% { top: -18.703125rem; } */
	}

	@keyframes move {
		0%  { top: 0; }
		33.3333% { top: -6.234375rem; }
		66.6666% { top: -12.46875rem; }
		/* 75% { top: -18.703125rem; } */
	}
	
	.cards .card {
		padding-left: 6rem;
		padding-right: 6rem;
	}
	
}

@media screen and (min-width: 48rem) {
	
	/* INTRO HOME */
	
	.home-intro-graphic-container {
		left: 50%;
		top: 50%;
		transform: translateY(-30%);
	}
	
	/* PLATFORM */
	
	section.platform .content-container > * {
		padding-right: 0;
		padding-left: 0;
	}
	
	.platform-images {
		gap: 4rem;
	}
	
	/* TABS SERVICES */
	
	section.platform .content-container {
		padding: 3rem 0rem 0rem 3rem;
	}
	
	/* TESTIMONIALS */
	
	.testimonials .swiper-slide .grid-45 {
		padding-right: 2.25rem;
	}
	
	.services-accordion .accordion-panel p {
  		opacity: 0;
  		margin: 0 3rem 3rem 3rem;
  		flex-basis: 100%;
	}
	
	.services-accordion .accordion-panel p.h2 {
		margin-left: 3rem;
		margin-bottom: 1rem;
	}

	.services-accordion .accordion-panel p.description {
		height: 10rem;
	}

	.services-accordion #wrapper {
		display: flex;
		flex-flow: row nowrap;
		height: 40rem;
		min-height: 40rem;
		align-items: stretch;
	}
	
	.services-accordion .accordion-panel {
		flex: 1;
		overflow: hidden;
		display: flex;
		flex-flow: row wrap;
		transition: all 0.6s cubic-bezier(0.65, 0.05, 0.36, 1);
		align-items: flex-end;
		align-content: flex-end;
		background-repeat: no-repeat;
		background-position: center center;
		background-size: cover;
	}
	
	.services-accordion .accordion-panel:hover {
		background-position: left center;
		flex-grow: 2.8;
	}
	
	.services-accordion .accordion-panel:hover > p {
		transition-delay: 0.8s;
		opacity: 1;
		-moz-transform: translateX(0);
		-webkit-transform: translateX(0);
		-o-transform: translateX(0);
		-ms-transform: translateX(0);
		transform: translateX(0);
	}
	
	.services-accordion .accordion-panel:hover > p.h2 {
		transition-delay: 0.4s!important;
	}
	
	.cards .card {
		min-height: 25rem;
	}
}

@media screen and (max-width: 47.9375rem) {
	
	/* CASE STUDY */
	
	.single-crb_case_study .intro .content-container-small img.grid-25 {
		max-width: 3rem;
	}
	
	/* INTRO HOME */
	
	.home-intro-graphic-container {
		bottom: 0!important;
	}
	
	.services-accordion .accordion-panel p {
		margin: 0;
	}
	
	.frame-border {
		border-width: 1rem;
		border-radius: 2rem;
	}

	.border-2 {
		border-radius: 0rem;
	}
	
	.cards .card {
		padding-left: 1.5rem;
		padding-right: 1.5rem;
	}
	
	/* PLATFORM */
	
	.platform-images {
		gap: 1rem;
	}
	
	.platform-tab {
		width: calc(33.3333% - 1rem);
	}
	
	.platform .mobile-grid-33:before, .platform .content-container .grid-100:before, .platform .mobile-grid-33:after, .platform .content-container .grid-100:after {
		position: absolute;
	}
	
	/* TESTIMONIALS */
	
	.testimonials .swiper-slide .grid-45 {
		padding-left: 1.5rem;
		padding-right: 1.5rem;
	}

}

@media screen and (max-width: 37.5rem) {
	
  .services-accordion #wrapper {
    display: flex;
    flex-flow: column wrap;
    height: auto;
    min-height: 100vh;
  }
  
  .services-accordion .accordion-panel {
    min-height: 25rem;
    background-position: center top;
  }
	
}
