body {line-height: 1.3; color: #002C3D; font-family: 'TradeGothic LT', sans-serif;}
h1 {line-height: 5vw; font-size: 5vw; color: #fff; font-family: "articulat-cf", sans-serif;font-weight: 700;font-style: normal;}
h2 {line-height: 1.3; font-size: 70px; color: #0295DA; font-family: "articulat-cf", sans-serif; font-weight: 500;}
h3 {line-height: 1.3; font-size: 70px; color: #fff; font-family: "articulat-cf", sans-serif; font-weight: 500;}
h4 {line-height: 2vw; font-size: 1.5vw; color: #025D88; font-family: "congenial", sans-serif; font-weight: bold;}
h5 {line-height: 1.3; font-size: 1.5vw; color: #025D88; font-family: "congenial", sans-serif; font-weight: 200;}
h6 {line-height: 1.3; font-size: 24px; color: #025D88; font-family: "congenial", sans-serif; font-weight: 200;}
p {line-height: 1.6; font-size: 20px; color: #025D88; margin-bottom: 20px;}
p:last-child {margin-bottom: 0;}
ul {margin-left: 20px;}
li {list-style: none; font-weight: 400; font-style: normal;}
a {text-decoration: none; color: #002C3D; font-weight: 400; font-style: 500;}
img {width: 100%; height: 100%; object-fit: cover;}

/* GENERAL */

.no-scroll {height: 100vh; overflow-y: hidden;}

.wrapper {max-width: 1750px; margin: 0 auto; width: 100%;}
.wrapper-sml {max-width: 1500px; margin: 0 auto; width: 100%;}

.button {padding: 20px 25px; background: #0395DA; color: #fff; border-radius: 10px; display: inline-block; outline: none; border:0; font-family: inherit; cursor: pointer; transition: 0.5s; line-height: 1;}
.button:hover {background: #025D88}

.grid-right {display: grid; grid-template-columns: 300px 1fr; grid-gap: 150px;}

/* HEADER */

header {position: sticky; top: 0px; background: #fff7; z-index: 999; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);}

.left,.right {display: flex; flex: 1;}
.right {justify-content: flex-end;}
.left .logo img {width: 215px;}
.menu {margin: auto;}
.menu ul {display: flex; margin: 0;}
.menu ul li a {padding: 30px; color: #025D88; font-size: 18px; display: inline-block;}

.hamburger {width: 50px; height: 30px; position: absolute; cursor: pointer; right: 20px; top: 20px; transition: 0.3s; z-index: 99999; display: none;}
.hamburger span {height: 4px; background: #0395da; width: 100%; position: absolute; opacity: 1; transition: 0.3s; border-radius: 10px;}
.hamburger span:nth-child(1) {top: 0;}
.hamburger span:nth-child(2) {top: 13px;}
.hamburger span:nth-child(3) {bottom: 0;}

.hamburger.active {position: fixed;}

.hamburger.active span:nth-child(2) {opacity: 0; transform: rotate(90deg); top: 15px;}
.hamburger.active span:nth-child(1) {top: 0; transform: rotate(135deg); top: 15px;}
.hamburger.active span:nth-child(3) {bottom: 0; transform: rotate(225deg); top: 15px;}

.mobile-nav { box-sizing: border-box; position: fixed; display: block;background: #181818;top: 0; z-index: 99; transition: 0.5s; height: 100vh; width: 100%; left: -110%; border-radius: 50%; padding: 40px; min-height: 100vh;
min-height: -webkit-fill-available;}
.mobile-nav > a {position: relative; color: #1d1f1e; display: inline-block;z-index: 9999; font-size: 60px;font-weight: 600; transition: 0.3s;}
.mobile-nav > a:hover {color: #18463e;}
.mobile-nav > a >img {padding: 0;width: 250px;margin: -25px 0 25px;}

.mobile-nav::after { box-sizing: border-box; content: ""; position: absolute; display: block; background: #f2f2f2;top: 0; z-index: 99; transition: 0.5s; height: 100vh; width: 100%; left: -120%; border-radius: 50%;}
.mobile-nav.active {left: 0; border-radius: 0; bottom: 0px;}
.mobile-nav.active::after {left: 0; border-radius: 0;}

.mobile-nav ul {position: relative; z-index: 999; list-style: none; margin: 0;}
.mobile-nav ul li {width: 100%;}
.mobile-nav ul li a {color: #1d1f1e;text-decoration: none;font-size: 30px;line-height: 1.3;transition: 0.3s ease;display: inline-block;padding: 10px;border:none; outline: none; box-sizing: border-box;}
.mobile-nav ul li a:hover {font-weight: 600;}

/* BODY */

.home-banner {position: relative; border-radius: 0 0 150px 0; overflow: hidden;}
.home-banner .wrapper {position: absolute; left: 50%; transform: translate(-50%); bottom: 80px; align-items: flex-start;}
.home-banner .wrapper article {max-width: 400px; padding-right: 150px;}
.home-banner .wrapper article p {color: #fff;}
.home-banner .wrapper article .button {margin-top: 30px;}

.content {padding: 100px 0;}
.content figure {width: 50%; border-radius: 20px; overflow: hidden;}
.content article {width: 50%; box-sizing: border-box; margin: auto;}
.content article h2 {margin-bottom: 20px;}
.content article p {}
.content article .button {margin-top: 40px;}

.feature {position: relative; background: #0395DA; border-radius: 150px 0 150px 0; overflow: hidden; z-index: 1;}
.feature .wrapper-sml {padding: 150px 0; position: relative;}
.feature h3 {margin-bottom: 50px;}
.feature .grid {display: grid; grid-template-columns: repeat(auto-fit,minmax(300px,1fr)); grid-gap: 20px;}
.feature .grid .tile {border-radius: 20px; box-sizing: border-box; padding: 37px 30px 37px; background: #E3FAED;}

@-moz-document url-prefix() {
.feature .grid .tile {padding: 44px 30px 37px;}
}

.feature .grid .tile p {line-height: 1; font-family: "articulat-cf", sans-serif; font-weight: 200; color: #00283B; font-size: 24px;}
.feature .grid .tile:nth-child(3n+2) {background: #FBF4EE;}
.feature .grid .tile:nth-child(3n+3) {background: #F0F1FD;}
.feature article {position: absolute; bottom: 80px; right: 0px;}
.feature article p {line-height: 25px; font-family: "articulat-cf", sans-serif; font-weight: 200; font-size: 40px;}
.feature article p:nth-child(2) {color: #fff;}
.feature::after {content:''; display: block; background: url('/img/background.svg'); background-size: cover; background-repeat: no-repeat; width: 850px; height: 900px; position: absolute; bottom: 0px; right: 50px; opacity: 0.5; z-index: -1;}

.contact {position: relative; background: #CBE9F8; border-radius: 150px 0 150px 0;}
.contact .wrapper-sml {padding: 100px 0; position: relative;}
.contact h3 {color: #015D88; line-height: 70px;}
.contact h3 span {color: #0295DA;}
.contact .form-wrapper {background: #fff; border-radius: 20px; padding: 100px;  box-sizing: border-box;}
.contact .form-wrapper .grid {display: grid; grid-template-columns: repeat(auto-fit,minmax(300px,1fr)); grid-gap: 10px 80px; margin-bottom: 30px;}
.contact .button {margin-top: 30px;}

.social {margin: 50px 0;}
.social a {display: flex; align-items: center; font-size: 20px; margin-bottom: 15px;}
.social img {width: 50px; height: 50px; margin-right: 20px;}

.find-us {padding: 100px 0;}
.find-us a {display: flex; color: #025D88; align-items: center;}
.find-us a img {width: 32px; height: 32px; margin-right: 10px;}
.find-us h3 {color: #015D88;}
.find-us h3 span {color: #0295DA;}
.find-us .map-wrapper {border-radius: 20px; overflow: hidden; margin-top: 50px;}

footer {background: #0295DA; border-radius: 150px 150px 0 0;}
footer .logo img {width: 198px; height: 118px; margin: 0 auto;}
footer > .wrapper-sml {padding: 70px 0 20px;}
footer .footer-bottom {border-top: 1px solid #fff3; margin-top: 50px; padding-top: 10px;}
footer .footer-bottom p {color: #fff3; font-size: 17px;}