/*--------------------------------------------------------------
## Blocks
--------------------------------------------------------------*/

/*
 * Available block selectors:
 * .wp-block-image
 * .wp-block-media-text
 * .wp-block-gallery
 * .wp-block-audio
 * .wp-block-video
 * .wp-block-quote
 * .wp-block-cover
 * .wp-block-file
 * .wp-block-button
 * .wp-block-gallery
 * .wp-block-table
 * .wp-block-embed
 * .wp-block-audio
 * .wp-block-pullquote
 * .wp-block-preformatted
 * .wp-block-code
 * .wp-block-verse
 * .wp-block-table
 * .wp-block-separator
 * .wp-block-columns
 * .wp-block-column
 * .wp-block-latest-posts
 * .wp-block-categories
 * .wp-block-archives
 */

.wp-block-quote.is-large,
.wp-block-quote.is-style-large {
	margin: 1.5em auto;
	padding: 0 1em;
}

.entry-content > .wp-block-quote,
.entry-content > .wp-block-quote.is-style-large {
	margin-left: 1.5rem;
}

@media (--sm) {

	.entry-content > .wp-block-quote,
	.entry-content > .wp-block-quote.is-style-large {
		margin-left: auto;
	}
}

.wp-block-quote:not(.is-large):not(.is-style-large) {
	border-left-color: var(--color-quote-border);
}

.wp-block-quote__citation,
.wp-block-quote cite,
.wp-block-quote footer {
	border-left-color: var(--color-quote-citation);
}

.wp-block-cover {
	display: flex;
	align-items: center;
}

.wp-block-cover__inner-container > * {
	max-width: var(--content-width);
	margin-left: auto;
	margin-right: auto;
}

.wp-block-cover .wp-block-cover-text,
.wp-block-cover p {
	margin-top: 0;
}

/* Columns Block */
.wp-block-column {
	flex-basis: 100%;
}

.wp-block-column:not(:last-child),
.wp-block-column:nth-child(2n + 1) {
	margin-right: 0;
}

.wp-block-column:not(:first-child) {
	margin-left: 0;
}

.wp-block-latest-posts,
.wp-block-latest-comments {
	padding-top: 1.5em;
	padding-bottom: 1.5em;
	border: 1px solid hsl(0, 0%, 80%);
}

ul.wp-block-latest-posts.alignwide,
ul.wp-block-latest-posts.alignfull,
ul.wp-block-latest-posts.is-grid.alignwide,
ul.wp-block-latest-posts.is-grid.alignfull {
	padding: 0 1.5em;
}

/*--------------------------------------------------------------
# Gallery Block - overrides core styles
--------------------------------------------------------------*/

.wp-block-gallery {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
	grid-gap: 0.5em;
}

.wp-block-gallery:not(.components-placeholder) {
	margin: 1.5em auto;
}

/* Override standard ul indentation. */

.entry-content .wp-block-gallery {
	padding-right: 1.5em;
	padding-left: 1.5em;
}

@media screen and (min-width: 48em) {

	.entry-content .wp-block-gallery {
		padding-right: 0;
		padding-left: 0;
	}
}

.wp-block-gallery.columns-2 .blocks-gallery-item,
.wp-block-gallery.columns-3 .blocks-gallery-item,
.wp-block-gallery.columns-4 .blocks-gallery-item,
.wp-block-gallery.columns-5 .blocks-gallery-item,
.wp-block-gallery.columns-6 .blocks-gallery-item,
.wp-block-gallery.columns-7 .blocks-gallery-item,
.wp-block-gallery.columns-8 .blocks-gallery-item,
.wp-block-gallery.columns-9 .blocks-gallery-item {
	grid-column: span 1;
	margin: 0;
	width: inherit;
}

.blocks-gallery-item:last-child:nth-child(odd) {
	grid-column: span 2;
}

@media screen and (min-width: 40em) {

	.wp-block-gallery.columns-2 {
		grid-template-columns: repeat(2, 1fr);
	}

	.wp-block-gallery.columns-3 {
		grid-template-columns: repeat(3, 1fr);
	}

	.wp-block-gallery.columns-4 {
		grid-template-columns: repeat(4, 1fr);
	}

	.wp-block-gallery.columns-5 {
		grid-template-columns: repeat(5, 1fr);
	}

	.wp-block-gallery.columns-6 {
		grid-template-columns: repeat(6, 1fr);
	}

	.wp-block-gallery.columns-7 {
		grid-template-columns: repeat(7, 1fr);
	}

	.wp-block-gallery.columns-8 {
		grid-template-columns: repeat(8, 1fr);
	}

	.wp-block-gallery.columns-9 {
		grid-template-columns: repeat(9, 1fr);
	}
}

/*--------------------------------------------------------------
# Global ACF Blocks Styles
--------------------------------------------------------------*/
.l-block {
	position: relative;
	width: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding-top: 2rem;
	padding-bottom: 2rem;

	@media (--sm) {
		padding-top: 4rem;
		padding-bottom: 4rem;
	}

	&::before,
	&::after {
		display: table;
		content: " ";
	}

	&::after {
		clear: both;
	}
}

.l-block.full-height:first-child,
.full-height:first-child .slide {
	height: calc(100vh - 70px);

	@media (--sm) {
		height: calc(100vh - 100px);
	}
}

.block-background {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	display: block;
	width: 100%;
	height: 100%;
	z-index: -4;
}

@supports (object-fit: cover) {

	.video-background,
	.image-background {
		object-fit: cover;
	}
}

.image-background,
.video-background {
	object-position: center center;
}

.image-as-background {
	overflow: hidden;
	position: relative;
}

.image-background img,
.image-background div,
.video-background div {
	height: 100%;
	width: 100%;
	object-fit: cover;
	object-position: center 25%;
}

.ie .video-background,
.edge .video-background {
	height: auto;
}

.has-overlay {
	overflow-y: hidden;
	position: relative;
	z-index: 0;
}

.has-overlay .block-overlay {
	position: absolute;
	top: 0;
	right: 0;
	height: 100%;
	width: 100%;
	background-color: #000;
	opacity: 0.5;
	z-index: -1;
}

.has-divider {
	padding-top: 6rem;
	padding-bottom: 6rem;
	overflow: hidden;
}

/* Fluid embed */
.fluid-embed,
.is-provider-wistia-inc {
	height: 0;
	overflow: hidden;
	padding-bottom: 56.25%; /* For ratio 16:9. 75% if ratio is 4:3 */
	position: relative;

	& embed,
	& object,
	& iframe {
		position: absolute;
		top: 0;
		left: 0;
		height: 100%;
		width: 100%;
	}
}

.block-headline,
.block-tagline,
.block-caption {
	display: block;
	margin: 0 auto;
}

.block-tagline {
	color: var(--color-gray-light);
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 4px;
	margin-bottom: 0.5rem;

	@media (--sm) {
		letter-spacing: 5px;
	}
}

.block-caption p:first-child {
	margin-top: 1rem;
}

.block-element {
	position: absolute;
	transition: all 0.25s ease-in-out;
}

.block-divider {
	position: absolute;
	left: 0;
	width: 100%;
	line-height: 0;
	direction: ltr;
	z-index: -1;

	& svg {
		position: relative;
		left: 50%;
		display: block;
		width: auto;
		transform: translateX(-50%) rotateY(0deg);
		transform-origin: center;
	}

	@media (--sm) {
		width: calc(100% + 100px);
	}

	& .shape-divider {
		fill: var(--global-bg-color);
		stop-color: var(--global-bg-color);
	}
}

.top-divider {
	top: -1px;
}

.bottom-divider {
	bottom: -1px;
}