/**
 * Self-contained styling for the ported LaunchKit shortcodes.
 *
 * The original rules lived in the theme's theme.less and were compiled with
 * @standard-space: 80px and @color-primary: #3399cc. Those values are exposed
 * as custom properties by the plugin so they can be re-skinned.
 *
 * LaunchKit's own class names (.header-7, .features-18, .background-image-holder
 * and friends) are kept so the site's stored Custom CSS still matches. Layout
 * helpers such as .container and .row are scoped under .ttd-lk to avoid
 * colliding with the new theme, since Bootstrap is no longer loaded.
 */

.ttd-lk {
	position: relative;
	box-sizing: border-box;
}

.ttd-lk *,
.ttd-lk *::before,
.ttd-lk *::after {
	box-sizing: inherit;
}

/* ---------- Scoped grid helpers (Bootstrap 3 replacements) ---------- */

.ttd-lk .container {
	position: relative;
	z-index: 3;
	width: 100%;
	max-width: 1170px;
	margin: 0 auto;
	padding: 0 15px;
}

.ttd-lk .row {
	display: flex;
	flex-wrap: wrap;
	margin: 0 -15px;
}

.ttd-lk .col-sm-12,
.ttd-lk .col-sm-6,
.ttd-lk .col-md-10 {
	position: relative;
	width: 100%;
	padding: 0 15px;
}

.ttd-lk .text-center {
	text-align: center;
}

@media all and ( min-width: 768px ) {

	.ttd-lk .col-sm-6 {
		width: 50%;
	}
}

@media all and ( min-width: 992px ) {

	.ttd-lk .col-md-10 {
		width: 83.33333%;
	}

	.ttd-lk .col-md-offset-1 {
		margin-left: 8.33333%;
	}
}

/* ---------- Background image layer ---------- */

.ttd-lk .background-image-holder {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
	width: 100%;
	height: 100%;
	background-color: #222;
	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-size: cover;
}

/*
 * LaunchKit moved this layer with JavaScript. A fixed attachment gives the same
 * impression without the script, but breaks inside overflow:hidden ancestors
 * (Chrome paints an empty layer). Keep the parallax class for CSS hooks and use
 * cover positioning instead.
 */
.ttd-lk.parallax .background-image-holder {
	background-attachment: scroll;
}

/* ---------- Hero ---------- */

.ttd-lk-hero {
	padding: 0;
	background: #222;
}

.ttd-lk-hero .hero-slider {
	position: relative;
	overflow: hidden;
	background: #222;
}

.ttd-lk-hero .slides {
	margin: 0;
	padding: 0;
	list-style: none;
}

.ttd-lk-hero .slides > li {
	position: relative;
	overflow: hidden;
	margin: 0;
	list-style: none;
}

.ttd-lk-hero .slides > li::before {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
	width: 100%;
	height: 100%;
	background: #000;
	content: '';
}

.ttd-lk-hero .slides > li > .container {
	z-index: 3;
}

.ttd-lk-hero h1,
.ttd-lk-hero h2,
.ttd-lk-hero h3,
.ttd-lk-hero h4,
.ttd-lk-hero h5,
.ttd-lk-hero h6,
.ttd-lk-hero p,
.ttd-lk-hero li,
.ttd-lk-hero a {
	color: var( --ttd-lk-hero-text, #fff );
}

.ttd-lk-hero h1 {
	margin-top: 0;
	margin-bottom: calc( var( --ttd-lk-space, 80px ) / 3 );
}

/* Normal height: .header-7 */
.ttd-lk-hero.header-7 .slides > li {
	padding: calc( var( --ttd-lk-space, 80px ) * 3.5 ) 0;
}

.ttd-lk-hero.header-7 .slides > li::before {
	opacity: 0.2;
}

.ttd-lk-hero.header-7 h1 {
	font-weight: 700;
}

/* Short height: .header-11 */
.ttd-lk-hero.header-11 .hero-slider {
	background: var( --ttd-lk-primary, #3399cc );
}

.ttd-lk-hero.header-11 .slides > li {
	padding: calc( var( --ttd-lk-space, 80px ) * 2 ) 0;
}

.ttd-lk-hero.header-11 .slides > li::before {
	opacity: 0;
}

.ttd-lk-hero.header-11.overlay .slides > li::before {
	opacity: 0.3;
}

/* Full window height: .features-9 */
.ttd-lk-hero.features-9 {
	padding: 0;
}

.ttd-lk-hero.features-9 .slides > li {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	min-height: 100vh;
}

.ttd-lk-hero.features-9 .slides > li::before {
	opacity: 0.4;
}

@media all and ( max-width: 767px ) {

	.ttd-lk-hero.header-7 .slides > li,
	.ttd-lk-hero.features-9 .slides > li {
		padding: calc( var( --ttd-lk-space, 80px ) * 1.5 ) 0;
	}

	.ttd-lk-hero.features-9 .slides > li {
		display: block;
		min-height: 0;
	}

	.ttd-lk-hero.header-11 .slides > li {
		padding: var( --ttd-lk-space, 80px ) 0;
	}

	.ttd-lk-hero br {
		display: none;
	}
}

/* ---------- Image tile with hover title ---------- */

.ttd-lk-tile {
	overflow: hidden;
	padding: 0;
}

.ttd-lk-tile .feature {
	position: relative;
	overflow: hidden;
	height: 450px;
	padding: 0;
	cursor: pointer;
}

.ttd-lk-tile .ttd-lk-tile-link {
	position: relative;
	display: block;
	width: 100%;
	height: 100%;
	cursor: pointer;
	text-decoration: none;
}

.ttd-lk-tile .background-image-holder {
	transform: scale( 1 );
	transition: transform 0.3s ease;
}

.ttd-lk-tile .overlay::before {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
	width: 100%;
	height: 100%;
	background: rgba( 0, 0, 0, 0.4 );
	content: '';
	opacity: 0;
	transition: opacity 0.3s ease;
}

.ttd-lk-tile .container {
	position: absolute;
	top: 50%;
	left: 0;
	max-width: 100%;
	text-align: center;
	opacity: 0;
	transform: translateY( -20% );
	transition: transform 0.3s ease, opacity 0.3s ease;
}

.ttd-lk-tile .feature:hover .overlay::before,
.ttd-lk-tile .ttd-lk-tile-link:focus-visible .overlay::before {
	opacity: 1;
}

.ttd-lk-tile .feature:hover .container,
.ttd-lk-tile .ttd-lk-tile-link:focus-visible .container {
	opacity: 1;
	transform: translateY( -50% );
}

.ttd-lk-tile .feature:hover .background-image-holder,
.ttd-lk-tile .ttd-lk-tile-link:focus-visible .background-image-holder {
	transform: scale( 1.02 );
}

.ttd-lk-tile,
.ttd-lk-tile h1,
.ttd-lk-tile h2,
.ttd-lk-tile h3,
.ttd-lk-tile h4,
.ttd-lk-tile h5,
.ttd-lk-tile h6,
.ttd-lk-tile p,
.ttd-lk-tile a {
	color: #fff;
}

.ttd-lk-tile h1,
.ttd-lk-tile h2,
.ttd-lk-tile h3,
.ttd-lk-tile h4 {
	margin: 0 0 calc( var( --ttd-lk-space, 80px ) / 4 );
}

@media all and ( max-width: 1500px ) {

	.ttd-lk-tile .feature {
		height: 500px;
	}
}

@media all and ( max-width: 1450px ) {

	.ttd-lk-tile .feature {
		height: 470px;
	}
}

@media all and ( max-width: 1280px ) {

	.ttd-lk-tile .feature {
		height: 400px;
	}
}

@media all and ( max-width: 1000px ) {

	.ttd-lk-tile .feature {
		height: 380px;
	}
}

/*
 * Hover is unavailable on touch devices, so the title has to be visible.
 */
@media ( hover: none ) {

	.ttd-lk-tile .container {
		opacity: 1;
		transform: translateY( -50% );
	}

	.ttd-lk-tile .overlay::before {
		opacity: 1;
	}
}

/* ---------- Coloured feature block ---------- */

.ttd-lk-feature {
	padding: 0;
}

.ttd-lk-feature .feature {
	padding: var( --ttd-lk-space, 80px ) calc( var( --ttd-lk-space, 80px ) / 1.5 );
	border: 1px solid var( --ttd-lk-primary, #3399cc );
	background: var( --ttd-lk-primary, #3399cc );
	transition: transform 0.3s ease;
}

.ttd-lk-feature .feature:hover {
	z-index: 20;
	transform: scale( 1.05 );
}

.ttd-lk-feature .feature *:not( i ) {
	color: #fff;
}

.ttd-lk-feature i {
	display: inline-block;
	margin-bottom: calc( var( --ttd-lk-space, 80px ) / 2 );
	color: rgba( 255, 255, 255, 0.7 );
	font-size: 80px;
}

@media all and ( max-width: 767px ) {

	.ttd-lk-feature .feature {
		padding: calc( var( --ttd-lk-space, 80px ) / 2 );
	}

	.ttd-lk-feature .feature:hover {
		transform: scale( 1 );
	}
}

/* ---------- Testimonials ---------- */

.ttd-lk-testimonials .slides {
	margin: 0;
	padding: 0;
	list-style: none;
}

.ttd-lk-testimonials .slides > li {
	margin: 0;
	list-style: none;
}

.ttd-lk-testimonials .ttd-lk-quote {
	color: var( --ttd-lk-body, #1e73be );
}

.ttd-lk-testimonials img {
	display: inline-block;
	margin-bottom: calc( var( --ttd-lk-space, 80px ) / 4 );
	border-radius: 50%;
}

.ttd-lk-testimonials .ttd-lk-cite {
	margin: 0;
	color: var( --ttd-lk-heading, #1d1d4a );
	font-weight: 700;
}

.ttd-lk-testimonials.testimonials-3 .row {
	row-gap: var( --ttd-lk-space, 80px );
}

/* ---------- Shared carousel ---------- */

.ttd-lk .ttd-lk-carousel {
	position: relative;
}

.ttd-lk .ttd-lk-carousel > .slides {
	display: flex;
	overflow-x: auto;
	scroll-behavior: smooth;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
}

.ttd-lk .ttd-lk-carousel > .slides::-webkit-scrollbar {
	display: none;
}

.ttd-lk .ttd-lk-carousel > .slides > li {
	flex: 0 0 100%;
	scroll-snap-align: center;
}

.ttd-lk-carousel-nav {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin-top: 24px;
}

.ttd-lk-carousel-arrow,
.ttd-lk-carousel-dot {
	padding: 0;
	border: 0;
	background: none;
	cursor: pointer;
	appearance: none;
}

.ttd-lk-carousel-arrow {
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: var( --ttd-lk-primary, #3399cc );
	color: #fff;
	font-size: 18px;
	line-height: 36px;
}

.ttd-lk-carousel-dot {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: rgba( 0, 0, 0, 0.2 );
}

.ttd-lk-carousel-dot[aria-current='true'] {
	background: var( --ttd-lk-primary, #3399cc );
}

.ttd-lk-hero .ttd-lk-carousel-nav {
	position: absolute;
	bottom: 16px;
	left: 0;
	z-index: 4;
	width: 100%;
	margin-top: 0;
}

.ttd-lk-hero .ttd-lk-carousel-dot {
	background: rgba( 255, 255, 255, 0.4 );
}

.ttd-lk-hero .ttd-lk-carousel-dot[aria-current='true'] {
	background: #fff;
}

@media ( prefers-reduced-motion: reduce ) {

	.ttd-lk .ttd-lk-carousel > .slides {
		scroll-behavior: auto;
	}

	.ttd-lk-tile .container,
	.ttd-lk-tile .background-image-holder,
	.ttd-lk-tile .overlay::before,
	.ttd-lk-feature .feature {
		transition: none;
	}
}