/* Webbler Image + Text (uses Webbler Image + Webbler Button styles) */

.wit {
	--wit-w: 50;
	--wit-gap: 56px;
	--wit-valign: center;

	display: grid;
	grid-template-columns: minmax(0, calc((100% - var(--wit-gap)) * var(--wit-w) / 100)) minmax(0, 1fr);
	gap: var(--wit-gap);
	align-items: var(--wit-valign);
}

.wit--img-right {
	grid-template-columns: minmax(0, 1fr) minmax(0, calc((100% - var(--wit-gap)) * var(--wit-w) / 100));
}

.wit--img-right .wit__media {
	order: 2;
}

/* Image column */
.wit__media {
	min-width: 0;
	align-self: var(--wit-media-self, auto);
}

.wit__media .wimg {
	width: 100%;
}

.wit__media .wimg,
.wit__media .wimg__frame,
.wit__media .wimg__media {
	height: var(--wit-media-h, auto);
}

/* Text column */
.wit__content {
	--wit-justify: flex-start;

	display: flex;
	flex-direction: column;
	align-items: var(--wit-justify);
	min-width: 0;
	box-sizing: border-box;
	text-align: left;
}

.wit .wit__sub {
	margin: 0 0 var(--wel-sp-sub, 24px);
	padding: 0;
	color: #6bcbc2;
	font-family: "FS Meridian", serif;
	font-size: 20px;
	font-weight: 500;
	line-height: 24px;
}

.wit .wit__heading {
	margin: 0 0 var(--wel-sp-heading, 24px);
	padding: 0;
	color: #333;
	font-family: "FS Meridian", serif;
	font-size: 48px;
	font-weight: 400;
	line-height: 52px;
}

.wit .wit__text {
	width: 100%;
	color: #333;
	font-family: "FS Meridian", serif;
	font-size: 18px;
	line-height: 24px;
}

.wit .wit__text > * {
	margin-top: 0;
	margin-bottom: 0;
}

.wit .wit__text > * + * {
	margin-top: var(--wel-sp-para, 16px);
}

.wit__text ul,
.wit__text ol {
	padding-left: 1.2em;
}

/* Buttons */
.wit__buttons {
	--wit-btn-dir: row;
	--wit-btn-w: auto;

	display: flex;
	flex-direction: var(--wit-btn-dir);
	flex-wrap: wrap;
	align-items: center;
	justify-content: var(--wit-justify);
	gap: var(--wel-sp-btn-gap, 12px);
	width: 100%;
	margin-top: var(--wel-sp-buttons, 48px);
}

.wit__buttons .wit__btn {
	--wbtn-width: var(--wit-btn-w);
	--wbtn-duration: 300ms;

	padding: 16px 32px;
	border-radius: 60px;
	font-family: "FS Meridian", serif;
	font-size: 18px;
	font-weight: 400;
	line-height: 25px;
}

.wit__btn--primary {
	color: #fff;
}

.wel-can-hover .wit__btn--primary:hover,
.wit__btn--primary:focus-visible {
	color: #163e35;
}

.wit__btn--secondary {
	border: 1px solid #163e35;
	color: #163e35;
}

.wel-can-hover .wit__btn--secondary:hover,
.wit__btn--secondary:focus-visible {
	color: #fff;
}