/* Our Clients :: Front-end */

.oc-section {
	--oc-hs: 1;
	--oc-bs: 1;
	--oc-cs: 1;
	--oc-card-w: calc( var( --oc-card-w-set, 285px ) * var( --oc-cs ) );
	--oc-card-h: calc( var( --oc-card-h-set, 239px ) * var( --oc-cs ) );
	--oc-card-gap: calc( var( --oc-card-gap-set, 20px ) * var( --oc-cs ) );
	--oc-gutter: calc( ( var( --oc-canvas, 1440px ) - var( --oc-content, 1200px ) ) / 2 );

	width: 100%;
	padding: var( --oc-pad-y, 60px ) 0;
	margin-bottom: var( --oc-gap-bottom, 0px );
	background-color: var( --oc-section-bg, #FFFFFF );
	font-family: 'Google Sans', sans-serif;
	box-sizing: border-box;
}

#content > section.oc-section {
	padding-top: 10px !important;
}
.oc-section * { box-sizing: border-box; }

.oc-container {
	max-width: var( --oc-canvas, 1440px );
	margin: 0 auto;
	padding: 0 var( --oc-gutter );
}

/* Theme reset guards */
.oc-section h2,
.oc-section p { margin: 0; padding: 0; }
.oc-section h2 { font-family: inherit; letter-spacing: 0; }
.oc-section a { box-shadow: none; text-decoration: none; }

/* Headline block */

.oc-head { text-align: center; }

.oc-heading {
	font-family: 'Anybody', sans-serif !important;
	font-weight: 700;
	line-height: 1.025;
	text-transform: uppercase;
	color: var( --oc-heading, #333333 );
	font-size: max( 24px, calc( var( --oc-heading-fs, 40px ) * var( --oc-hs ) ) );
}

.oc-subtitle {
	font-style: italic;
	font-weight: 400;
	line-height: 1.25;
	color: var( --oc-subtitle, #333333 );
	font-size: max( 14px, calc( var( --oc-subtitle-fs, 20px ) * var( --oc-hs ) ) );
}

.oc-head .oc-intro {
	max-width: var( --oc-intro-w, 1061px );
	margin: 20px auto 0;
}
.oc-head .oc-intro p {
	font-weight: 400;
	line-height: 1.25;
	color: var( --oc-intro, #9F9F9F );
	font-size: max( 13px, calc( var( --oc-intro-fs, 20px ) * var( --oc-bs ) ) );
}

/* The strip */

.oc-strip {
	position: relative;
	margin-top: 30px;
	overflow: hidden;
	transform: translate3d( 0, 0, 0 );
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
	perspective: 1000px;
}

/* Full bleed */
.oc-strip.oc-full {
	width: var( --oc-vw, 100vw );
	max-width: var( --oc-vw, 100vw );
	margin-left: calc( 50% - ( var( --oc-vw, 100vw ) / 2 ) );
	margin-right: calc( 50% - ( var( --oc-vw, 100vw ) / 2 ) );
	padding: 2px 0;
}

.oc-track {
	display: flex;
	align-items: stretch;
	width: max-content;
	will-change: transform;
	animation: oc-scroll var( --oc-duration, 30s ) linear infinite;
	animation-iteration-count: infinite;
	animation-play-state: running;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
	perspective: 1000px;
	transform: translate3d( 0, 0, 0 );
}
.oc-reverse { animation-direction: reverse; }

@keyframes oc-scroll {
	0%   { transform: translate3d( 0, 0, 0 ); }
	100% { transform: translate3d( calc( var( --oc-shift, 50% ) * -1 ), 0, 0 ); }
}

/* Grab and drag */
.oc-strip.is-grabbable { cursor: grab; touch-action: pan-y; }
.oc-strip.is-grabbing { cursor: grabbing; }
.oc-strip.is-grabbing,
.oc-strip.is-grabbing * { user-select: none; -webkit-user-select: none; }
.oc-strip img,
.oc-strip a { -webkit-user-drag: none; }

.oc-strip:hover .oc-pausable,
.oc-pausable:focus-within { animation-play-state: paused; }

.oc-run {
	display: flex;
	align-items: stretch;
	flex: 0 0 auto;
}

.oc-card {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	width: var( --oc-card-w, 285px );
	height: var( --oc-card-h, 239px );
	margin-right: var( --oc-card-gap, 20px );
	padding: 16px;
	background: var( --oc-card-bg, #FFFFFF );
	border: 1px solid var( --oc-card-border, #E6E6E6 );
	border-radius: var( --oc-card-radius, 20px );
	transition: transform .25s ease, box-shadow .25s ease;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
}
a.oc-card:hover,
a.oc-card:focus {
	transform: translateY( -3px );
	box-shadow: 0 12px 26px rgba( 16, 24, 40, .07 );
}

.oc-logo {
	display: block;
	max-width: min( 100%, var( --oc-logo-max-w, 254px ) );
	max-height: min( 100%, var( --oc-logo-max-h, 150px ) );
	width: auto;
	height: auto;
	object-fit: contain;
}

/* REVEAL - "the lights" */

.oc-js .oc-rv { opacity: 0; }

/* Headline */
.oc-js .oc-rv--rise.oc-rv-in {
	animation: oc-rise .7s cubic-bezier( .22, .8, .26, 1 ) both;
	animation-delay: calc( var( --oc-rv-i, 0 ) * 85ms );
}
@keyframes oc-rise {
	0% { opacity: 0; transform: translate3d( 0, 20px, 0 ); filter: blur( 4px ); }
	60% { opacity: 1; }
	100% { opacity: 1; transform: translate3d( 0, 0, 0 ); filter: none; }
}

/* The lights */
.oc-js .oc-strip.oc-rv-in { opacity: 1; }

.oc-js .oc-strip:not( .oc-rv-in ) .oc-track { animation-play-state: paused; }

.oc-js .oc-strip .oc-card {
	opacity: 0;
	filter: grayscale( 1 );
}
.oc-js .oc-strip.oc-rv-in .oc-card {
	animation: oc-light .6s ease both;
	animation-delay: calc( var( --oc-n, 0 ) * 90ms );
}
@keyframes oc-light {
	0% {
		opacity: 0;
		filter: grayscale( 1 ) brightness( 1.08 );
		transform: scale( .96 );
	}
	45% { opacity: 1; }
	100% {
		opacity: 1;
		filter: grayscale( 0 ) brightness( 1 );
		transform: scale( 1 );
	}
}

@media ( prefers-reduced-motion: reduce ) {
	.oc-js .oc-rv,
	.oc-js .oc-rv.oc-rv-in,
	.oc-js .oc-strip .oc-card {
		opacity: 1;
		transform: none;
		filter: none;
		animation: none !important;
	}
	.oc-track { animation: none !important; }
	.oc-run[aria-hidden="true"] { display: none; }
	.oc-card { transition: none; }
}

/* Breakpoints */

@media ( max-width: 1439px ) {
	.oc-section { --oc-gutter: clamp( 40px, 6vw, 120px ); }
}

@media ( max-width: 1200px ) {
	.oc-section { --oc-hs: .9; --oc-bs: .95; }
}

@media ( max-width: 1024px ) {
	.oc-section { --oc-hs: .82; --oc-bs: .92; padding: 48px 0; }
}

@media ( max-width: 600px ) {
	.oc-section {
		--oc-hs: .7;
		--oc-bs: .9;
		--oc-gutter: 20px;
		--oc-cs: .74;
		padding: 40px 0;
	}
}

@media ( max-width: 400px ) {
	.oc-section { --oc-hs: .64; --oc-bs: .88; --oc-gutter: 16px; --oc-cs: .63; }
}