/* BA custom framework. Based on Bootstrap 5.3. Jan 2023. */
/*	
	1.	vars
	2.	layout
	3.	colors, background, overlays
	4.	typography
	5.	margins
	6.	buttons
	7.	links
	8.	alerts
	9.	theme-dark
*/



/* ************************* */
/* 1. VARS					 */
/* ************************* */
:root{
	--color-black:#222944;
	--color-black-rgb:34,41,68;
	--color-white:#fff;
	--color-white-rgb:255,255,255;
	--color-base:var(--color-black);
	--color-base-rgb:var(--color-black-rgb);
	--color-base65:rgba(var(--color-base-rgb),0.65);
	--color-base30:rgba(var(--color-base-rgb),0.3);
	--color-grey:#BFC3CD;
	--color-light-grey:#F1F2F6;
	--color-dark-grey:#4B5370;
	--color-orange:#FF9A00;
	--color-dark-yellow:#FFA400;
	--color-yellow:#FFB700;
	--color-dark-blue:#1D3C6D;
	--color-dark-blue40:rgba(29,60,109,0.4);
	--color-mist:#707BA0;
	--color-blue:#006EB3;
	--color-indigo:#0048B4;
	--color-light-blue:#71C8FF;
	--color-midnight:#1C2137;
	
	--color-link:var(--color-blue);
	--color-hover:var(--color-orange);
	--color-active:var(--color-indigo);
	--color-disabled:var(--color-light-grey);
	--color-danger:#842029;
	--color-success:#0F5132;
	--color-body-bg:var(--color-white);
	--color-input-bg:var(--color-light-grey);
	--color-heading:var(--color-dark-blue);
	
	--lh-p:1.5;
	--lh-base:1.15;
	--font-base:500 1rem/var(--lh-base) 'Base', sans-serif;
	--font-icon:900 1rem/1 'Font Awesome 6 Free';
	--font-heading:700 1rem/var(--lh-base) 'Base', sans-serif;
	--text-x-lead:1.5rem;
	--text-lead:1.125rem;
	--text-small:0.8125rem;
	--text-button:1.125rem;
	--h1:4.25rem;
	--h2:3rem;
	--h3:2.5rem;
	--h4:1.75rem;
	--h5:1.31rem;
	--h6:1.125rem;
	
	--margin-small:0.5rem;
	--margin-normal:1.25rem;
	--margin-big:3rem;
	
	--padding-normal:4.5rem;
	--padding-large:8rem;
	
	--radius-big:1.25rem;
	--radius-normal:0.375rem;
	--radius-small:0.13rem;
	--shadow-normal:0 0 1.25rem 0 rgba(0,0,0,0.1);
	--shadow-hover:0 0 1.5625rem 0 rgba(0,0,0,0.2);
	
	--container:1140px;
	--page-side-gap:calc(50vw - var(--container)/2 + 0.75rem);
	
	--input-height:3.94rem;
	--header-height:9.68rem;
	--header-height-sticky:6.75rem;
	--header-height-mobile:4rem;
	--upload-button-width:9rem;
	
	--scroll-width:0.5rem;
	
	--time-slow:0.8s;
	--time-normal:0.4s;
	--time-fast:0.2s;
}
@media (max-width: 1199.98px) {
	:root{
		--container:960px;
		--header-height-sticky:5.5rem;
		--h1:3.05rem;
		--h2:2.44rem;
		--h3:1.95rem;
		--h4:1.56rem;
		--h5:1.25rem;
		--h6:1.1rem;
		--text-x-lead:1.45rem;
		--text-lead:1.15rem;
	}
}
@media (max-width: 991.98px) {
	:root{
		--container:100vw;
		--padding-normal:4rem;
		--padding-large:6.5rem;
	}
}
@media (max-width: 767.98px) {
	:root{
		--padding-large:5.5rem;
		--h1:2.48rem;
		--h2:2.07rem;
		--h3:1.73rem;
		--h4:1.44rem;
		--h5:1.20rem;
		--h6:1.1rem;
		--text-x-lead:1.35rem;
		--text-lead:1.12rem;
	}
}



/* ************************* */
/* 2. LAYOUT				 */
/* ************************* */
html, body{height:100%;}
body{color: var(--color-base); background:var(--color-body-bg); display: flex; flex-direction: column; overflow-x: hidden;}
body *{ position:relative;}

#page-wrap{flex:1 0 auto;}

.container{width:var(--container); max-width: var(--container); margin-left:calc(50vw - var(--container)/2);}
.content-section{ padding-top:var(--padding-normal); padding-bottom:var(--padding-normal); }
.large-padding-top{ padding-top:var(--padding-large);}
.large-padding-bottom{ padding-bottom:var(--padding-large);}
.content-section:not([class*='bg-'])+.content-section:not([class*='bg-']){padding-top:0;}
#header + .content-section{border-top:1px solid var(--color-grey);}
.section-bg{position: absolute; top:0; right:0; bottom:0; left:0;}
.section-bg img, .section-bg video{object-fit: cover; width:100%; height:100%;}
.section-bg.origin-top-right img, .section-bg.origin-top-right video{object-position: right top;}
.section-bg.origin-bottom-right img, .section-bg.origin-bottom-right video{object-position: right bottom;}
.image-fit img, .image-fit video{object-fit: cover; width:100%; height:100%;}

[class*='col-'].indent-right{padding-right:calc(var(--container)/24);}
[class*='col-'].indent-left{padding-left:calc(var(--container)/24);}

.textbox:after{ content:''; display:block; clear:both; font-size: 1px; line-height: 0px; margin:0; padding:0;}
.textbox iframe {max-width:100%;}

.text-image-wrap img, .text-image-wrap figure{border-radius:var(--radius-normal); overflow: hidden; display:inline-block; margin:0.35rem 0; max-width:100%; z-index:2;}
.text-image-wrap.align-left{float:left; width:33.33%; margin-right:2rem; margin-bottom:1rem;}
.text-image-wrap.align-right{float:right; width:33.33%; margin-left:2rem; margin-bottom:1rem;}
.text-image-wrap.align-left img, .text-image-wrap.align-right img{width:100%;}
.text-image-wrap.align-center{text-align:center;}
.text-image-wrap.align-center img{width:auto; max-width: 100%}
.text-image-wrap.align-stretch img{width:100%;}
.text-image-wrap figure img{margin:0; width:100%;}
.text-image-wrap figcaption{font-size: var(--text-small); z-index:2; position:absolute; left:0; bottom:0; padding:0.5rem 1rem; background-color:var(--color-base65); color:var(--color-white);}
.text-image-wrap.align-left figure, .text-image-wrap.align-right figure, .text-image-wrap.align-stretch figure{width:100%;}
.text-image-wrap.align-left.width-50, .text-image-wrap.align-right.width-50{width:46.5%;}

#scrollup { position:fixed; display:block; color:white!important; opacity:0; box-shadow:0 1rem 3rem rgba(0,0,0,0.5); background-color:rgba(var(--color-black-rgb),0.5); border-radius:var(--radius-normal); display: flex; align-items: center; justify-content: center; width:2.5rem; height:2.5rem; bottom:-3.5rem; left:calc(100vw - 3.7rem); z-index: 1000;  transition:opacity var(--time-slow) ease, bottom var(--time-slow) ease, color var(--time-fast) ease, background-color var(--time-fast) ease; text-decoration:none; }
#scrollup:after{ content:'\f30c'; font:var(--font-icon);}
#scrollup:hover{ background-color:var(--color-hover);}
#scrollup.affix{ opacity:1; bottom:3.5rem;}

* {scrollbar-width: thin; scrollbar-color: var(--color-grey) var(--color-light-grey);}
*::-webkit-scrollbar {height: var(--scroll-width); width: var(--scroll-width);}
*::-webkit-scrollbar-track {background: var(--color-light-grey);}
*::-webkit-scrollbar-thumb {background: var(--color-grey); border-radius: 0; border: 0;}
*::-webkit-scrollbar-thumb:hover {background: var(--color-grey);}
:root { scroll-behavior: auto; }

@media (max-width: 991.98px) {
	.container{max-width: var(--container);}
	
	[class*='col-'].indent-right{padding-right:calc(var(--bs-gutter-x) * .5);}
	[class*='col-'].indent-left{padding-left:calc(var(--bs-gutter-x) * .5);}
}
@media (max-width: 767.98px) {
	.text-image-wrap.align-left, .text-image-wrap.align-right, .text-image-wrap.align-left.width-50, .text-image-wrap.align-right.width-50{float:none; width:auto; max-width:100%; margin-right:0; margin-left:0; margin-bottom:var(--margin-normal);}
	.text-image-wrap.align-left img, .text-image-wrap.align-right img, .text-image-wrap.align-left figure, .text-image-wrap.align-right figure{width:auto;}
}


/* ************************* */
/* 3. COLORS & BACKGROUNDS	 */
/* ************************* */
.color-white{color:var(--color-white)!important;}
.color-black{color:var(--color-black)!important;}
.color-base{color:var(--color-base)!important;}
.color-grey{color:var(--color-grey)!important;}
.color-dark-grey{color:var(--color-dark-grey)!important;}
.color-orange{color:var(--color-orange)!important;}
.color-dark-yellow{color:var(--color-dark-yellow)!important;}
.color-yellow{color:var(--color-yellow)!important;}
.color-dark-blue{color:var(--color-dark-blue)!important;}
.color-mist{color:var(--color-mist)!important;}
.color-blue{color:var(--color-blue)!important;}
.color-indigo{color:var(--color-indigo)!important;}
.color-light-blue{color:var(--color-light-blue)!important;}
.color-midnight{color:var(--color-midnight)!important;}

.bg-color-grey{ background-color:var(--color-grey);}
.bg-color-light-grey{ background-color:var(--color-light-grey);}
.bg-color-dark-grey{ background-color:var(--color-dark-grey);}
.bg-color-black{ background-color:var(--color-black);}
.bg-color-blue{ background-color:var(--color-blue);}
.bg-color-white{background-color:var(--color-white);}
.bg-color-yellow{background-color:var(--color-yellow);}
.bg-color-orange{background-color:var(--color-orange);}

[class*='overlay-color-']:after{ content:''; display:block; position:absolute; inset:0}
.overlay-color-dark60:after{ background-color:var(--color-midnight); opacity:0.6;}
.overlay-color-dark80:after{ background-color:var(--color-midnight); opacity:0.8;}



/* ************************* */
/* 4. TYPOGRAPHY			 */
/* ************************* */
html{font-size: 16px;}
body{font: var(--font-base);}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6{font:var(--font-heading); color:var(--color-heading);}
h1, .h1{font-size:var(--h1);}
h2, .h2{font-size:var(--h2);}
h3, .h3{font-size:var(--h3);}
h4, .h4{font-size:var(--h4);}
h5, .h5{font-size:var(--h5);}
h6, .h6{font-size:var(--h6);}

.x-lead{font-size: var(--text-x-lead); font-weight: 500; line-height: 1.6;}
.lead, .big{ font-size:var(--text-lead); font-weight: 500; line-height: 1.6;}
.small{ font-size:var(--text-small);}
.in-form-header{margin-bottom:var(--margin-small);}
.weight-extralight{font-weight: 200;}
.weight-regular{font-weight: 400;}
.weight-medium{font-weight: 500;}
.weight-semibold{font-weight: 600;}
.weight-bold{font-weight: 700;}
.weight-black{font-weight: 900;}

.textbox{line-height: var(--lh-p);}
.textbox ul{list-style-type:none; padding-left:1.5rem; overflow:hidden;}
.textbox ul li{padding-left:1rem; background:url(../../img/list-marker.svg) no-repeat 0 0.6rem;}
.textbox ul li ul{margin-top:var(--margin-small); padding-left:0.5rem;}

.textbox ol{counter-reset: listCounter; padding-left:2.5rem; overflow:hidden;}
.textbox ol li{ list-style:none;}
.textbox ol li:before{counter-increment: listCounter; content:counter(listCounter)'. '; color:var(--color-mist); display:inline-block; margin-left:-1.3rem; margin-right:0.3rem; min-width:1rem; text-align:center;}
.textbox ol li ol{padding-left:2.3rem; margin-top:var(--margin-small); counter-reset: subCounter;}
.textbox ol li ol li:before{counter-increment: subCounter; content:counter(listCounter)'.'counter(subCounter)'. ';  margin-left:-2.1rem; margin-right:0.3rem; min-width:1.7rem;}

.textbox ul, .textbox ol{display: flex; flex-direction: column; gap:var(--margin-small);}

.textbox blockquote{padding:0; font-size: var(--text-x-lead); font-style: normal; font-weight: 200;}
.textbox blockquote p:first-child:before{content: '"';}
.textbox blockquote p:last-child:after{content: '"';}
/* aside .textbox blockquote{font-size: var(--text-lead);} */

.textbox .btn{margin-top:0.35rem; margin-bottom:0.35rem;}

@media (max-width: 991.98px) {
	html{font-size: 14px;}
}

@media (max-width: 767.98px) {
	.textbox ol{padding-left: 2.5rem;}
	.textbox ul{padding-left: 1.5rem;}
}



/* ************************* */
/* 5. MARGINS				 */
/* ************************* */
h1, h2, h3, h4, h5, h6, ul, ol, p, .alert, address, dl, blockquote, figure{margin:0;}
h1, h2, h3, h4, h5, h6, .h2, .h3, .h4, .h5, .h6, .textbox p, .textbox ul, .textbox ol, .text-image-wrap
	{margin-bottom:var(--margin-normal); margin-top:0;}
.textbox, .form-wrap, .accordion, .side-nav, .tabs-wrap, .side-nav-wrap, .side-col-banner 
	{margin-bottom:var(--margin-big);}
.textbox:last-child, .form-wrap:last-child, .accordion:last-child, .side-nav:last-child, .textbox ul:last-child, .textbox ol:last-child, .textbox p:last-child, .textbox .text-image-wrap:last-child,
	h1:last-child, h2:last-child, h3:last-child, h4:last-child, h5:last-child, h6:last-child, 
	.h1:last-child, .h2:last-child, .h3:last-child, .h4:last-child, .h5:last-child, .h6:last-child,
	[class*='mb']:last-child, .tabs-wrap:last-child, .textbox blockquote:last-child, .form-group:last-child, .side-col-banner:last-child
	{margin-bottom:0;}

.mb-half, .textbox .mb-half{margin-bottom:var(--margin-small);}
.mb{margin-bottom:var(--margin-normal);}
.mb-big, .textbox .mb-big{margin-bottom:var(--margin-big);}

@media (max-width: 1399.98px) {
	.mb-big-xl{margin-bottom:var(--margin-big);}
	.mb-xl{margin-bottom:var(--margin-normal);}
	.mb-half-xl{margin-bottom:var(--margin-small);}
}
@media (max-width: 1199.98px) {
	.mb-big-lg{margin-bottom:var(--margin-big);}
	.mb-lg{margin-bottom:var(--margin-normal);}
	.mb-half-lg{margin-bottom:var(--margin-small);}
}
@media (max-width: 991.98px) {
	.mb-big-md{margin-bottom:var(--margin-big);}
	.mb-md{margin-bottom:var(--margin-normal);}
	.mb-half-md{margin-bottom:var(--margin-small);}
}
@media (max-width: 767.98px) {
	.mb-big-sm{margin-bottom:var(--margin-big);}
	.mb-sm{margin-bottom:var(--margin-normal);}
	.mb-half-sm{margin-bottom:var(--margin-small);}
}



/* ************************* */
/* 6. BUTTONS				 */
/* ************************* */
.btn { border-radius:var(--radius-normal); border:2px solid transparent; display: inline-flex; align-items: center; justify-content: center; gap:0.25rem; height:3.3125rem; padding:0.5rem 1.25rem; font-size: var(--text-button); font-weight: 700; line-height:var(--lh-base); transition:color var(--time-fast) ease, border-color var(--time-fast) ease, background var(--time-fast) ease; }
.btn:focus, .btn:active:focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn.active.focus,
button:focus, button:active:focus, button.active:focus, button.focus, button:active.focus, button.active.focus{outline:0!important;}
.btn:focus-visible{box-shadow:none;}

.btn-primary{text-shadow:0 0 1.25rem rgba(0,0,0,0.4) ; color:var(--color-white); border-color:var(--color-dark-yellow); background:var(--color-dark-yellow);}
.btn-primary:hover, .btn-primary:focus, .focus.btn-primary, .btn-primary:active, .active.btn-primary, .btn-primary:active:focus, .btn-primary:active:hover, .btn-primary.active:hover, .btn-primary.active:focus, .btn-primary:active.focus, .btn-primary.active.focus, .open > .btn-primary.dropdown-toggle{
	color:var(--color-dark-yellow); border-color:var(--color-dark-yellow); background:transparent; text-shadow: none;}

.theme-dark :is(.btn-primary:hover, .btn-primary:focus, .focus.btn-primary, .btn-primary:active, .active.btn-primary, .btn-primary:active:focus, .btn-primary:active:hover, .btn-primary.active:hover, .btn-primary.active:focus, .btn-primary:active.focus, .btn-primary.active.focus, .open > .btn-primary.dropdown-toggle)	{
	color:var(--color-white);}

.btn-default{ color:var(--color-dark-blue); border-color:var(--color-dark-blue); background:transparent;}
.btn-default:hover, .btn-default:focus, .focus.btn-default, .btn-default:active, .active.btn-default, .btn-default:active:focus, .btn-default:active:hover, .btn-default.active:hover, .btn-default.active:focus, .btn-default:active.focus, .btn-default.active.focus, .open > .btn-default.dropdown-toggle{
	color:var(--color-dark-yellow); border-color:var(--color-dark-yellow); background:transparent;}

.btn-white{ color:var(--color-black); border-color:var(--color-white); background: var(--color-white);}
.btn-white:hover, .btn-white:focus, .focus.btn-white, .btn-white:active, .active.btn-white, .btn-white:active:focus, .btn-white:active:hover, .btn-white.active:hover, .btn-white.active:focus, .btn-white:active.focus, .btn-white.active.focus, .open > .btn-white.dropdown-toggle{
	color:var(--color-white); border-color:var(--color-white); background:transparent;}

.btn-stroke{ color:var(--color-white); border-color:var(--color-dark-yellow); background:transparent;}
.btn-stroke:hover, .btn-stroke:focus, .focus.btn-stroke, .btn-stroke:active, .active.btn-stroke, .btn-stroke:active:focus, .btn-stroke:active:hover, .btn-stroke.active:hover, .btn-stroke.active:focus, .btn-stroke:active.focus, .btn-stroke.active.focus, .open > .btn-stroke.dropdown-toggle{
	color:var(--color-white); border-color:var(--color-dark-yellow); background:var(--color-dark-yellow); text-shadow:none;}	

.btn-action{height:2.5625rem; font-size: 0.8125rem; font-weight: 700; text-transform: uppercase; padding:0.5rem 1rem; text-shadow:0 0 1.25rem rgba(0,0,0,0.4) ; color:var(--color-white); border-color:var(--color-dark-yellow); background:var(--color-dark-yellow);}
.btn-action:hover, .btn-action:focus, .focus.btn-action, .btn-action:active, .active.btn-action, .btn-action:active:focus, .btn-action:active:hover, .btn-action.active:hover, .btn-action.active:focus, .btn-action:active.focus, .btn-action.active.focus, .open > .btn-action.dropdown-toggle{
	color:var(--color-hover); border-color:var(--color-hover); background:transparent; text-shadow: none; }	
.theme-dark :is(.btn-action:hover, .btn-action:focus, .focus.btn-action, .btn-action:active, .active.btn-action, .btn-action:active:focus, .btn-action:active:hover, .btn-action.active:hover, .btn-action.active:focus, .btn-action:active.focus, .btn-action.active.focus, .open > .btn-action.dropdown-toggle)	{
	color:var(--color-white);}

.btn-sm{height:2.8125rem; padding:0.25rem 1.25rem;}	

.btn-link{padding:0; height:auto; text-decoration: none; color:var(--color-dark-yellow); gap:0.5rem;}
.btn-link:before{content: ''; position: absolute; left:0; width:0; height:0.125rem; bottom:-1px; background-color:var(--color-dark-yellow); transition:width var(--time-fast) ease;}
.btn-link:hover, .btn-link:focus, .btn-link:focus-visible{color:var(--color-dark-blue); text-decoration: none; box-shadow: none;}
.btn-link:hover:before, .btn-link:focus:before, .btn-link:focus-visible:before{width:100%;}
.theme-dark .btn-link{--color-dark-yellow:var(--color-yellow); --color-dark-blue:var(--color-white);}

.btn [class*='fa']{font-size: 0.81rem;}



/* ************************* */
/* 7. LINKS					 */
/* ************************* */
a {color:var(--color-link); transition:color var(--time-fast) ease, background var(--time-fast) ease, border var(--time-fast) ease, border-radius var(--time-fast) ease;}
a:hover, A:focus{color:var(--color-hover);}
a:focus, a:active, a:active:focus{outline:none;}


a img{border:0;}

.area-link{ position:absolute; top:0; left:0; width:100%; height:100%; z-index: 2;}
.anchor-link{display:block; top:-3rem; width:100%; height:0;}
.scroll-spy-anchor{position: absolute; top:-2rem; width:100%; bottom:0; z-index: -10; pointer-events: none;}

.sp-link{color:var(--color-dark-yellow); font-size:var(--text-button); display: inline-flex; align-items: center; gap:0.5rem; white-space: nowrap; text-decoration: none; font-weight: 700; line-height:var(--lh-base);}
.sp-link:before{content: ''; position: absolute; left:0; width:0; height:0.125rem; bottom:-1px; background-color:var(--color-dark-yellow); transition:width var(--time-fast) ease;}
.sp-link:after{content: '\f061'; font:var(--font-icon);}
.sp-link:hover, .sp-link:focus{color:var(--color-dark-blue);}
.sp-link:hover:before, .sp-link:focus:before, .sp-link:focus-visible:before{width:100%;}
.theme-dark .sp-link{--color-dark-yellow:var(--color-yellow); --color-dark-blue:var(--color-white);}

h1 a:not(:hover):not(:focus), h2 a:not(:hover):not(:focus), h3 a:not(:hover):not(:focus), h4 a:not(:hover):not(:focus), h5 a:not(:hover):not(:focus), h6 a:not(:hover):not(:focus){ color:inherit;}

@media (max-width: 991.98px) {
	.anchor-link{top:0;}
	.scroll-spy-anchor{top:0;}
}



/* ************************* */
/* 8. ALERTS				 */
/* ************************* */
.alert{display: flex; padding:1.25rem 1.5rem; flex-direction: column; gap:1rem; border-radius: var(--radius-normal); word-wrap: break-word;}



/* ************************* */
/* 8. THEME-DARK			 */
/* ************************* */
.theme-dark{
	--color-link:var(--color-light-blue); 
	--color-base:var(--color-white);
	--color-heading:var(--color-base);
	--color-base-rgb:var(--color-white-rgb);
	color:var(--color-base);
}
