@import url('https://fonts.googleapis.com/css?family=Heebo:300,400,500,600,700');

/* :root {
  --section-border: 2px dashed red;
  --layout-border: 1px dashed orange;
  --tile-border: 1px dashed blue;
  --content-border: 1px dashed grey;
} */


a, font, input, td, div, textarea, button, section {font-family: 'Heebo', sans-serif; font-size: 15px; line-height: 24px; font-weight: 400; text-decoration: none;}
a {  color: #00579b; }
body, html{margin: 0px; font-size: 62.5%; scroll-behavior: smooth;}
body { box-sizing: border-box; overflow-x: hidden;}
form{margin-top: 0px; margin-bottom: 0px;}
table, table td{padding: 0px; border-spacing: 0px; border-collapse: collapse;}
table{ width: 100% }
div{box-sizing: border-box}
img{ border: 0}
ul{ margin: 0; list-style: none; padding: 0}
button { padding: 0; background: transparent; border: none; cursor: pointer; }
hr { width: 100%;border: none;border-top: 1px solid #d5d5d5; }

::-webkit-scrollbar {width: 10px; height: 10px}
::-webkit-scrollbar-thumb {background: #888;}
::-webkit-scrollbar-thumb:hover {background: #747474;}
::-webkit-scrollbar-track {background: #dcdcdc;}

/* animation */
@keyframes fadein {from { opacity: 0}to { opacity: 1}}


@media(max-width: 800px) {
	.company-logos-showcase img{ zoom: 0.6}
}

/* icons */
.material-symbols-outlined {font-variation-settings:'FILL' 0,'wght' 200,'GRAD' 200,'opsz' 24; display: block !important;}
.material-symbols-outlined.-filled {font-variation-settings:'FILL' 1}

/* header */
header { max-width: 1800px; margin: auto; padding: 20px; }
header .content-wrapper{ display: grid; grid-template-columns: min-content auto min-content; align-items: center; }
header .content-wrapper .nav{ display: flex; align-self: center; justify-content: center; gap: 40px }
header .content-wrapper .nav a{ font-weight: 500;color: #000; cursor: pointer; }
header .content-wrapper .buttons-wrapper{ display: flex; align-self: center; justify-content: center; gap: 5px }
header .content-wrapper .buttons-wrapper a{ font-size: 3rem; color: #000}
header .content-wrapper .menu-button{ font-size: 3rem; display: none !important;}

header .solution-menu-wrapper:hover .solutions-menu { display: flex; }
header .solutions-menu { width: 100%; height: calc(100% - 48px); overflow: auto; position: absolute; top: 48px; left: 0; background:linear-gradient(360deg, #ffffffc4, #ffffff57); backdrop-filter: blur(60px);box-shadow: 1px 2px 3px #00000026; z-index: 1; display: none; justify-content: center; align-items: center; opacity: 0; animation: fadein ease-in forwards 200ms; animation-delay: 50ms }
header .solutions-menu section{ padding: 40px }
header .solutions-menu .tile{ opacity: 0 }
header .solutions-menu .content .text{ text-wrap-style: auto; }

@media(max-width: 2000px) {
header { max-width: 1400px; margin: auto; padding: 20px; }
}

@media(max-width: 700px) {
	header .content-wrapper{ display: grid; grid-template-columns: min-content auto min-content; align-items: center; }
	header .content-wrapper .menu-button{ display: block !important;}
	header .content-wrapper .nav{ display: none }
	header .content-wrapper .logo{ margin: auto }
}

footer {  background: #2b2b2b;padding: 60px 30px; }
.footer_content { max-width: 1800px;margin: auto; display: grid; grid-template-columns: 1fr 3fr; gap: 40px }
.footer_content ._logo{ font-size: 4rem;font-weight: 500;letter-spacing: -2px;color: #eaeaea }

.footer_content .footer_links{ display: flex; justify-content: space-evenly; gap: 60px}
.footer_content .footer_links ._item { display: flex; flex-direction: column; gap: 5px}
.footer_content .footer_links ._item .heading{ color: #fff; font-size: 1.8rem; font-weight: 700; margin-bottom: 3px}
.footer_content .footer_links ._item a{ color: #fff; font-size: 1.4rem }

.footer_content .footer_info { font-size: 1.2rem;font-weight: 300;text-align: right;color: #a0a0a0;line-height: 159%; border-top: 1px solid #5a5a5a; padding-top: 20px; grid-column: 1/-1 }

@media(max-width: 800px) {
	.footer_content { grid-template-columns: none; }
	.footer_content .footer_links { justify-content: flex-start; }
	.footer_content .footer_info { text-align: left; }
}
@media(max-width: 600px) {
	.footer_content .footer_links { flex-direction: column; gap: 40px }
}

.help-center .list a { color: #000; line-height: 140%; font-size: 1.4rem; }
.help-center .list.-lined li { border-bottom: 0; border-top: 1px solid #d3d3d3; }
.help-center .tile.-padding-m { padding-inline: min(8%, 60px); padding-block: min(15%, 80px); }
.help-center .layout { grid-template-columns: 200px auto; }
.help-center .text { font-weight: 400; }

.help-center .help_side-nav { display: flex; flex-direction: column; gap: 10px; }
.help-center .help_side-nav a { color: #000; font-weight: 500; }
.help-center .help_side-nav .sub { margin-left: 20px; font-weight: 300; }

.help-center .help_question-list { display: flex; flex-direction: column; }
.help-center .help_question-list a { padding-block: 10px; border-top: 1px solid #f1f1f1; }

.help-center .help_breadcrumb { display: flex; gap: 10px; align-items: center; color: grey; }
.help-center .help_breadcrumb a { font-size: 1.3rem; color: #000 }
.help-center .help_breadcrumb .material-symbols-outlined { font-size: 1.5rem; }

.help-center .help_ul-list { list-style: disc; margin-left: 40px; }
.help-center .help_ul-list.-numbered { list-style: auto; }

.help-center .form-group { display: grid; grid-template-columns: 250px auto; padding-block: 10px; gap: 5px }
.help-center .form-group label{ font-weight: 500 }
.help-center .form-group input[type="text"]{ max-width: 300px; padding: 4px 10px; font-size: 1.3rem;  border: 1px solid #818181;border-radius: 3px;}
.help-center .form-group .cta{ grid-column: 2; width: fit-content; cursor: pointer;}
.help-center .form-group textarea{ height: 200px; padding: 4px 10px; font-size: 1.3rem; width: 100%; border: 1px solid #818181;border-radius: 3px;}

@media(max-width: 800px) {
	.help-center .layout { grid-template-columns: auto;}
	.help-center .help_side-nav { display: none; }
	.help-center .help_breadcrumb { display: none; }
	.help-center .form-group { grid-template-columns: auto; }
	.help-center .form-group .cta{ width: auto; grid-column: 1/-1}
}

/* section */
section { padding: 80px 40px; border:var(--section-border); overflow: hidden; }

section.-bg-grey { background: linear-gradient(0deg, #f7f7f7, transparent); }
section.-bg-grey-fill { background: radial-gradient(#ffffff, #f5f5f7) }
section.-view-center { min-height: 75vh; display: flex; flex-direction: column; justify-content: center; align-items: center; }
section.-half-img-bg{ position: relative; overflow: hidden;}
section.-padding-none {padding:0}
section.-overflow-none { overflow: visible; }

@media(max-width: 700px) {
	section { padding: 40px 20px; }
}
@media(max-width: 800px) {
	section.-view-center { min-height: auto; }
	section ._half-img { width: 100%; position: inherit; margin-top:40px}
}

/* layout */
.layout { max-width: 1800px;margin: auto; border:var(--layout-border); gap: 20px; display: grid;}
.layout.-bg-grey { background: radial-gradient(#ffffff, #f5f5f7); border-radius: 10px }
.layout.-bg-white { box-shadow: 0 0 100px #a0a0a01a; border-radius: 10px}
.layout.-padding-m { padding-inline: min(8%, 60px); padding-block: min(10%, 60px);}
.layout.-padding-l { padding: max(40px, 5%);}
.layout.-padding-block-l { padding-block: 40px;}
.layout.-margin-block-l { margin-block: 40px;}
.layout.-align-center { align-items: center;;}
.layout.-align-start { align-items: start;}
.layout.-justify-center { justify-content: center; justify-items: center;}
.layout.-gap-l { gap: 40px;}
.layout.-col-2 { grid-template-columns: 1fr 1fr}
.layout.-col-3 { grid-template-columns: 1fr 1fr 1fr}
.layout.-col-4 { grid-template-columns: repeat(4, 1fr);}
.layout.-col-4-2 { grid-template-columns: 4fr 2fr}
.layout.-col-2-3 { grid-template-columns: 2fr 3fr}

.layout ._order-item{ order: 2}



@media(max-width: 800px) {

	.layout { gap: 50px}

	.layout.-col-2 { grid-template-columns: auto;}
	.layout.-col-3 { grid-template-columns: auto}
	.layout.-col-4 { grid-template-columns: repeat(2, 1fr);}
	.layout.-col-2-3 { grid-template-columns: auto}

	.layout.-reverse-order ._order-item{ order: 0}
}
@media(max-width: 600px) {
	.layout.-col-4-2 { grid-template-columns: auto}
	.layout.-col-4 { grid-template-columns: auto;}
	.layout.-padding-l { padding: 30px;}


}

@media(max-width: 2000px) {
.layout  { max-width: 1400px; margin: auto }
}

/* tile */
.tile { border:var(--tile-border); display: grid; overflow: hidden; gap: 40px }
.tile.-overflow-none { overflow: visible; }
.tile.-aspect-ratio-5-4 { aspect-ratio: 5/4}
.tile.-col-2 { grid-template-columns: 1fr 1fr}
.tile.-col-3 { grid-template-columns: 1fr 1fr 1fr}
.tile.-col-2-3 { grid-template-columns: 2fr 3fr}
.tile.-span-all { grid-column: 1/-1 }
.tile.-justify-center { justify-content: center; justify-items: center;}
.tile.-align-center { align-items: center;}
.tile.-align-start { align-items: start;}
.tile.-bg-grey { background: radial-gradient(#ffffff, #f5f5f7); border-radius: 10px; border: 1px solid #f5f5f7 }
.tile.-bg-white { box-shadow: 0 0 100px #a0a0a01a; border-radius: 10px}
.tile.-padding-m { padding-inline: min(8%, 60px); padding-block: min(10%, 60px);}
.tile.-padding-s { padding: 3% 2%}

.tile.-columns-2 { columns: 2; display: block; column-gap: 40px }
.tile.-columns-2 .content{ page-break-inside: avoid; margin-bottom: 40px }

.tile.-columns-3 { columns: 3; display: block; column-gap: 40px }
.tile.-columns-3 .content{ page-break-inside: avoid; margin-bottom: 40px }

.tile.-max-width-l { max-width: 1200px }
.tile.-max-width-m { max-width: 800px }
.tile.-max-width-s { max-width: 500px }


@media(max-width: 800px) {
	.tile.-max-width-s { max-width: 700px }

	.tile.-col-2 { grid-template-columns: auto;}
	.tile.-col-3 { grid-template-columns: auto;}
	.tile.-col-2-3 { grid-template-columns: auto;}

	.tile.-columns-2 { columns: 1 }
	.tile.-columns-3 { columns: 2 }
}
@media(max-width: 700px) {
	.tile.-columns-3 { columns: 1 }
}

/* content */
.content { display: grid; gap: 20px; border:var(--content-border) }
.content.-span-all { grid-column: 1/-1 }
.content.-max-width-l { max-width: 1200px }
.content.-max-width-m { max-width: 800px }
.content.-max-width-s { max-width: 500px }
.content.-flow { display: flex; flex-wrap: wrap; }
.content.-flex { display: flex; gap: 20px; align-items: center;}
.content.-justify-center { justify-items: center;}
.content.-align-center { align-items: center;}
.content.-gap-xl { gap: 60px; }
.content.-gap-l { gap: 30px; }
.content.-gap-m { gap: 15px; }
.content.-gap-s { gap: 5px; }
.content.-justify-space-around { justify-content: space-around;}
.content.-aspect-ratio-1-1 { aspect-ratio: 1/1}
.content.-bg-grey { background: radial-gradient(#ffffff, #f5f5f7); border-radius: 10px; border: 1px solid #f5f5f7 }
.content.-bg-white { box-shadow: 0 0 100px #a0a0a01a; border-radius: 10px}
.content.-padding-m { padding-inline: min(8%, 60px); padding-block: min(10%, 60px);}
.content.-padding-s { padding: 3% 2%}

.content ._item{ display: grid; gap: 10px }
.content._item-justify-center { justify-content: center; }
.content._item-justify-center ._item{ justify-items: center; }

@media(max-width: 800px) {
	.content.-max-width-s { max-width: 700px }
}


/* heading */
.heading {line-height: 110%; text-wrap-style: balance;}
.heading.-xxxlarge { font-size: clamp(8rem, 11vw, 12rem); letter-spacing: -1px  }
.heading.-xxlarge { font-size: clamp(5rem, 8vw, 9rem); letter-spacing: -1px  }
.heading.-xlarge { font-size: clamp(4rem, 7vw, 8rem); letter-spacing: -1px  }
.heading.-large { font-size: clamp(3rem, 4vw, 4.3rem); letter-spacing: -1px}
.heading.-medium { font-size: clamp(2.3rem, 2vw, 2.6rem);}
.heading.-small { font-size: clamp(1.6rem, 1.5vw, 2rem);}
.heading.-xsmall { font-size: 1.3rem}
.heading.-weight-700 { font-weight: 700 }
.heading.-weight-600 { font-weight: 600 }
.heading.-weight-500 { font-weight: 500 }
.heading.-align-center { text-align: center; }

.heading.-margin-bottom-s { margin-bottom: 5px }
.heading.-margin-bottom-xl { margin-bottom: 8% }
.heading.-margin-bottom-20 { margin-bottom: 20px }

.heading.-grad-blue-green { -webkit-background-clip: text; background-size: 100%; background-image: linear-gradient(155deg, #000000, #435b8e, #4b7f2f);-webkit-text-fill-color: transparent;)}
.heading.-grad-velvet { -webkit-background-clip: text;background-image: linear-gradient(155deg, #781437, #222d6d, #000000);-webkit-text-fill-color: transparent;}
.heading.-grad-green { -webkit-background-clip: text;background-image: linear-gradient(155deg, #006c62, #252f6a, #000000);;-webkit-text-fill-color: transparent;}
.heading.-grad-blue { -webkit-background-clip: text;background-image: linear-gradient(155deg, #435b8e, #000000, #000000);;-webkit-text-fill-color: transparent;}
.heading.-grad-green-pink-blue { -webkit-background-clip: text;background-image: linear-gradient(155deg, #009688, #435b8e, #E91E63);-webkit-text-fill-color: transparent;}

/* text */
.text { line-height: 150%; text-wrap-style: balance; font-weight: 300;}
.text.-xlarge {font-size: clamp(1.8rem, 2vw, 2.6rem); line-height: 130%;}
.text.-large {font-size: clamp(1.5rem, 1.5vw, 2rem);}
.text.-medium {font-size: clamp(1.5rem, 1.5vw, 1.6rem);}
.text.-align-center { text-align: center; }
.text.-weight-400 { font-weight: 400 }
.text.-weight-600 { font-weight: 600 }

/* list */
.list li{ display: flex; gap: 15px; align-items: center; }
.list li .text{ text-wrap-style: auto }
.list._li-direction-column li{ flex-direction: column; align-items: normal; }
.list._li-gap-m li{ gap: 20px }
.list._li-line-height-s li{ line-height: 120% }
.list.-gap-l { gap: 40px}
.list.-col-3{ display: grid; grid-template-columns: 1fr 1fr 1fr }
.list.-col-4{ display: grid; grid-template-columns: repeat(4, 1fr); }
.list.-col-2{ display: grid; grid-template-columns: 1fr 1fr }
.list.-padding-s li{ padding-block:3px }
.list.-padding-m li{ padding-block:7px }
.list.-padding-l li{ padding-block:12px }
.list.-font-size-m li{ font-size: clamp(1.5rem, 1.5vw, 1.6rem); }
.list.-justify-space-between li{ justify-content: space-between; }
.list.-lined li{ border-bottom: 1px solid #f1f1f1 }

.list.-bullets { list-style: disc;margin-inline: 30px; margin-block: 15px }
.list.-bullets li{ display: list-item;; padding-block: 0 }

@media(max-width: 800px) {
	.list.-col-3{ display: grid; grid-template-columns: 1fr 1fr }
	.list.-col-4{ display: grid; grid-template-columns: repeat(2, 1fr); }
}
@media(max-width: 600px) {
	.list.-col-2{ display: grid; grid-template-columns: none; }
}

/* icons */
.icon.-bg-gradient { background: red; padding: 12px; width: fit-content; border-radius: 15px;}
.icon.-bg-gradient .material-symbols-outlined{ font-size: 4rem; color: #fff;  }
.icon.-gradient-1 { background: linear-gradient(130deg, #23074d, #cc5333); }
.icon.-gradient-2 { background: linear-gradient(130deg, #283c86, #45a247); }
.icon.-gradient-3 { background: linear-gradient(130deg, #1a2980, #26d0ce); }
.icon.-gradient-4 { background: linear-gradient(320deg, #cc2b5e, #753a88); }
.icon.-gradient-5 { background: linear-gradient(320deg, #4b6cb7, #182848); }
.icon.-gradient-6 { background: linear-gradient(130deg, #e65c00, #f9d423); }
.icon.-gradient-7 { background: linear-gradient(320deg, #485563, #29323c); }
.icon.-gradient-8 { background: linear-gradient(320deg, #0b486b, #f56217); }
.icon.-medium .material-symbols-outlined{ font-size: 4rem }
.icon.-large .material-symbols-outlined{ font-size: 5rem }
.icon.-circle-border { border: 2px solid #000; padding: 10px; border-radius: 50px; width: fit-content}

/* cta */
.cta {background: #345394; border: 2px solid #345394;  font-size: 1.3rem;font-weight: 500;color: #fff;padding: 5px 40px;border-radius: 50px;width: fit-content; white-space: nowrap; user-select: none;}
.cta.-outline { background: transparent;  color: #345394; border-color: #345394}
.cta.-small {font-size: 1.3rem; padding: 2px 20px;}
.cta.-large {font-size: 1.6rem; padding: 7px 60px;}

/* video and imgs*/

video { width: 100% }
video.-radius, img.-radius { border-radius: 10px; object-fit: cover;}
video.-shadow-l, img.-shadow-l {box-shadow: 0 0 50px 0px #00000008, -6px 16px 14px 0px #00000040; }
video.-shadow-m, img.-shadow-m {box-shadow: 0px 6px 8px #00000026; }

video.-shadow-lift {box-shadow: 0 13px 27px -5px rgba(50,50,93,0.25),0 8px 16px -8px rgba(0,0,0,0.3) }
img.-shadow-lift {box-shadow: 0 13px 27px -5px rgba(50,50,93,0.25),0 8px 16px -8px rgba(0,0,0,0.3) }
