/* @import url('http://example.com/example_style.css'); */

/***********************************************/
/* CSS @imports must be at the top of the file */
/* Add them above this section                 */
/***********************************************/

/*****************************************/
/* Start your style declarations here    */
/*****************************************/


.kl-wide-section__text-content {
    width: 100% !important;
    margin: 0 auto;
}

#widget_1751311039197 .kl-wide-section__text {
    padding-right: 20px !important;
    padding-left: 20px !important;
}

.kl-wide-section__image{
  border-radius:20px !important;
}

.kl-footer__group h3{
  font-family:'Chivo Mono';
  font-size:16px;
  font-weight:500;
  color:#FFEE05;
}

.kl-footer__group a{
  font-family:'Plus Jakarta Sans', sans-serif;
  font-weight:500;
  font-size:16px;
}

.kl-rich-text__preheader{
  color:#3D77FF !important;
  font-size:20px !important;
  font-family:Chivo Mono, sans-serif !important;
  font-weight:600 !important;
}

#widget_1751311593629.kl-custom-image img, #widget_1751311593629.kl-custom-image .kl-custom-image__filter,#module_17513296058245.kl-custom-image img, #module_17513296125042.kl-custom-image img{
    margin-left: 32px;
}

.cell_17513115472713-background-layers, .cell_1751329605824-background-layers, .cell_1751329612503-background-layers{
  border-radius:12px;
}

.Navbar__button:hover, .button:hover{
  background-color:#FFE605 !important;
  color:black  !important;
}

.kl-navbar__button{
  font-weight:500;
}

.kl-navbar__end .button span{
  font-family:'Chivo Mono';
}

.kl-navbar__end .button--outlined{
      color: #ffffff;
    border: 1px solid #ffffff;
}

.dnd-section > .row-fluid {
    margin: 0 auto;
    max-width: 1640px !important;
}

.dnd_area-row-10-background-layers::before {
  content: "";
  position: absolute;
  top: 0; right: 0; bottom: 0; left: 0;
  background: url("https://5910251.fs1.hubspotusercontent-na1.net/hubfs/5910251/01ff0290a132a97759d4c5ca00a65bbc0621c9c8-min-1.png") center/cover no-repeat;
  opacity: 0.03; /* 3% opacity */
  pointer-events: none; /* let clicks pass through if needed */
  z-index: 0;
}

.dnd_area-row-10-background-layers {
  position: relative;
  background-color: #212529;
  overflow: hidden; /* hide any overflow of the pseudo‐element */
  
}


.cell_17513868789993-background-layers::before,
.cell_17565800690723-background-layers::before{
     content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: url("https://5910251.fs1.hubspotusercontent-na1.net/hubfs/5910251/01ff0290a132a97759d4c5ca00a65bbc0621c9c8-min-1.png") center / cover no-repeat;
    opacity: .2;
    pointer-events: none;
    z-index: 0;
    border-radius: 20px;
}

#hs_cos_wrapper_module_1751386906806,
#hs_cos_wrapper_module_17565800690726{
  z-index:1;
}

.cell_17513868789993-background-layers,
.cell_17565800690723-background-layers
{
  position: relative;
  background-color: linear-gradient(97.26deg, #EFE8AE -5.23%, #FFE605 105.23%);
  overflow: hidden; /* hide any overflow of the pseudo‐element */
  border-radius: 20px !important;
  border:8px solid #ffffff;
}

.kl-card .button--arrow span{
  color:white !important;
  font-family:'Chivo Mono', monospace !important;
  font-weight:500 !important;
  font-size:16px !important;
  text-decoration:underline !important;
}
.kl-card .button--arrow:after{
  display:none;
}

.row-number-46 .kl-card, .row-number-47 .kl-card{
  min-height:275px;
  border:none;
    display: flex;
  flex-direction: column;
  box-shadow:none;
  justify-content: space-between;
}

.row-number-46 .kl-card a.button, .row-number-47 .kl-card a.button {
  /* this will naturally sit at the bottom */
  align-self: flex-start; /* or stretch/center, as you prefer */
}


.kl-card .button--arrow:hover{
  background-color:rgba(38, 41, 45, 1.0) !important;
  border:none  !important;
}
#hs_cos_wrapper_widget_1751386924794_{
  position:relative;
  z-index:2;
}

.hs-image__grid__list__item__image{
  object-fit:contain !important;
}

/* CSS */
.full-width-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding: 1rem;           /* adjust as needed */
  box-sizing: border-box;  /* ensures padding doesn’t break 100% width */
}

.column.left {
  text-align: left;
}

.column.right {
  text-align: right;
}

.column.right a {
  margin-left: 1rem;       /* space between links */
  text-decoration: none;   /* style as you like */
  color: #F6F6F6;
  font-size:16px;
  font-weight:500;
}

.kl-footer__social span
 {

    margin: 8px 6px;
}

.kl-footer__group:first-of-type ul > li:nth-last-child(-n+3) a::after {
  content: "Coming Soon";
  display: inline-block;
  margin-left: 10px;
  color: #ffe605;
  background: #3D4043;
  border-radius: 4px;
  vertical-align: text-bottom;
  font-family: 'Plus Jakarta Sans';
  font-weight: 400;
  font-style: italic;
  font-size: 12px;
  line-height: 100%;

  padding-top: 4px;
  padding-right: 6px;
  padding-bottom: 4px;
  padding-left: 6px;
  border-radius: 4px;

  letter-spacing: 0%;

}




.kl-navbar__end .Navbar__button:last-child::after {
  content: "";
  display: inline-block;
  margin-left: 0.5em;
  vertical-align: middle;
  width: 1em;   /* adjust size */
  height: 1em;
  background: url('https://5910251.fs1.hubspotusercontent-na1.net/hubfs/5910251/blackarrow.png') 
              center center no-repeat;
  background-size: contain;
}



#hs-button_widget_1751384406947::after, #hs-button_module_17513846255456::after, #hs-button_module_17513846276467::after, #hs-button_module_1751386906806::after, #hs-button_module_17565800690727::after {
  content: "";
  display: inline-block;
  margin-left: 0.5em;
  vertical-align: middle;
  width: 1em;   /* adjust size */
  height: 1em;
  background: url('https://5910251.fs1.hubspotusercontent-na1.net/hubfs/5910251/buttonarrow.png') 
              center center no-repeat;
  background-size: contain;
}

#hs_cos_wrapper_widget_1751385282627 .kl-card-grid__card{
    backdrop-filter: blur(45px) !important;
   box-shadow: 0px 1px 64px 0px #00000033  !important;
  background-color: rgb(52 55 59);
  border:none !important;
}

#hs_cos_wrapper_widget_1751385282627 .kl-card-grid__card h4 span{
  font-family:'Chivo Mono';
  letter-spacing:0px;
}

.dnd_area-row-6-background-layers > * {
  position: relative;
  z-index: 1;
}

/* FAQ */
.kl-faq__header h3{
  font-size: 24px
}

/* BUTTONS */
.web-btn,
.web-btn .site-btn {
  display: inline-block;
  transform-origin: center center;   /* 2) pivot growth around the center */
  transition: transform 0.15s linear; /* only tween the transform */
}
.web-btn.kl-rich-text__buttons{
  margin: 10px;
}
a.arrow{
 font-family: Chivo Mono;
  font-weight: 500;
  font-style: Medium;
  font-size: 16px;
  leading-trim: NONE;
  line-height: 100%;
  letter-spacing: 0%;
  text-align: center;
  vertical-align: bottom;
  text-decoration: underline;
  text-decoration-style: solid;
  text-decoration-offset: 0%;
  text-decoration-thickness: 0%;
}
.arrow span::after {
    content: "";
    display: inline-block;
    margin-left: 0.5em;
    margin-top: -2px;
    vertical-align: middle;
    width: 0.8em;
    height: 0.8em;
    background: url(https://5910251.fs1.hubspotusercontent-na1.net/hubfs/5910251/buttonarrow.png) center center no-repeat;
    background-size: contain;
}
.card-dark .arrow{
 color: #ffffff 
}
.img-card .kl-card__image {
 margin: 0; 
}
.img-card h3, .img-card h4{
  font-family: Plus Jakarta Sans;
  font-weight: 600;
  font-style: SemiBold;
  font-size: 24px;
  leading-trim: NONE;
  line-height: 100%;
  letter-spacing: -3%;
  font-variant-numeric-figure: lining-nums;
  font-variant-numeric-spacing: proportional-nums;

}

.card-dark.img-card h3, .card-dark.img-card h4{
 color: #ffe605 
}


.site-btn, .kl-rich-text__buttons a, form input[type=submit], form .hs-button{
  font-family: Chivo Mono, sans-serif;
  font-size: 16px;
  font-style: normal;
  line-height: 1.1;
  letter-spacing: 0.03em;
  display: inline-block;
  align-items: center;
  text-align: center;
  justify-content: center;
  border-radius: 40px;
  padding: 12px 32px;
  margin: 10px;
  gap: 10px;
  text-decoration: none;
  font-weight: 500;
  border: 3px solid transparent;
  cursor: pointer;
  position: relative;
  transition: all 0.15s linear ease-in !important;
  transform-origin: center center !important;
}

.site-btn:hover, form input[type=submit], form .hs-button{
    background-color: #FFE605 !important;
    border-color: rgba(59, 102, 201, 1.0);
    text-decoration: none;
    border-color: transparent !important;
}
.site-btn:hover, a:hover, button:hover, form input[type=submit]:hover, form .hs-button:hover{
    transform: scale(1,1) !important;       /* uniform X+Y scale */
}

/* Yellow style with gradient border that follows radius */
.site-btn.ybtn, .dark-bg .kl-rich-text__buttons a {
  /* two backgrounds: 
     1) your solid fill,  2) the gradient border */
  background-image:
    linear-gradient(#FFE605, #FFE605),           /* fill */
    linear-gradient(45deg, #FFFFFF, #FFFF66);    /* border gradient */

  /* ensure the fill sits inside the border */
  background-origin: padding-box, border-box;
  /* clip each layer to the right box */
  background-clip: padding-box, border-box;
  color: #000;
}
.site-btn.ybtn:hover, .site-btn.ybtn:focus, .dark-bg .kl-rich-text__buttons a:hover,  .dark-bg .kl-rich-text__buttons a:focus{
  background-image:
    linear-gradient(#1A1E22, #1A1E22),          /* fill (adjust to your exact black) */
    linear-gradient(45deg, #FFFFFF, #FFFF66);    /* same yellow gradient */
  background-origin: padding-box, border-box;
  background-clip: padding-box, border-box;
  /* transparent 3px border to carve out the gradient */
  border: 3px solid transparent;
  /* text color */
  color: #FFF !important;
}



/* FORM BUTTONS */
.actions {
  position: relative;
  display: inline-block;
}

.actions::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 1.5em;
  transform: translateY(-50%);
  width: 0.7em;
  height: 0.7em;
  background: url('https://5910251.fs1.hubspotusercontent-na1.net/hubfs/5910251/buttonarrow.png') center center no-repeat;
  background-size: contain;
  pointer-events: none;
}
.actions:hover::after {
  background: url('https://5910251.fs1.hubspotusercontent-na1.net/hubfs/5910251/blackarrow.png') center center no-repeat;
  background-size: contain;
  pointer-events: none;
}
form label{
font-family: Plus Jakarta Sans;
font-weight: 700;
font-style: Bold;
font-size: 14px;
leading-trim: NONE;
line-height: 100%;
letter-spacing: 3%;
font-variant-numeric-figure: lining-nums;
font-variant-numeric-spacing: proportional-nums;

}
/* 🎯 HubSpot widget-scoped form fields */
#hs_cos_wrapper_widget_1753103887199 input[type="text"],
#hs_cos_wrapper_widget_1753103887199 input[type="email"],
#hs_cos_wrapper_widget_1753103887199 input[type="password"],
#hs_cos_wrapper_widget_1753103887199 input[type="tel"],
#hs_cos_wrapper_widget_1753103887199 input[type="number"],
#hs_cos_wrapper_widget_1753103887199 input[type="file"],
#hs_cos_wrapper_widget_1753103887199 select,
#hs_cos_wrapper_widget_1753103887199 textarea,
[id^="hs_cos_wrapper_widget_"] input[type="text"],
[id^="hs_cos_wrapper_widget_"] input[type="email"],
[id^="hs_cos_wrapper_widget_"] input[type="password"],
[id^="hs_cos_wrapper_widget_"] input[type="tel"],
[id^="hs_cos_wrapper_widget_"] input[type="number"],
[id^="hs_cos_wrapper_widget_"] input[type="file"],
[id^="hs_cos_wrapper_widget_"] select,
[id^="hs_cos_wrapper_widget_"] textarea,
input[type="text"],
input[type="email"],
input[type="password"],
input[type="tel"],
input[type="number"],
input[type="file"],
select,
textarea {
  border-radius: 8px !important;
}


form input[type=submit], form .hs-button{
 padding-right: 2.5em; 
}


.right-arrow.site-btn::after,  .kl-rich-text__buttons a ::after, form input[type=submit]:: after, .hs-button::after {
    content: "";
    display: inline-block;
    margin-left: 0.5em;
    margin-top: -2px;
    vertical-align: middle;
    width: 1em;
    height: 1em;
    background: url(https://5910251.fs1.hubspotusercontent-na1.net/hubfs/5910251/buttonarrow.png) center center no-repeat;
    background-size: contain;
}

.ybtn.site-btn::after, .dark-bg .kl-rich-text__buttons a ::after {
  background: url('https://5910251.fs1.hubspotusercontent-na1.net/hubfs/5910251/blackarrow.png') center center no-repeat;
  background-size: contain;
}
.ybtn.site-btn:hover::after, .dark-bg .kl-rich-text__buttons a:hover ::after {
    background: url('https://5910251.fs1.hubspotusercontent-na1.net/hubfs/5910251/buttonarrow.png') center center no-repeat !important;
  background-size: contain !important;
}


/* Black style with matching yellow gradient border */
.site-btn.bbtn, .light-bg .kl-rich-text__buttons a, form input[type=submit], form .hs-button {
  /* 1) solid black fill, 2) yellow gradient for the border */
  background-image:
    linear-gradient(#1A1E22, #1A1E22),          /* fill (adjust to your exact black) */
    linear-gradient(45deg, #FFFFFF, #FFFF66);    /* same yellow gradient */
  background-origin: padding-box, border-box;
  background-clip: padding-box, border-box;
  /* transparent 3px border to carve out the gradient */
  border: 3px solid transparent;
  /* text color */
  color: #FFF;
}
.site-btn.bbtn:hover,
.site-btn.bbtn:focus,
.light-bg .kl-rich-text__buttons a:hover,
.light-bg .kl-rich-text__buttons a:focus,
form input[type=submit]:hover, form input[type=submit]:focus, form input[type=submit]:active, form .hs-button:hover, form .hs-button:focus, form .hs-button:active{
  /* two backgrounds: 
     1) your solid fill,  2) the gradient border */
  background-image:
    linear-gradient(#FFE605, #FFE605),           /* fill */
    linear-gradient(45deg, #FFFFFF, #FFFF66);    /* border gradient */

  /* ensure the fill sits inside the border */
  background-origin: padding-box, border-box;
  /* clip each layer to the right box */
  background-clip: padding-box, border-box;
  color: #000;
}
.bbtn.site-btn::after, .light-bg .kl-rich-text__buttons a ::after, form input[type=submit]::after, form .hs-button::after{
    background: url('https://5910251.fs1.hubspotusercontent-na1.net/hubfs/5910251/buttonarrow.png') center center no-repeat;
    background-size: contain;
}
.bbtn.site-btn:hover::after, .light-bg .kl-rich-text__buttons a:hover ::after , form input[type=submit]:hover::after, form .hs-button:hover::after{
    background: url('https://5910251.fs1.hubspotusercontent-na1.net/hubfs/5910251/blackarrow.png') center center no-repeat !important;
    background-size: contain !important;
}

.site-btn.gbtn {
  background-color: #e0e0e0;
  color: #000;
  border: 3px solid #bbb;
}


/* Typography */
.kl-hero-02__content{
 max-width: 1280px !important;
}
.kl-hero-02__content .kl-rich-text {
    flex-basis: 40% !important;
}
.kl-rich-text__preheader {
    font-family: Chivo Mono;
    font-weight: 500 !important;
    font-style: Medium;
    font-size: 18px !important;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: uppercase;
    color: #3D77FF !important;

}
.preheading{
  margin-bottom: 15px;
}
.header-content.light{
  color: #000000;
}
.header-content.dark{
  color: #ffffff;
}
.header-content h1{
  font-family: Plus Jakarta Sans;
  font-weight: 700;
  font-style: Bold;
  font-size: 52px;
  leading-trim: NONE;
  line-height: 60px;
  letter-spacing: 0%;
}
.header-content p{
  font-family: Plus Jakarta Sans;
  font-weight: 500;
  font-style: Medium;
  font-size: 20px;
  leading-trim: NONE;
  line-height: 140%;
  letter-spacing: 0%;
}
h2{
  font-family: Plus Jakarta Sans;
  font-weight: 700;
  font-style: Bold;
  font-size: 40px;
  leading-trim: NONE;
  line-height: 120%;
  letter-spacing: 0%;
}
h3{
  font-family: Plus Jakarta Sans;
  font-weight: 700;
  font-style: Bold;
  font-size: 32px;
  leading-trim: NONE;
  line-height: 100%;
  letter-spacing: 0%;
}
p{
  font-family: Plus Jakarta Sans;
  font-weight: 400;
  font-style: Regular;
  font-size: 16px;
  leading-trim: NONE;
  line-height: 150%;
  letter-spacing: 0%;
}


.kl-card-grid--4-columns .kl-card-grid__card-wrapper{
  /* max-width: 25%; */
}
.flex-center, .flex-center > div {
    align-items: center;
    display: flex;
    justify-content: center;
}
/* Cards */
.card-no-bg .kl-card-grid__card {
    border: 0px solid rgba(100, 146, 253, 0.2);
    box-shadow: unset;
    background-color: unset;
}
.user-card .kl-card-grid--4-columns .kl-card-grid__card-wrapper{
  max-width: 25%;
}
.user-card .kl-card-grid__content {
    text-align: left;
    padding-left: 0;
}
.user-card pre {
    font-family: Plus Jakarta Sans;
    font-size: 16px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0%;
    text-wrap: auto;
}
.card-title{
  font-family: Plus Jakarta Sans;
  font-weight: 700;
  font-style: Bold;
  font-size: 18px;
  leading-trim: NONE;
  line-height: 100%;
  letter-spacing: 3%;
  text-align: center;
}
.card-numbers, .card-numbers h3, .card-numbers h4{
  font-family: Chivo Mono;
  font-weight: 500;
  font-style: Medium;
  font-size: 52px;
  leading-trim: NONE;
  line-height: 52px;
  letter-spacing: -3%;
  text-align: center;
  font-variant-numeric-figure: lining-nums;
  font-variant-numeric-spacing: proportional-nums;
  color: #ffe605;
}
.card-text, .kl-card p{
  font-family: Plus Jakarta Sans;
  font-weight: 400;
  font-style: Regular;
  font-size: 18px;
  leading-trim: NONE;
  line-height: 140%;
  letter-spacing: 0%;
  text-align: center;
}
.card-text.small p{
  font-family: Plus Jakarta Sans;
  font-weight: 500;
  font-style: Medium;
  font-size: 16px;
  leading-trim: NONE;
  line-height: 19px;
  letter-spacing: 3%;
  text-align: center;
}
.card-text.dark, .card-dark p{
  color: #fff;
}
.img-rounded .kl-card-grid__image {
    border-radius: 12px;
}
.text-left{
  text-align: left;
}
.text-center{
  text-align: center;
}
.text-right{
  text-align: right;
}
.text-white, .text-white h1, .text-white h2, .text-white h3, .text-white h4, .text-white h5, .text-white h6{
  color: #fff !important; 
}

.card-img-100 .kl-card-grid__image{
  height: 100px;
}

/* Tables */
.no-border table{
  border: 0px solid #ffffff !important;
}

.kl-card table{
  background-color: inherit !important;
}
.kl-card th, .kl-card td {
    color: inherit !important;
}


/* Images */
.contain, .contain .kl-card-grid__image {
    background-size: contain;
}
.cover, .cover .kl-card-grid__image{
  background-size: cover;
}

/* Modals & Popups */
.kl-about-modal__header h4 {
    color: #666 !important;
    font-family: Plus Jakarta Sans;
    font-weight: 600;
    font-style: SemiBold;
    font-size: 14px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 3%;
    text-transform: uppercase;
}
.kl-about-modal__image {
    width: 330px;
    padding: 2.15em 0em 0 2em;
}
.kl-about-modal__image img {
    max-width: 100%;
    width: 100%;
    height: auto !important;
    object-fit: cover;
    border-radius: 0.5em;
}

/* spacing - 0em */
.mt-0 { margin-top: 0em !important; }
.mb-0 { margin-bottom: 0em !important; }
.ml-0 { margin-left: 0em !important; }
.mr-0 { margin-right: 0em !important; }
.ma-0 { margin: 0em !important; }
.mx-0 { margin-left: 0em !important; margin-right: 0em !important; }
.my-0 { margin-top: 0em !important; margin-bottom: 0em !important; }

.pt-0 { padding-top: 0em !important; }
.pb-0 { padding-bottom: 0em !important; }
.pl-0 { padding-left: 0em !important; }
.pr-0 { padding-right: 0em !important; }
.pa-0 { padding: 0em !important; }
.px-0 { padding-left: 0em !important; padding-right: 0em !important; }
.py-0 { padding-top: 0em !important; padding-bottom: 0em !important; }

/* spacing - 1em */
.mt-1 { margin-top: 1em !important; }
.mb-1 { margin-bottom: 1em !important; }
.ml-1 { margin-left: 1em !important; }
.mr-1 { margin-right: 1em !important; }
.ma-1 { margin: 1em !important; }
.mx-1 { margin-left: 1em !important; margin-right: 1em !important; }
.my-1 { margin-top: 1em !important; margin-bottom: 1em !important; }

.pt-1 { padding-top: 1em !important; }
.pb-1 { padding-bottom: 1em !important; }
.pl-1 { padding-left: 1em !important; }
.pr-1 { padding-right: 1em !important; }
.pa-1 { padding: 1em !important; }
.px-1 { padding-left: 1em !important; padding-right: 1em !important; }
.py-1 { padding-top: 1em !important; padding-bottom: 1em !important; }

/* spacing - 2em */
.mt-2 { margin-top: 2em !important; }
.mb-2 { margin-bottom: 2em !important; }
.ml-2 { margin-left: 2em !important; }
.mr-2 { margin-right: 2em !important; }
.ma-2 { margin: 2em !important; }
.mx-2 { margin-left: 2em !important; margin-right: 2em !important; }
.my-2 { margin-top: 2em !important; margin-bottom: 2em !important; }

.pt-2 { padding-top: 2em !important; }
.pb-2 { padding-bottom: 2em !important; }
.pl-2 { padding-left: 2em !important; }
.pr-2 { padding-right: 2em !important; }
.pa-2 { padding: 2em !important; }
.px-2 { padding-left: 2em !important; padding-right: 2em !important; }
.py-2 { padding-top: 2em !important; padding-bottom: 2em !important; }

/* spacing - 3em */
.mt-3 { margin-top: 3em !important; }
.mb-3 { margin-bottom: 3em !important; }
.ml-3 { margin-left: 3em !important; }
.mr-3 { margin-right: 3em !important; }
.ma-3 { margin: 3em !important; }
.mx-3 { margin-left: 3em !important; margin-right: 3em !important; }
.my-3 { margin-top: 3em !important; margin-bottom: 3em !important; }

.pt-3 { padding-top: 3em !important; }
.pb-3 { padding-bottom: 3em !important; }
.pl-3 { padding-left: 3em !important; }
.pr-3 { padding-right: 3em !important; }
.pa-3 { padding: 3em !important; }
.px-3 { padding-left: 3em !important; padding-right: 3em !important; }
.py-3 { padding-top: 3em !important; padding-bottom: 3em !important; }

/* spacing - 4em */
.mt-4 { margin-top: 4em !important; }
.mb-4 { margin-bottom: 4em !important; }
.ml-4 { margin-left: 4em !important; }
.mr-4 { margin-right: 4em !important; }
.ma-4 { margin: 4em !important; }
.mx-4 { margin-left: 4em !important; margin-right: 4em !important; }
.my-4 { margin-top: 4em !important; margin-bottom: 4em !important; }

.pt-4 { padding-top: 4em !important; }
.pb-4 { padding-bottom: 4em !important; }
.pl-4 { padding-left: 4em !important; }
.pr-4 { padding-right: 4em !important; }
.pa-4 { padding: 4em !important; }
.px-4 { padding-left: 4em !important; padding-right: 4em !important; }
.py-4 { padding-top: 4em !important; padding-bottom: 4em !important; }

/* spacing - 5em */
.mt-5 { margin-top: 5em !important; }
.mb-5 { margin-bottom: 5em !important; }
.ml-5 { margin-left: 5em !important; }
.mr-5 { margin-right: 5em !important; }
.ma-5 { margin: 5em !important; }
.mx-5 { margin-left: 5em !important; margin-right: 5em !important; }
.my-5 { margin-top: 5em !important; margin-bottom: 5em !important; }

.pt-5 { padding-top: 5em !important; }
.pb-5 { padding-bottom: 5em !important; }
.pl-5 { padding-left: 5em !important; }
.pr-5 { padding-right: 5em !important; }
.pa-5 { padding: 5em !important; }
.px-5 { padding-left: 5em !important; padding-right: 5em !important; }
.py-5 { padding-top: 5em !important; padding-bottom: 5em !important; }

/* spacing - 6em */
.mt-6 { margin-top: 6em !important; }
.mb-6 { margin-bottom: 6em !important; }
.ml-6 { margin-left: 6em !important; }
.mr-6 { margin-right: 6em !important; }
.ma-6 { margin: 6em !important; }
.mx-6 { margin-left: 6em !important; margin-right: 6em !important; }
.my-6 { margin-top: 6em !important; margin-bottom: 6em !important; }

.pt-6 { padding-top: 6em !important; }
.pb-6 { padding-bottom: 6em !important; }
.pl-6 { padding-left: 6em !important; }
.pr-6 { padding-right: 6em !important; }
.pa-6 { padding: 6em !important; }
.px-6 { padding-left: 6em !important; padding-right: 6em !important; }
.py-6 { padding-top: 6em !important; padding-bottom: 6em !important; }

.max-10  { max-width: 10% !important; }
.max-15  { max-width: 15% !important; }
.max-20  { max-width: 20% !important; }
.max-25  { max-width: 25% !important; }
.max-30  { max-width: 30% !important; }
.max-35  { max-width: 35% !important; }
.max-40  { max-width: 40% !important; }
.max-45  { max-width: 45% !important; }
.max-50  { max-width: 50% !important; }
.max-55  { max-width: 55% !important; }
.max-60  { max-width: 60% !important; }
.max-65  { max-width: 65% !important; }
.max-70  { max-width: 70% !important; }
.max-75  { max-width: 75% !important; }
.max-80  { max-width: 80% !important; }
.max-85  { max-width: 85% !important; }
.max-90  { max-width: 90% !important; }
.max-95  { max-width: 95% !important; }
.max-100 { max-width: 100% !important; }

.hero-split-20-80 .kl-hero-02__content .kl-rich-text {
    flex-basis: 20% !important;
}
.hero-split-30-70 .kl-hero-02__content .kl-rich-text {
    flex-basis: 30% !important;
}

.kl-card__image.contain {
    position: relative;
    display: block;
}