/* important avoids inital load jump */
.kl-dnd-header-spacer {
    height: 150px !important;
}

.kl-slider-testimonial__header {
	overflow: hidden;
}
.kl-testimonial-slider-wrapper {
	margin: 0;
}

.kl-slider-testimonial__header img {
	width: 100%;
	object-fit: cover;
}
.kl-testimonial-slider .glide__arrow {
	background: #84c260 !important;
}
.kl-testimonial-slider .glide__arrow {
	padding: 5px;
}

.kl-testimonial-slider .glide__arrow--left {
	left: 9px;
}

.kl-testimonial-slider .glide__arrow--right {
	right: 0;
}

:root {
    --card-border: 3px solid #EEEEEE;
    --card-border-radius: 12px;
}

.metsol-card-wrapper  {
  border: var(--card-border);
  border-radius: var(--card-border-radius);
}

.metsol-card-wrapper.light  {
  border-color: #E0ECEE;
}


img.metsol-card-wrapper {
 max-width: 100%;
 height: auto;
}

@media(max-width:1280px){

	.kl-testimonial-slider .glide__arrow {
		position: relative;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		transform: none;
	}

	.glide__arrows {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 25px;
	}
}
/* global kalungi */

html {
 overflow-x: hidden; 
}

.isolate-context {
  isolation: isolate;
}

/* global typography overwrite */
h1, h2, h3,h4,h5,h6 {
    line-height: 1.25;
    letter-spacing: 0;
}

p.muted {
    color: #596566;
}

@media (max-width: 800px) {
.align-center-tablet {
  text-align: center;
  
}
}

@media (max-width: 580px) {
.align-center-mobile {
  text-align: center;
  
}
}

@media (min-width: 580px) {
    .font-40 {
    font-size: 40px;
}
  .font-38 {
    font-size: 38px;
  }
      .font-42 {
    font-size: 42px;
}
  .font-24 {
    font-size: 24px;
  }
  .font-48 {
   font-size: 48px; 
  }
}

.ul-clean {
  list-style: none;       /* remove default bullets */
  padding-left: 0;        /* remove default indentation */
  margin: 0;
}

.ul-clean li {
  position: relative;
  padding-left: 16px;     /* space for custom marker */
  margin-bottom: 16px;
}

.ul-clean li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 8px;               /* adjust vertically */
  width: 8px;
  height: 8px;
  background-color: var(--bullet-color, #000); /* fallback color */
  border-radius: 50%;
}


.green-numbers li::marker {
      color: #2A9D8F; /* A nice bright green */
      font-weight: bold;
}

.metsol-grid-list {
  display: grid;
  gap: 16px 24px; /* row-gap column-gap */
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}


form, .submitted-message {
    font-family: Lato, sans-serif;
}

/* end global typography overwrite */


/* floating section */ 


.dnd-section.floating_rounded_section  {
    border: var(--card-border);
    border-radius: 32px;
    width: fit-content;
    margin: 0 auto;
    overflow: hidden;
}

@media screen and (max-width: 1240px) {
    .dnd-section.floating_rounded_section {
    border-radius: 0px;
      width: 100%;

}
}


/* flating section end */

/* video */
.hs_cos_wrapper .hs-video-widget {
    border-radius: 24px;
    overflow: hidden;
      border: var(--card-border);
}

/* video end */

/* form start */

.dnd-section .widget-type-form .actions {
  width: 100%;
}
  
.dnd-section  .widget-type-form input.hs-button.primary.large {
    width: 100%;
    display: block;
    font-family: Nunito, sans-serif;
    font-weight: 700;
}
  

/* end form */

/* blog tags */

ul.blog-tags {
    max-width: none;
    gap: 20px 0px;
    display: flex;
    flex-wrap: wrap;
}

ul.blog-tags li {
  border-radius: 0;
    margin: 0;
       border-bottom: 1px solid #B9B9B9;
}

ul.blog-tags li + li  {
  padding-right: 20px;
     
}
ul.blog-tags li:first-child  {
  padding-right: 20px;   
}
ul.blog-tags li:last-child  {
  padding-right: 0px;   
}

a.blog-tags__link, a.blog-tags__link:hover {
    padding: 0;
    padding-bottom: 12px;
    background: none;
    font-size: 16px;
    color: #596566;
    border-radius: 0;
    margin: 0;
    font-weight: 600;
    border: none;
    position: relative;
}

a.blog-tags__link.blog-tags__link--current::after, a.blog-tags__link::after {
  transform: scaleY(0);
    content: "";
  width: 100%;
  display: block;

  position: absolute;
  height: 3px;
  background: #2A9D8F;
  top: calc(100% - 1.5px);
  transition: transform 300ms ease; 
  background: #B9B9B9;
}

a.blog-tags__link.blog-tags__link--current::after {
  background: #2A9D8F;
}

a.blog-tags__link.blog-tags__link--current::after,ul.blog-tags li:hover a.blog-tags__link::after {
  transform: scaleY(1);
  transition: transform 200ms ease;
}

/* blog tags end*/

/* blog subscribe start */



.blog-subscribe input {
   border: 1px solid  #E2E8F0;
   border-radius: 7px;
}
/* blog subscribe end */


.kl-helper__content {
 font-family: Lato, sans-serif !important; 
}

/* offer 1 banner */

.kl-offer-01__content {
    flex-dire
}

.kl-offer-01__content {
    flex-direction: column;
    justify-content:start;
    align-items:start;
}

.kl-offer-01__content .kl-offer-01__text {
    flex-grow: 0;
    flex-basis: auto;
        margin-right: 0px;
}

.kl-offer-01__image {
    padding-right: 60px;
    flex-basis: 311px;
    padding-top: 30px;
}

.kl-offer-01 {
    box-shadow: none;
    border: 0.3px solid #36C4B3;
    align-items: end;
    background-color: white;
}

.kl-offer-01__button {
    margin-top:  40px;
}



@media (max-width: 758px) {

    .kl-offer-01 {align-items: start;justify-content: start;}
    .kl-offer-01__image {
    flex-basis: auto;
        max-width: 450px;
        margin: 0;
 
}
}

/* offer banner end */


/* @import url('http://example.com/example_style.css'); */
/***********************************************/
/* CSS @imports must be at the top of the file */
/***********************************************/

/*****************************************/
/* Base & Shared Styles                  */
/*****************************************/

/* Shared wrappers */
.blog-index__post-wrapper,
.blog-more-posts__post-wrapper {
  box-shadow: none;
  padding: 0;
}

.blog-index__post,
.blog-more-posts__post {
  box-shadow: none;
  overflow: visible;
}

/* Shared content spacing */
.blog-index__post-content,
.blog-more-posts__post-content,
.blog-index__post .blog-index__post-content,
.blog-more-posts__post .blog-index__post-content {
  padding: 32px 0 0;
}

/* Shared post image styles */
.blog-index__post a.blog-index__post-image,
.blog-more-posts__post a.blog-more-posts__post-image {
  border-radius: 24px;
  transition: filter 400ms ease-out, transform 400ms ease-out;
}

.blog-index__post a.blog-index__post-image:hover,
.blog-more-posts__post a.blog-more-posts__post-image:hover {
  filter: brightness(102%) saturate(1.3);
  transform: scale(1.02);
  transition: filter 200ms ease-in, transform 200ms ease-in;
}

/* shared arrow for read more */

.metsol .blog-index__post-meta, .blog-more-posts__post-meta {
  margin-top: 0;
}

.metsol .blog-index__read-post a, .blog-more-posts__read-post a {
  display: flex;
  align-items: center;
  text-transform: none;
  font-weight: bold;
  font-family: Lato;
  font-size: 16px;
}

.metsol .blog-index__read-post svg, .blog-more-posts__read-post svg {
  margin-left: 4px;
  transition: margin-left 200ms;
}

.metsol .blog-index__read-post:hover a, .blog-more-posts__read-post a {
  text-decoration: none;
}

.metsol .blog-index__read-post:hover svg, .blog-more-posts__read-post:hover svg {
  margin-left: 8px;
}

/*****************************************/
/* Blog Index Styles                     */
/*****************************************/

section.blog-index {
  display: grid;
  gap: 42px;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  justify-items: start;
  align-items: start;
  justify-content: center;
}


section.blog-index .blog-index__post-wrapper,
section.blog-index .blog-more-posts__post-wrapper {
  max-width: 591px;
  width: 100%;
}



/*****************************************/
/* Pagination Styles                     */
/*****************************************/

.blog-pagination {
  gap: 7px;
  justify-content: center;
}

.pag-button,
.blog-pagination__link {
  background-color: #f3f3f3;
  border: 3px solid #e2e2e2;
  font-size: 16px;
  color: #afafaf;
  padding: 10px;
  aspect-ratio: 1 / 1;
  min-width: 42px;
  min-height: 42px;
  max-width: 80px;
  max-height: 80px;
  border-radius: 100vw;
  display: grid;
  place-items: center;
  margin: 0;
  transition: all 400ms;
}

.pag-button:hover,
.blog-pagination__link:hover,
.blog-pagination__link--active {
  background-color: #d6f2ee;
  border: 3px solid #2a9d8f;
  color: #2a9d8f;
  transition: all 200ms;
}

.pag-button.disabled {
  display: none;
}

/*****************************************/
/* Blog More Posts Styles                */
/*****************************************/

.blog-more-posts {
  display: flex;
  flex-wrap: wrap;
  gap: 27px;
  justify-content: center;
  align-items: start;
  width: 100%;
  align-content: space-between;
  flex-direction: row;
}

.blog-more-posts__post-wrapper {
  flex: 1 1 calc(389px - 27px);
  max-width: 500px;
}

a.blog-more-posts__post-image {
  border-radius: 15px;
}

.blog-more-posts:after {
  display: none;
}



.hs-search-field input {
    font-family: Nunito, sans-serif !important;
}

/*****************************************/
/* Responsive                            */
/*****************************************/

@media (max-width: 800px) {
  section.blog-index {
    grid-template-columns: 1fr;
    justify-items: center;
  }
}
.blog-post__body p, .blog-post__body li,.blog-post__body span {
    color: hsl(185 7% 29% / 1);
}

.blog-post__body-wrapper-2 .kl-social-sharing {
    gap: 10px;
}

.blog-post__body-wrapper-2 .kl-social-sharing .kl-social-logos {
    width: 30px;
    height: 30px;
}

.blog-post__body-wrapper-2 .blog-post__author {
    display: flex;
    gap: 15px;
}

.blog-post__body-wrapper-2 .blog-post__author a {
    color: #2A9D8F;
    font-size: 18px;
    font-weight: 700;
}

.blog-post__body-wrapper-2 .blog-post__timestamp {
    color: #596566;
}

.blog-post__body-wrapper-2 img {}

.blog-post__body-wrapper-2 .blog-header__image-featured img {
    border-radius: 24px;
    position: relative;
}

.blog-post__body-wrapper-2 .blog-header__image-featured {
    position: relative;
}

.blog-post__body-wrapper-2 .blog-post__tags {
    position: absolute;
    font-size: 16px;
    top: 17px;
    left: 13px;
    z-index: 10;
}

.blog-post__body-wrapper-2 .blog-post__tags .blog-post__tag-link {
    background-color: #C8E4E1;
    color: #596566;
    border-radius: 4px;
    padding: 5px 17px;
    opacity: 1;
}

.blog-post__body-wrapper-2 span.blog-post__preheader {
    display: none;
}

.blog-post__body-wrapper-2 .blog-post__avatar {
    margin: 0;
    border: 2px solid #2A9D8F;
    max-width: 48px;
    max-height: 48px;
    margin-right: 15px;
    aspect-ratio: 1/1;
}

.blog-post__body-wrapper-2 img {
    overflow: hidden;
    border-radius: 24px;
}
/* @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    */
/*****************************************/


/* foooter new styles very hardcoded */


.dnd_area_footer-row-0-padding li.hs-menu-item a{

    color: white;
   font-size: 16px;
}


.dnd_area_footer-row-0-padding li.hs-menu-item {

   padding-block: 8px;
}

/* simple footer better responsiveness */



.row-fluid-wrapper.row-depth-1.row-number-4.cell_1752565307689-row-2-vertical-alignment.cell_1752565307689-row-2-padding.dnd-row > .row-fluid  {
  display: flex; 
  flex-wrap: wrap;
  gap: 28px 0px;
}

.row-fluid-wrapper.row-depth-1.row-number-4.cell_1752565307689-row-2-vertical-alignment.cell_1752565307689-row-2-padding.dnd-row > .row-fluid > div {
  flex: 1 1 220px;
  margin: 0;
}


/* simple footer better responsiveness end */


/* old styles for long version v1 of footer
.dnd_area_footer-row-0-padding .row-number-4.row-depth-1 > .row-fluid{
   display: flex !important;
   gap: 80px;
   flex-wrap: wrap;
   justify-content: start;
}

.dnd_area_footer-row-0-padding .row-number-4 > .row-fluid::before{
display: none;
}

.dnd_area_footer-row-0-padding .row-number-4 > .row-fluid > .span2.dnd-column {
   flex-basis: 161px;
   flex-grow: 0;
   flex-shrink: 1;
}

.dnd_area_footer-row-0-padding .row-number-4 > .row-fluid > :not(.span2).dnd-column{
   flex-basis: 446px;
   margin: 0;
   flex-grow: 1;
   flex-shrink: 1;
}

@media screen and (max-width:767px) {
   .dnd_area_footer-row-0-padding .row-number-4 > .row-fluid > :not(.span2).dnd-column{
   flex-basis: 200px;
   margin: 0;
   flex-grow: 1;
   flex-shrink: 1;
}
}


.dnd_area_footer-row-0-padding .span12.widget-span.widget-type-custom_widget.dnd-module {
    width: fit-content !important;
}


   .dnd_area_footer-row-0-padding .row-number-4 > .row-fluid > :not(.span2).dnd-column .row-fluid-wrapper.row-depth-1.dnd-row:last-child .row-fluid {
      display: flex !important;
      flex-wrap: wrap;
      gap: 20px;
      justify-content: start;
}

   .dnd_area_footer-row-0-padding .row-number-4 > .row-fluid > :not(.span2).dnd-column .row-fluid-wrapper.row-depth-1.dnd-row:last-child .row-fluid > span{
      flex-basis: 200px;
}

   .dnd_area_footer-row-0-padding .row-number-4 > .row-fluid > :not(.span2).dnd-column .row-fluid-wrapper.row-depth-1.dnd-row:last-child .row-fluid::before {
      display: none !important;
      
}

.dnd_area_footer-row-0-padding .row-number-4 > .row-fluid > :not(.span2).dnd-column .row-fluid-wrapper.row-depth-1.dnd-row:last-child .r {
    display: flex !important;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: start;
}

.dnd_area_footer-row-0-padding .row-fluid [class*=span] {
   margin: 0;
}

.dnd_area_footer-row-0-padding .row-number-4 > .row-fluid > :not(.span2).dnd-column .row-fluid-wrapper.row-depth-1.dnd-row:last-child [class*=span] {
  flex-basis: 133px;
  flex-grow: 1;
}

.dnd_area_footer-row-0-padding .row-number-4.row-depth-1>.row-fluid::after {
    display: none;
}

.dnd_area_footer-row-0-padding  h3 {
   margin-bottom: 0px;
}
*/

/* footer new styles very hardcoded  end*/
/* @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    */
/*****************************************/

/* custom tables */

.metsol-table-container {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.metsol-table {
  width: 100%;
  min-width: 650px;
  border-collapse: collapse;
  color: #5E7471;
  border: none;
}

.metsol-table th {
  background-color: transparent;
  color: #122228;
  text-align: left;
  padding: 12px 15px;
  border: none;
  border-bottom: 1px solid #CDCDCD;
}

.metsol-table td {
  padding: 20px 15px;
  border: none;
  border-bottom: 1px solid #CDCDCD;
  text-align: left;
}

.metsol-table tbody tr:last-child td {
  border-bottom: none;
}

.metsol-table a {
  color: #5E7471;
  text-decoration: none;
}

.metsol-table a:hover {
  text-decoration: underline;
}

.download-button {
  display: inline-flex;
  align-items: center;
  color: white !important;
  gap: 6px;
  text-wrap: nowrap;
}

.download-button::before {
  content: '';
  display: inline-block;
  width: 17px;
  height: 17px;
  background-image: url('data:image/svg+xml,<svg width="17" height="17" viewBox="0 0 17 17" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M2.78711 15H4.28711V16.5H2.78711C1.66211 16.5 0.787109 15.625 0.787109 14.5V2.5C0.787109 1.40625 1.66211 0.5 2.78711 0.5H7.94336C8.47461 0.5 8.97461 0.71875 9.34961 1.09375L12.1934 3.9375C12.5684 4.3125 12.7871 4.8125 12.7871 5.34375V10H11.2871V5.5H8.78711C8.22461 5.5 7.78711 5.0625 7.78711 4.5V2H2.78711C2.50586 2 2.28711 2.25 2.28711 2.5V14.5C2.28711 14.7812 2.50586 15 2.78711 15ZM6.28711 11.5H7.28711C8.22461 11.5 9.03711 12.3125 9.03711 13.25C9.03711 14.2188 8.22461 15 7.28711 15H6.78711V16C6.78711 16.2812 6.53711 16.5 6.28711 16.5C6.00586 16.5 5.78711 16.2812 5.78711 16V14.5V12C5.78711 11.75 6.00586 11.5 6.28711 11.5ZM7.28711 14C7.69336 14 8.03711 13.6875 8.03711 13.25C8.03711 12.8438 7.69336 12.5 7.28711 12.5H6.78711V14H7.28711ZM10.2871 11.5H11.2871C12.0996 11.5 12.7871 12.1875 12.7871 13V15C12.7871 15.8438 12.0996 16.5 11.2871 16.5H10.2871C10.0059 16.5 9.78711 16.2812 9.78711 16V12C9.78711 11.75 10.0059 11.5 10.2871 11.5ZM11.2871 15.5C11.5371 15.5 11.7871 15.2812 11.7871 15V13C11.7871 12.75 11.5371 12.5 11.2871 12.5H10.7871V15.5H11.2871ZM13.7871 12C13.7871 11.75 14.0059 11.5 14.2871 11.5H15.7871C16.0371 11.5 16.2871 11.75 16.2871 12C16.2871 12.2812 16.0371 12.5 15.7871 12.5H14.7871V13.5H15.7871C16.0371 13.5 16.2871 13.75 16.2871 14C16.2871 14.2812 16.0371 14.5 15.7871 14.5H14.7871V16C14.7871 16.2812 14.5371 16.5 14.2871 16.5C14.0059 16.5 13.7871 16.2812 13.7871 16V14V12Z" fill="%23FFFFFF"/></svg>');
  background-repeat: no-repeat;
  background-size: contain;
}

/* alt version */
.metsol-table-container.alt {
  overflow: auto;
  -webkit-overflow-scrolling: touch; /* Re-adding from base class for scroll consistency */
  /* border-radius: 8px; -- REMOVED */
  /* overflow: hidden; -- CHANGED */
}

/*
 * 1. Set 'border-collapse: separate' and 'border-spacing: 0'
 * This is required to allow 'border-radius' on individual cells.
 * 2. Removed 'border-inline' rule; borders will be applied to the cells directly.
 */
.metsol-table-container.alt .metsol-table {
  border-collapse: separate;
  border-spacing: 0;
  /* border-inline: 1px solid #CDCDCD; -- REMOVED */
}

/*
 * 1. Kept background-color.
 * 2. Added 'border-top' to create the top border of the table.
 */
.metsol-table-container.alt .metsol-table th {
  background-color: #EEF7F8;
  border-top: 1px solid #CDCDCD;
}

/*
 * Apply border-radius to the top-left 'th' cell
 * and add the 'border-left'.
 */
.metsol-table-container.alt .metsol-table th:first-child {
  border-top-left-radius: 8px;
  border-left: 1px solid #CDCDCD;
}

/*
 * Apply border-radius to the top-right 'th' cell
 * and add the 'border-right'.
 */
.metsol-table-container.alt .metsol-table th:last-child {
  border-top-right-radius: 8px;
  border-right: 1px solid #CDCDCD;
}

/*
 * Add 'border-left' to all 'td' cells in the first column.
 */
.metsol-table-container.alt .metsol-table td:first-child {
  border-left: 1px solid #CDCDCD;
}

/*
 * Add 'border-right' to all 'td' cells in the last column.
 */
.metsol-table-container.alt .metsol-table td:last-child {
  border-right: 1px solid #CDCDCD;
}

/*
 * This rule (from your original styles) is kept.
 * It provides the bottom border for all cells in the last row.
 */
.metsol-table-container.alt .metsol-table tbody tr:last-child td {
  border-bottom: 1px solid #CDCDCD;
}

/*
 * Apply border-radius to the bottom-left 'td' cell.
 */
.metsol-table-container.alt .metsol-table tbody tr:last-child td:first-child {
  border-bottom-left-radius: 8px;
}

/*
 * Apply border-radius to the bottom-right 'td' cell.
 */
.metsol-table-container.alt .metsol-table tbody tr:last-child td:last-child {
  border-bottom-right-radius: 8px;
}

/* custom tables end */
/* @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-testimonials--metsol .kl-testimonial__quote {
    margin: 0;
}


.kl-testimonials--metsol .kl-testimonial__quote {
    margin: 0;
}

.kl-testimonials--metsol .kl-testimonial__content {
    color: #56706C;
}

.kl-testimonials--metsol .kl-testimonial {
    padding: 24px;
    border: var(--card-border);
    box-shadow: none;
    display: flex;
    flex-direction: column;
}

@media screen and (min-width: 921px) {
.kl-testimonials--metsol .kl-testimonial +  .kl-testimonial {
    margin-left: 24px;
}
}


.kl-testimonials--metsol .kl-testimonial__author   {
    font-family: nunito;
    font-weight: 800;
    color: var(--MS-Dark-Green, #0F312C);
    font-size: 17.669px;
    line-height: 18.672px; 
}

.kl-testimonials--metsol .kl-testimonial__author span   {
    font-family: Lato;
    font-size: 13px;
    font-style: normal;
    font-weight: 800;
    line-height: 1.5;
} 

.kl-testimonials--metsol .kl-testimonial__footer {
    align-items: start;
    margin-top: auto;
}