/* CONTAINER */

.b-container {
	margin: 0 auto;
	position: relative;
}

.b-container-frame {
	position: relative;
	padding: calc(var(--col-1) + var(--col-gutter));
}

.b-container-background {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 50%;
	width: 100%;
	transform: translate(-50%, 0);
	overflow: hidden;
	background-color: transparent;
	pointer-events: none;
}

.b-container-background .b-img {
	position: absolute !important;
	top: 0;
	left: 50%;
	max-width: none;
	transform: translate(-50%, 0);
}

.b-container-background .b-img img {
	width: 100%;
	height: 100%;
}

.b-container-background .b-img:nth-child(1) {display: block;}
.b-container-background .b-img:nth-child(2) {display: none;}

.b-container[data-width="10"] {max-width: var(--col-10);}
.b-container[data-width="8"] {max-width: var(--col-8);}
.b-container[data-width="6"] {max-width: var(--col-6);}

.b-container[data-misc~="rounded"] .b-container-background {border-radius: var(--s4);}
.b-container[data-misc~="left-align"] {margin-left: 0;}

@media screen and (min-width: 1281px) {
	.b-page .b-container[data-width="14"] {margin: 0 calc((var(--col-1) + var(--col-gutter)) * -1);}
}

@media screen and (max-width: 960px) {
	.b-container-frame {padding: var(--s5);}
	.b-container-background .b-img:nth-child(1) {display: none;}
	.b-container-background .b-img:nth-child(2) {display: block;}
}



/* OPTIONS */

.b-container[data-background="white"] .b-container-background {background-color: var(--white);}
.b-container[data-background="black"] .b-container-background {background-color: var(--black);}
.b-container[data-background="blue"] .b-container-background {background-color: var(--blue-500);}
.b-container[data-background="light-blue"] .b-container-background {background-color: var(--blue-50);}
.b-container[data-background="diagonal-blue-gradient"] .b-container-background {background: var(--diagonal-blue-gradient);}
.b-container[data-background="diagonal-blue-teal-gradient"] .b-container-background {background: var(--diagonal-blue-teal-gradient);}
.b-container[data-background="diagonal-blue-purple-gradient"] .b-container-background {background: var(--diagonal-blue-purple-gradient);}
.b-container[data-background="diagonal-blue-pink-gradient"] .b-container-background {background: var(--diagonal-blue-pink-gradient);}
.b-container[data-background="light-blue-gradient"] .b-container-background {background: var(--light-blue-gradient);}
.b-container[data-background="light-blue-purple-gradient"] .b-container-background {background: var(--light-blue-purple-gradient);}
.b-container[data-background="light-blue-pink-gradient"] .b-container-background {background: var(--light-blue-pink-gradient);}

.b-container[data-bg-alignment="center"] > .b-container-background .b-img:nth-child(1) {top: 50%; transform: translate(-50%, -50%);}
.b-container[data-bg-alignment-mobile="center"] > .b-container-background .b-img:nth-child(2) {top: 50%; transform: translate(-50%, -50%);}

.b-container[data-bg-alignment="bottom"] > .b-container-background .b-img:nth-child(1) {top: auto; bottom: 0;}
.b-container[data-bg-alignment-mobile="bottom"] > .b-container-background .b-img:nth-child(2) {top: auto; bottom: 0; transform: translate(-50%, 0);}

.b-container[data-padding="medium"] > .b-container-frame {padding: var(--s7);}
.b-container[data-padding="small"] > .b-container-frame {padding: var(--s5);}
.b-container[data-padding="none"] > .b-container-frame {padding: 0;}

@media screen and (max-width: 960px) {
	.b-container[data-padding="medium"] > .b-container-frame {padding: var(--s5);}
}



/* CUSTOM LAYOUT */

.b-container[data-layout] > .b-container-frame > .acf-innerblocks-container,
.b-page .b-container[data-layout] > .b-container-frame {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	width: 100%;
	flex-wrap: wrap;
	box-sizing: border-box;
}

.b-container[data-layout] .b-container {margin: 0;}
.b-container[data-layout] > .b-container-frame > .acf-innerblocks-container > *:nth-child(n+3) {opacity: 0.25;}
.b-page .b-container[data-layout] > .b-container-frame > *:nth-child(n+3) {display: none;}

.b-container[data-layout="25-75"] > .b-container-frame {
	--container-width-left: calc(25% - 24rem);
	--container-width-right: calc(75% - 8rem);
}

.b-container[data-layout="33-66"] > .b-container-frame {
	--container-width-left: calc(33.333333% - 21.33rem);
	--container-width-right: calc(66.666666% - 10.66rem);
}

.b-container[data-layout="42-58"] > .b-container-frame {
	--container-width-left: calc(41.666666% - 18.66rem);
	--container-width-right: calc(58.333333% - 13.33rem);
}

.b-container[data-layout="50-50"] > .b-container-frame {
	--container-width-left: calc(50% - var(--s3));
	--container-width-right: calc(50% - var(--s3));
}

.b-container[data-layout="58-42"] > .b-container-frame {
	--container-width-left: calc(58.333333% - 13.33rem);
	--container-width-right: calc(41.666666% - 18.66rem);
}

.b-container[data-layout="66-33"] > .b-container-frame {
	--container-width-left: calc(66.666666% - 10.66rem);
	--container-width-right: calc(33.333333% - 21.33rem);
}

.b-container[data-layout="75-25"] > .b-container-frame {
	--container-width-left: calc(75% - 8rem);
	--container-width-right: calc(25% - 24rem);
}

@media screen and (min-width: 961px) {
	.b-container[data-layout] > .b-container-frame > .acf-innerblocks-container > .acf-block-component:nth-child(1),
	.b-page .b-container[data-layout] > .b-container-frame > *:nth-child(1) {width: var(--container-width-left);}

	.b-container[data-layout] > .b-container-frame > .acf-innerblocks-container > .acf-block-component:nth-child(2),
	.b-page .b-container[data-layout] > .b-container-frame > *:nth-child(2) {width: var(--container-width-right);}

	/* layout options */

	.b-container[data-layout-options~="left-offset"] > .b-container-frame > .acf-innerblocks-container > .acf-block-component:nth-child(1),
	.b-page .b-container[data-layout-options~="left-offset"] > .b-container-frame > *:nth-child(1) {width: calc(var(--container-width-left) - var(--col-gutter));}

	.b-container[data-layout-options~="right-offset"] > .b-container-frame > .acf-innerblocks-container > .acf-block-component:nth-child(2),
	.b-page .b-container[data-layout-options~="right-offset"] > .b-container-frame > *:nth-child(2) {width: calc(var(--container-width-right) - var(--col-gutter));}

	/* layout alignment */

	.b-container[data-layout-alignment~="center"] > .b-container-frame > .acf-innerblocks-container,
	.b-page .b-container[data-layout-alignment~="center"] > .b-container-frame {align-items: center;}

	.b-container[data-layout-alignment~="bottom"] > .b-container-frame > .acf-innerblocks-container,
	.b-page .b-container[data-layout-alignment~="bottom"] > .b-container-frame {align-items: flex-end;}
}

@media screen and (max-width: 960px) {
	.b-container[data-layout] > .b-container-frame > .acf-innerblocks-container,
	.b-page .b-container[data-layout] > .b-container-frame {flex-direction: column; gap: var(--s5) 0;}

	.b-container[data-layout] > .b-container-frame > .acf-innerblocks-container,
	.b-page .b-container[data-layout] > .b-container-frame > * {width: 100%;}

	.b-container[data-layout-options~="reverse-mobile"] > .b-container-frame > .acf-innerblocks-container,
	.b-page .b-container[data-layout-options~="reverse-mobile"] > .b-container-frame {flex-direction: column-reverse;}

	.b-container[data-layout-options~="tight-mobile"] > .b-container-frame > .acf-innerblocks-container,
	.b-page .b-container[data-layout-options~="tight-mobile"] > .b-container-frame {gap: var(--s2) 0;}
}



