/* -------------------------------------------------- */
/* Reset - http://purecss.io/base
/* -------------------------------------------------- */
a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{margin:0;padding:0;border:0;font:inherit;vertical-align:baseline;}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section, main{display:block;}body{line-height:1;}ol,ul{list-style:none;}blockquote,q{quotes:none;}blockquote:after,blockquote:before,q:after,q:before{content:'';content:none;}table{border-collapse:collapse;border-spacing:0;}.hide{display:none;}html{box-sizing: border-box;}*,*:before,*:after{box-sizing:inherit;}.clear{font-size:0px;clear: both;height: 0px;}*:focus{outline: none;}strong{font-weight:bold;}em{font-style:italic;}input:invalid{box-shadow: none;}button{border:none;background:none;padding:0;margin: 0;}button::-moz-focus-inner{border:0;}input,button{border-radius:0;border-radius:none;}html{scroll-behavior: smooth;}

/* -------------------------------------------------- */
/* Common
/* -------------------------------------------------- */
body{
	background: #ffffff;
	font-family: 'Figtree', sans-serif;
	font-size: 16px;
	color: #000000;
}
h1, h2, h3, h4{
	line-height: 1.2em;
	padding: 12px 0;
}
a, a:visited{
	color: #000000;
}
a:hover, a:active{
	color: #000000;
}
strong{
	font-weight: 700;
}
sup{
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
  top: -0.5em;
}
p{
	line-height: 1.6em;
	padding: 12px 0;
}
.container{
	width: 100%;
	max-width: 1366px;
	margin: 0 auto;
	padding: 0 24px;
}

/* -------------------------------------------------- */
/* Hero
/* -------------------------------------------------- */
.hero{
	background-image: linear-gradient(to right, #0e1d40, #132858, #0e1d40);
	line-height: 0;
}
.hero-wrap{
	background: url('/assets/images/fill.svg') repeat-x left top;
	background-size: 48px 48px;
	padding: 12px 0 0 0;

}
.hero .container{
	display: flex;
	flex-wrap: wrap;
	align-items: center
}
.hero-txt{
	width: 50%;
	font-size: 18px;
	padding:  48px 0;
	color: #fff;
}
.hero-txt h1{
	font-size: 69px;
	font-weight: 900;
}
.hero-img{
	width: 50%;
	text-align: center;
}
.hero-img img{
	width: 100%;
	max-width: 600px;
	height: auto;
}

/* -------------------------------------------------- */
/* Summary
/* -------------------------------------------------- */
.summary{
	padding: 96px 0;
}
.card{
	display: flex;
	align-items: center;
	flex-wrap: wrap;
}
.card-txt{
	width: 50%;
	padding-left: 48px;
}
.card-txt h2{
	font-size: 27px;
	line-height: 1.4em;

}
.card-img{
	width: 50%;
}
.card-img img{
	width: 100%;
	height: auto;
}

/* -------------------------------------------------- */
/* CTA
/* -------------------------------------------------- */
.cta{
	padding: 0 0 96px 0;
	text-align: center;

}
.cta-txt{
	display: inline-block;
	font-size: 21px;
	font-weight: 900;
	padding: 12px 24px;
	background: #bf103e;
	color: #fff;
}
.cta .cta-txt{
	font-size: 36px;
	padding: 24px 48px;
	line-height: 1.2em;
}

/* -------------------------------------------------- */
/* Footer
/* -------------------------------------------------- */
footer{
	background: #efefef;
	padding: 24px 0 12px 0;
	font-size: 14px;
	text-align: center;
}

/* -------------------------------------------------- */
/* Breakpoints
/* -------------------------------------------------- */
@media screen and (max-width: 1200px) {
	.hero-txt h1{ font-size: 54px; }
}
@media screen and (max-width: 900px) {
	.hero-wrap{ 
		padding: 0;
		background: none; 
	}
	.hero-txt h1{ font-size: 48px; }
	.hero-txt, .hero-img,
	.card-txt, .card-img{
		width: 100%;
		text-align: center;
	}
	.card-txt{ 
		padding: 24px 0 0 0;
	}
	.hero-img img{ max-width: 480px; }
	.summary{
		padding: 48px 0;
	}
	.cta .cta-txt{ font-size: 21px; }
}
