/* SECTION & FRAME */

.b-frame {
	max-width: var(--frame-width);
	margin: 0 auto;
	padding: 150rem 40rem;
}

.no-pad-top .b-frame {padding-top: 0;}
.no-pad-bottom .b-frame {padding-bottom: 0;}

.b-section.alt-collapse .b-frame {padding-top: 0; padding-bottom: 0;}
.b-section.alt-collapse-top .b-frame {padding-top: 0;}
.b-section.alt-collapse-bottom .b-frame {padding-bottom: 0;}

.b-section[data-style="light"] {background: var(--light);}
.b-section[data-style="dark-blue"] {background: var(--dark-blue);}
.b-section[data-style="blue-gradient"] {background: linear-gradient(225deg, var(--blue), #0D1A66);}
.b-section[data-style="green"] {background: var(--green);}
.b-section[data-style="dark-blue-radial"] {background-image: radial-gradient(circle at 50% -15%, #223CCF 0%, #000425 60%);}



/* overlap */

.b-page .b-section.alt-overlap .b-frame {padding-bottom: 300rem;}
.b-page .b-section.alt-overlap + .b-section .b-frame {padding-top: 0; margin-top: -150rem;}



/* cta */

.b-section.alt-cta {position: relative;}
.b-section.alt-cta .b-frame {position: relative;}
.b-section.alt-cta .b-cta-deco {pointer-events: none;}

.b-section.alt-cta::before {
	content: "";
	position: absolute;
	bottom: 100%;
	left: -100rem;
	border: 100rem solid transparent;
	border-bottom-color: #11217f;
}

.b-section.alt-cta .b-cta-deco::after {
	content: "";
	z-index: 1;
	position: absolute;
	top: 100%;
	right: -340rem;
	width: 250rem;
	height: 300rem;
	background: var(--dark-blue);
}

.b-section.alt-cta .b-cta-deco-left {
	position: absolute;
	width: 214rem;
	height: 927rem;
	left: -327rem;
	bottom: -596rem;
	background: url(images/cta-deco-left.svg) no-repeat top center / 100% auto;
}

.b-section.alt-cta .b-cta-deco-right {
	position: absolute;
	width: 215rem;
	height: 783rem;
	right: -326rem;
	top: -232rem;
	background: url(images/cta-deco-right.svg) no-repeat top center / 100% auto;
}

@media screen and (min-width: 1920px){
	.b-section.alt-cta::before {top: -98%;}
}



/* head */

.b-section.alt-head {
	position: relative;
}

.b-section.alt-head .b-frame {
	position: relative;
}

.b-section.alt-head::before {
	content: "";
	position: absolute;
	bottom: 0;
	left: -100rem;
	border: 100rem solid transparent;
	border-bottom-color: var(--white);
}

.b-section.alt-head .b-frame::after {
	content: "";
	position: absolute;
	bottom: -218rem;
	right: -331rem;
	width: 329rem;
	height: 969rem;
	background: no-repeat url(images/head-deco-right.svg) center / 100% auto;
}



/* floating */

.b-section[data-style="floating"] + .b-section {padding-top: 150rem; margin-top: -150rem;}

.b-section[data-style="floating"][data-bg="light"] {background: var(--light);}
.b-section[data-style="floating"][data-bg="dark-blue"] {background: var(--dark-blue);}
.b-section[data-style="floating"][data-bg="blue-gradient"] {background: linear-gradient(225deg, var(--blue), #0D1A66);}
.b-section[data-style="floating"][data-bg="green"] {background: var(--green);}
.b-section[data-style="floating"][data-bg="dark-blue-radial"] {background-image: radial-gradient(circle at 50% -20%, #223CCF 0%, #000425 60%);}

@media screen and (min-width: 476px) {
	.b-section[data-style="floating"] .b-frame {padding-top: 0; padding-bottom: 0;}
}

@media screen and (max-width: 475px) {
	.b-section[data-style="floating"] + .b-section {padding-top: 130rem; margin-top: -190rem;}
}


/* notch */

.b-section.alt-notch {
	position: relative;
}

.b-section.alt-notch::before {
    content: "";
    position: absolute;
    top: -198rem;
    left: -100rem;
    border: 100rem solid transparent;
    border-bottom-color: var(--white);
}

.b-section[data-style="light"].alt-notch::before {border-bottom-color: var(--light);}
.b-section[data-style="dark-blue"].alt-notch::before {border-bottom-color: var(--dark-blue);}
.b-section[data-style="blue-gradient"].alt-notch::before {border-bottom-color: #11217f;}
.b-section[data-style="green"].alt-notch::before {border-bottom-color: var(--green);}

@media screen and (min-width: 961px) {
	.b-page .b-section.alt-tight .b-frame {padding-top: 80rem; padding-bottom: 80rem;}
	.b-page .b-section.alt-tight-top .b-frame {padding-top: 80rem;}
	.b-page .b-section.alt-tight-bottom .b-frame {padding-bottom: 80rem;}

	.b-page .b-section.alt-overlap.alt-tight .b-frame {padding-bottom: 160rem;}
	.b-page .b-section.alt-overlap.alt-tight + .b-section .b-frame {margin-top: -80rem;}
}

@media screen and (max-width: 960px) {
	.b-frame {padding: 60rem 20rem;}

	.b-page .b-section.alt-overlap .b-frame {padding-bottom: 120rem;}
	.b-page .b-section.alt-overlap + .b-section .b-frame {padding-top: 0; margin-top: -60rem;}
	
	.b-section.alt-cta::before {display: none;}
	.b-section.alt-cta .b-cta-deco {display: none;}
	
	.b-section.alt-head::before {display: none;}
	.b-section.alt-head .b-frame::before,
	.b-section.alt-head .b-frame::after {display: none;}

	.b-section.alt-notice .b-frame::before {display: none;}
	
	.b-section.alt-notch::before {display: none;}
}