/* COLUMNS */

.COLUMNS::before,
.COLUMNS::after {
	content: "";
	display: block;
	overflow: hidden;
}

.COLUMNS .inner-wrapper {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

.COLUMNS .content {
	flex-grow: 1;
	width: 100%;
}

.COLUMNS .image {
	align-self: flex-start;
	flex-shrink: 0;
	margin-bottom: var(--s4);
	width: 100%;
}

.COLUMNS .link a {text-decoration: none;}

@media (width <= 960px) {
	.COLUMNS .image {margin-bottom: var(--s3);}
}



/* card */

.COLUMNS[data-variant="card"] .outer-wrapper {
	padding: var(--s5);
	background: var(--white);
	border-radius: var(--s1);
	border: 1rem solid var(--green-400);
	box-sizing: border-box;
	height: 100%;
}

.COLUMNS[data-variant="card"][data-card-misc*="grey-bg"] .outer-wrapper {
	background: var(--green-100);
	border: none;
}

.COLUMNS[data-variant="card"] .inner-wrapper {
	height: 100%;
}

.COLUMNS[data-variant="card"] .link {margin-top: var(--s5);}

.COLUMNS[data-variant="card"] .link a::after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/* card full image */

.COLUMNS[data-variant="card"][data-card-misc*="full-image"] .outer-wrapper {
	padding: 0;
	overflow: hidden;
}

.COLUMNS[data-variant="card"][data-card-misc*="full-image"] .content {
	padding: var(--s5);
	width: auto;
}

.COLUMNS[data-variant="card"][data-card-misc*="full-image"] .image {
	margin-bottom: 0;
}

.COLUMNS[data-variant="card"][data-card-misc*="full-image"] .link {margin: var(--ps) var(--s5) var(--s5);}

/* card image on side */ 

.COLUMNS[data-variant="card"][data-card-misc*="side-image"] .inner-wrapper {
	display: flex;
	flex-direction: row-reverse;
	gap: var(--s5);
}

.COLUMNS[data-variant="card"][data-card-misc*="side-image"] .image {
	flex: 0 0 auto;
	width: 50%;
	border-radius: var(--s1);
	overflow: hidden;
}

/* card icon */

.COLUMNS[data-variant="card"][data-card-misc*="icon"] .image {
	width: 100rem;
}

@media (width <= 960px) {
	.COLUMNS[data-variant="card"] .outer-wrapper {padding: var(--s4);}
	.COLUMNS[data-variant="card"][data-card-misc*="side-image"] .inner-wrapper {flex-direction: column; gap: initial;}
	.COLUMNS[data-variant="card"][data-card-misc*="side-image"] .image {width: 100%;}
}

/* LEFT BORDER */ 

.COLUMNS[data-variant="left-border"] .outer-wrapper {
	border-left: 2rem solid var(--orange);
	padding: var(--s5);
	background: var(--white);
	box-sizing: border-box;
	height: 100%;
}


@media (width <= 960px) {
	.COLUMNS[data-variant="left-border"] .outer-wrapper {padding: var(--s4) var(--s5);}
}


/* number heading */

.COLUMNS[data-number-heading] h3 {display: flex;align-items: center;margin-bottom: var(--s4); width: -webkit-fill-available;}

.COLUMNS[data-number-heading] .number {
	font-size: inherit;
	width: 60rem;
	height: 60rem;
	border-radius: 50%;
	background: var(--navy);
	color: var(--white);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-right: var(--s3);
	transition: background 0.25s;
	flex: 0 0 auto;
}

.COLUMNS[data-number-heading] .outer-wrapper:hover .number {
	background: var(--orange);
}

.COLUMNS .image[data-heading] {display: flex;align-items: center;margin-bottom: var(--s4); width: -webkit-fill-available;}
.COLUMNS .image[data-heading] .b-img-meta {display: none !important;}
.COLUMNS .image[data-heading] .b-img {flex: 0 0 auto; margin: -2rem var(--s3) 0 0; align-self: flex-start; width: 100rem;}


@media (width <= 960px) {
	.COLUMNS .image[data-heading] {flex-direction: column; width: auto!important;}
	.COLUMNS .image[data-heading] .b-img-meta {display: none !important;}
	.COLUMNS .image[data-heading] .b-img {width: 100rem;}
}

/* alt full */ 

.COLUMNS.alt-full .link {width: 100%;}
.COLUMNS.alt-full .link .b-button {width: 100%; background: var(--orange); color: var(--white); padding: 12rem var(--s4); box-shadow: none;}
.COLUMNS.alt-full .link .b-button svg {display: none;}
.COLUMNS.alt-full .outer-wrapper {transition: background 0.25s;}
.COLUMNS.alt-full .outer-wrapper:hover {background: var(--navy);}
.COLUMNS.alt-full .outer-wrapper:hover .content :is(h1, h2, h3, h4, h5, h6, p, ul, ol, li) {color: var(--white);}


.COLUMNS[data-variant="card"].alt-contact .outer-wrapper {
	border: none;
}

/* embla */ 


.COLUMNS .embla[data-desktop] .embla__dots {
	right: auto;
	left: 0;
}

@media (width <= 960px) {
	.COLUMNS .embla {padding-bottom:0;}
	.COLUMNS .embla__buttons .embla__prev, .COLUMNS .embla__next, .COLUMNS .embla__dots {display: block;}
	.COLUMNS .embla__dots {
		position: static;
		margin-bottom: var(--s6);
	}
	.COLUMNS .embla__buttons {
		position: static;
		margin-top: var(--s5);
		left: auto;
		bottom: auto;
		justify-content: center;
	}
} 





/* MODAL */

.b-modal .COLUMNS {width: 9999rem; max-width: 100%;}
