@import url('./variables.css');

/*HEADER*/
.sticky-bar {
    position: relative;
    z-index: 3;
  }
  
  .sticky-bar.stick {
    -webkit-animation: 700ms ease-in-out 0s normal none 1 running fadeInDown;
    animation: 700ms ease-in-out 0s normal none 1 running fadeInDown;
    /* box-shadow: 0 8px 20px 0 rgba(0, 0, 0, 0.05); */
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 999;
    left: 0;
    transition: all 0.3s ease 0s;
    /* background: #fff; */
    margin-top: 0 !important;
  }
  
  .header-4.stick a.text-white {
    color: rgba(71, 85, 105, var(--tw-text-opacity)) !important;
  }
  
  .header-4.stick .logo-dark {
    display: block;
  }
  
  .header-4.stick .logo-light {
    display: none;
  }
  
  .bg-blueGray-150 {
    background-color: #eff3f9;
  }

  #scrollUp {
    width: 40px;
    height: 40px;
    line-height: 50px;
    cursor: pointer;
    color: #fff;
    right: 30px;
    bottom: 55px;
    border-radius: 5px;
    text-align: center;
    overflow: hidden;
    z-index: 999 !important;
    background-color: #34bf49;
    box-shadow: 0 30px 50px rgba(0, 0, 0, 0.03);
    display: flex;
    align-content: center;
    align-items: center;
    align-self: center;
    justify-content: center;
  }

/*page loading*/
.preloader {
    background-color: #fff;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 999999;
    transition: 0.6s;
    margin: 0 auto;
    align-items: center;
  }
  
  .preloader .logo {
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
  }
  
  .preloader .logo img {
    width: 50px;
  }

  @keyframes jump {
    0% {
      transform: translate3d(0, 15px, 0);
    }
    100% {
      transform: translate3d(0, 0, 0);
    }
  }
  
  .jump {
    transform-origin: 0;
    -webkit-animation: jump 1s linear alternate infinite;
            animation: jump 1s linear alternate infinite;
  }

  /* .rotate-45 {
    transform: rotate(45deg);
} */

.top-banner {
    margin-top: 0 !important;
    background-color: black;
    color: white;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 500;
    overflow: hidden;
    position: relative;
}

.banner-text {
    transition: opacity 0.5s ease-in-out;
}

.fade-out {
    opacity: 0;
}

.fade-in {
    opacity: 1;
}

.tooltip {
    position: relative;
    display: inline-block;
    margin-left: 5px;

}

.tooltip .tooltiptext {
    visibility: hidden;
    width: 200px;
    background-color: black;
    color: #fff;
    text-align: center;
    /* border-radius: 6px; */
    padding: 5px 0;

    /* Position the tooltip */
    position: absolute;
    z-index: 1;
}

.tooltip:hover .tooltiptext {
    visibility: visible;
}

.gx-widget-badge {
    position: absolute;
    /* right: 0; */
    top: 0;
    z-index: 1;
    background-color: #34bf49;
    color: #ffffff;
    padding: 5px 12px;
    -webkit-border-radius: 0 10px 0 10px;
    -moz-border-radius: 0 10px 0 10px;
    border-radius: 0 10px 0 10px;
}

.bg-green{
	--tw-bg-opacity: 1 !important;
	background-color: #34bf49 !important;
}

.btn-accent {
    margin-right: 0.5rem;
    display: flex; /* change */
    align-items: center; /* vertical centering */
    justify-content: center; /* horizontal centering */
    border-width: 1px;
    border-color: #E4E4E4;
    font-size: .75rem;
    font-weight: 600;
    letter-spacing: 0.025em;
    color: black;
    width: 102px;
    height: 44px;
    border-radius: 9999px; /* keep rounded full if needed */
}

.btn-accent:hover{
	--tw-border-opacity: 1;
	background-color: #34bf49;
	/* border-color: rgba(147, 197, 253, var(--tw-border-opacity)); */
	border-color: #34bf49;
	--tw-text-opacity: 1;
	/* color: rgba(29, 78, 216, var(--tw-text-opacity)); */
	color: white;
}
.btn-primary {
    display: flex; /* change */
    align-items: center;
    justify-content: center;
    background-color: #A4DA21;
    font-size: .75rem;
    font-weight: 600;
    letter-spacing: 0.025em;
    color: white;
    width: 123px;
    height: 44px;
    border-radius: 9999px; /* keep rounded full if needed */
}

.btn-primary:hover{
	--tw-bg-opacity: 1;
	/* background-color: rgba(59, 130, 246, var(--tw-bg-opacity)); */
	background-color: white;
    color: #34bf49 !important;
    border: 1px solid #34bf49 !important;
}

.navbar {
    z-index: 999;
    transform-style: preserve-3d;
    background-color: #fff0;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    padding-top: 0;
    display: block;
    position: sticky;
    top: 0;
    overflow: visible
}

.nav-container {
    grid-column-gap: 3.42vw;
    grid-row-gap: 3.42vw;
    background-color: var(--white);
    border: 1px solid #00000014;
    border-radius: 999px;
    justify-content: flex-start;
    align-items: center;
    width: 90vw;
    max-width: 1568px;
    margin-top: 3.42vw;
    margin-left: auto;
    margin-right: auto;
    padding: .928vw .928vw .928vw 3.14vw;
    display: flex;
    position: relative
}

.nav-menu {
    justify-content: flex-start;
    align-items: center;
    margin-right: auto;
    display: flex;
    position: static
}

.nav-menu.background-color_fbfbf9 {
    background-color: #fbfbf9;
    height: 100vh;
    inset: 0%
}

._w-nav-buttons {
    grid-column-gap: .57vw;
    grid-row-gap: .57vw;
    justify-content: flex-start;
    align-items: center;
    display: flex
}

.heading{
    font-size: var(--font-reg-xs-font-size);
    font-weight: var(--font-reg-xs-font-weight);
}

.sub-heading{
    font-size: var(--font-reg-md-font-size);
    font-weight: var(--font-reg-md-font-weight);
}

.sub-heading-3{
    font-size: var(--font-reg-xs-font-size);
    font-weight: var(--font-reg-md-font-weight);
}

 /* default */
/* .desktop{
    display: block;
}
.mobile{
    display: none;
}

@media (max-width: 768px){
    .mobile{
        display: block;
        overflow: hidden;
    }
    .desktop{
        display: none;
    }
} */

/* Mobile first (default styles go here) */
.desktop {
    display: none;
}
.mobile{
    display: block;
    overflow: hidden;
}
.tablet{
    display: none;
}
/* Mobile (>380px and <400px) */
@media (min-width: 400px) {

}

/* Tablet (≥768px) */
@media (min-width: 768px) {
    .tablet{
        display: block;
        overflow: hidden;
    }
    .tablet .margin-center-common{
        /* margin-top: 100px;
        margin-left: 30px; */
        margin-left: 35px;
    }
    .tablet .hero-right-div{
        /* margin-top: 70px;
        margin-left: -100px; */
        min-width: 900px !important;
        margin-left: -220px;
    }
    .tablet .clip-right {
        /* Overshoot a little more to kill the seam on tablets */
        clip-path: polygon(100% 0, 102% 102%, -2% 102%);
      }
    .tablet .hero-inside{
        padding-top: 90px !important;
        max-width: 1500px !important;
    }
    .tablet .hero-heading{
        font-size: var(--font-7xl-font-size);
        font-weight: var(--font-bold-font-weight);
    }
    .mobile{
        display: none;
    }
    .desktop{
        display: none;
    }
  }
  
/* Desktop (≥1024px) */
@media (min-width: 1025px) {
    .desktop{
        display: block;
        overflow: hidden;
    }
    .mobile{
        display: none;
    }
    .tablet{
        display: none;
    }
  }

.cursor-pointer{
	cursor: pointer !important;
}

.transition{
	transition-property: background-color, border-color, color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter !important;
	transition-property: background-color, border-color, color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter !important;
	transition-property: background-color, border-color, color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter !important;
	transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !important;
	transition-duration: 150ms !important;
}

.duration-300{
	transition-duration: 300ms !important;
}

.text-green{
	--tw-text-opacity: 1 !important;
	color: #A4DA21 !important;
}

.navbar-close{
    background-color: #A4DA21;
    width: 49px;
    height: 49px;
}

.header-word{
    /* font-size: var(--font-xl-font-size); */
    font-size: var(--font-lg-font-size);
    font-weight: var(--font-reg-font-weight);
}

.header-button-word{
    font-size: var(--font-lg-font-size);
    font-weight: var(--font-md-font-weight);
}

.header-language-bold-word{
    font-size: var(--font-xl-font-size);
    font-weight: var(--font-semibold-font-weight);
}

.header-language-word{
    font-size: var(--font-xl-font-size);
    font-weight: var(--font-reg-font-weight);
}

.header-mobile-word{
    font-size: var(--font-xl-font-size);
    font-weight: var(--font-md-font-weight);
}

.bottom-logo{
    /* top: 7303px;
    left: 199px; */
    width: 230px;
    height: 46px;
}

.clip-right {
    clip-path: polygon(100% 0, 101% 101%, -1% 101%);
}

.hero-background{
    /* top: 44px;
    left: 0px; */
    /* width: 1280px; */
    /* height: 820px; */
    background: linear-gradient(180deg, #046525 0%, #023313 100%);
    opacity: 1;
}

.hero-outside{
    min-height: 800px !important;
}

.hero-inside{
    padding-top: 100px !important;
    max-width: 1500px !important;
}

.hero-left-div{
    margin-top: 206px;
}

.hero-right-div{
    /* margin-top: 50px;
    margin-left: -150px; */
    /* min-width: 1000px !important;
    margin-left: -150px; */
    min-width: 900px !important;
    margin-left: -170px;
    /* width: 1050px;
    height: 750px; */
}

.hero-mobile-background{
    /* top: 44px;
    left: 0px; */
    /* width: 1280px; */
    height: 950px;
    background: linear-gradient(180deg, #046525 0%, #023313 100%);
    opacity: 1;
}

.hero-mobile-up-div{
    width: 620px;
    height: 459px;
}

.hero-mobile-down-div{
    /* margin-top: 35px; */
    margin-left: 35px;
    margin-right: 35px;
}

.btn-hero {
    margin-right: 21px;
    display: flex;              /* flexbox instead of inline-block */
    align-items: center;        /* vertical centering */
    justify-content: center;    /* horizontal centering */
    border-width: 1px;
    border-color: #E4E4E4;
    letter-spacing: 0.025em;
    color: white;
    width: 175px;
    height: 50px;
    border-radius: 9999px;      /* optional, if you want pill shape */
    font-size: .875rem;         /* 14px – adjust as needed */
    font-weight: 600;           /* semi-bold */
}

.hero-redirect{
	margin-right: 0.5rem;
	display: inline-block;
    color: white;
}

.hero-heading{
    font-size: var(--font-8xl-font-size);
    font-weight: var(--font-bold-font-weight);
}

.hero-sub-heading{
    font-size: var(--font-2xl-font-size);
    font-weight: var(--font-reg-font-weight);
}

.hero-word{
    font-size: var(--font-lg-font-size);
    font-weight: var(--font-md-font-weight);
}

.hero-mobile-heading{
    font-size: var(--font-6xl-font-size);
    font-weight: var(--font-bold-font-weight);
}

.hero-mobile-sub-heading{
    font-size: var(--font-2xl-font-size);
    font-weight: var(--font-reg-font-weight);
}

.hero-mobile-word{
    font-size: var(--font-lg-font-size);
    font-weight: var(--font-md-font-weight);
}

/* Give each slide a fixed width so variableWidth works */
.testimonial-slider .slick-card {
    width: 360px;            /* desktop card width */
    margin-right: 24px;      /* gap between cards */
  }
  
  /* Mobile tweak: narrower cards so a 4th peeks in nicely */
  @media (max-width: 768px) {
    .testimonial-slider .slick-card {
      width: 350px;
      margin-right: 60px;
    }
  }
  
  /* Hide Slick default arrows (we use custom) */
  .testimonial-slider .slick-arrow { display: none !important; }
  
  /* Make track rendering smoother */
  .testimonial-slider .slick-track {
    will-change: transform;
  }
  
  /* Optional: soften focus outlines on mouse click */
  .testimonial-slider *:focus { outline: none; }

.desktop-call-to-action{
    background-image: url(../imgs/elements/c-banner.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    /* height: 450px; */
}

.desktop-call-to-action-heading{
    font-size: var(--font-6xl-font-size);
    font-weight: var(--font-semibold-font-weight);
    /* padding-top: 53px; */
    /* width: 709px;
    height: 132px; */
}

.desktop-call-to-action-sub-heading{
    font-size: var(--font-2xl-font-size);
    font-weight: var(--font-reg-font-weight);
}

.desktop-call-to-action-button{
    font-size: var(--font-2xl-font-size) !important;
    font-weight: var(--font-md-font-weight) !important;
}

.desktop-call-to-action-button-description{
    font-size: var(--font-md-font-size);
    font-style: var(--font-italic-font-style);
}

.call-to-action-button{
	display: flex;
    align-items: center;
    justify-content: center;
	--tw-bg-opacity: 1;
	background-color: #A4DA21;
	padding-left: 1rem;
	padding-right: 1rem;
	padding-top: 0.75rem;
	padding-bottom: 0.75rem;
	font-size: .75rem;
	font-weight: 600;
	line-height: 1;
	letter-spacing: 0.025em;
	--tw-text-opacity: 1;
	color: rgba(255, 255, 255, var(--tw-text-opacity));
    width: 162px;
    height: 50px;
}

.mobile-call-to-action{
    background-image: url(../imgs/elements/c-banner.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    height: 520px;
}

.mobile-call-to-action-heading{
    font-size: var(--font-4xl-font-size);
    font-weight: var(--font-semibold-font-weight);
    padding-top: 46px;
}

.mobile-call-to-action-sub-heading{
    font-size: var(--font-2xl-font-size);
    font-weight: var(--font-reg-font-weight);
}

.mobile-call-to-action-button{
    font-size: var(--font-lg-font-size);
    font-weight: var(--font-md-font-weight);
}

.mobile-call-to-action-button-description{
    font-size: var(--font-md-font-size);
    font-style: var(--font-italic-font-style);
}

.margin-center-common{
    /* margin-left: auto; */
    /* margin-left: 120px; */
    margin-left: 150px;

}

.branding-overlap{
    background-color: #F8FFE9;
    border-color: #A4DA21;
    height: 35px;
    font-size: var(--font-md-font-size);
    font-weight: var(--font-reg-font-weight);
}

.margin-left-right-common{
    margin-left: 200px;
    margin-right: 200px;
}

.trust{
    background-color: #F8FFE9;
    border-color: #A4DA21;
    height: 40px;
    width: 350px;
}

.trust-mobile{
    background-color: #F8FFE9;
    border-color: #A4DA21;
}

.trust-word{
    color: #046525;
    font-size: var(--font-md-font-size);
    font-weight: var(--font-bold-font-weight);
}

.trust-heading{
    font-size: var(--font-7xl-font-size);
    font-weight: var(--font-bold-font-weight);
}

.trust-sub-heading{
    font-size: var(--font-3xl-font-size);
    font-style: var(--font-italic-font-style);
}

.trust-description{
    font-size: var(--font-2xl-font-size);
    font-weight: var(--font-reg-font-weight);
}

.trust-point-heading{
    font-size: var(--font-2xl-font-size);
    font-weight: var(--font-bold-font-weight);
}

.trust-point-list{
    font-size: var(--font-2xl-font-size);
    font-weight: var(--font-reg-font-weight);
}

.trust-redirect-word{
    font-size: var(--font-lg-font-size);
    font-weight: var(--font-md-font-weight);
}

.trust-tablet-word{
    color: #046525;
    font-size: var(--font-md-font-size);
    font-weight: var(--font-bold-font-weight);
}

.trust-tablet-heading{
    font-size: var(--font-5xl-font-size);
    font-weight: var(--font-bold-font-weight);
}

.trust-tablet-sub-heading{
    font-size: var(--font-xl-font-size);
    font-style: var(--font-italic-font-style);
}

.trust-tablet-description{
    font-size: var(--font-lg-font-size);
    font-weight: var(--font-reg-font-weight);
}

.trust-tablet-point-heading{
    font-size: var(--font-lg-font-size);
    font-weight: var(--font-bold-font-weight);
}

.trust-tablet-point-list{
    font-size: var(--font-lg-font-size);
    font-weight: var(--font-reg-font-weight);
}

.trust-tablet-redirect-word{
    font-size: var(--font-md-font-size);
    font-weight: var(--font-md-font-weight);
}

.product-heading{
    font-size: var(--font-7xl-font-size);
    font-weight: var(--font-bold-font-weight);
    width: 663px;
}

.product-sub-heading{
    font-size: var(--font-2xl-font-size);
    font-weight: var(--font-reg-font-weight);
}

.product-title{
    font-size: var(--font-3xl-font-size);
    font-weight: var(--font-semibold-font-weight);
}

.product-description{
    font-size: var(--font-2xl-font-size);
    font-weight: var(--font-md-font-weight);
}

.feature-highlight-image{
    width: 536px;
    height: 521px;
}

.feature-highlight-word{
    /* width: 180px; */
    height: 61px;
    font-size: var(--font-2xl-font-size);
    font-weight: var(--font-reg-font-weight);
}

.feature-highligh-tab{
    font-size: var(--font-sm-font-size);
    font-weight: var(--font-md-font-weight);
    background: linear-gradient(180deg,#FFDD00 0%, #E19600 100%);
    padding: 5px 10px;
}

.product-mobile-heading{
    font-size: var(--font-6xl-font-size);
    font-weight: var(--font-bold-font-weight);
    /* width: 663px; */
}

.feature-highlight-mobile-word{
    width: 180px;
    height: 61px;
    font-size: var(--font-xl-font-size);
    font-weight: var(--font-reg-font-weight);
}

.feature-highligh-mobile-tab{
    font-size: var(--font-sm-font-size);
    font-weight: var(--font-md-font-weight);
    background: linear-gradient(180deg,#FFDD00 0%, #E19600 100%);
    padding: 5px 10px;
}

.product-mobile-heading{
    font-size: var(--font-6xl-font-size);
    font-weight: var(--font-bold-font-weight);
    /* width: 663px; */
}

.feature-highlight-tablet-word{
    width: 380px;
    /* height: 61px; */
    font-size: var(--font-4xl-font-size);
    font-weight: var(--font-reg-font-weight);
}

.feature-highligh-tablet-tab{
    font-size: var(--font-sm-font-size);
    font-weight: var(--font-md-font-weight);
    background: linear-gradient(180deg,#FFDD00 0%, #E19600 100%);
    padding: 10px;
}

.header-outside{
    text-align: center;
    justify-items: center;
    width: 90vw;
    /* overflow: visible !important; */
}

.header-inside{
    max-width: 1300px !important;
    text-align: center;
    border-radius: 50px;
    
    padding: 5px 25px;
    height: 90px;
    /* width: 1000px !important; */
    /* padding: 20px 50px;
    width: 1300px !important; */
    /* overflow: visible !important; */
}

.header-logo{
    margin-right: 40px;
}

.header-toc{
    padding: 0px 15px !important;
}

.testimonial-background{
    background-color: #F8F8F8;
}

.testimonial-icon {
    border: 1px solid #EBEBEB;
}

.testimonial-heading{
    font-size: var(--font-7xl-font-size);
    font-weight: var(--font-bold-font-weight);
}

.testimonial-sub-heading{
    font-size: var(--font-lg-font-size);
    font-style: var(--font-italic-font-style);
    color: #A4DA21;
}

.testimonial-description{
    font-size: var(--font-2xl-font-size);
    font-weight: var(--font-reg-font-weight);
    opacity: 70%;
}

.testimonial-card-title{
    font-size: var(--font-2xl-font-size);
    font-weight: var(--font-bold-font-weight);
}

.testimonial-card-description{
    font-size: var(--font-lg-font-size);
    font-weight: var(--font-reg-font-weight);
}

.faq-heading{
    font-size: var(--font-6xl-font-size);
    font-weight: var(--font-bold-font-weight);
}

.faq-question{
    font-size: var(--font-2xl-font-size);
    font-weight: var(--font-reg-font-weight);
}

.faq-answer{
    font-size: var(--font-2xl-font-size);
    font-weight: var(--font-reg-font-weight);
    opacity: 70%;
}

.faq-border-line{
    border-bottom-color: #E4E4E4;
}

.plan-card{ 
    height: 700px !important;
}

/* Give each slide a fixed width so variableWidth works */
.pricing-slider .slick-price-card {
    width: 400px;            /* desktop card width */
    margin-right: 24px;      /* gap between cards */
  }
  
  /* Mobile tweak: narrower cards so a 4th peeks in nicely */
  @media (max-width: 768px) {
    .pricing-slider .slick-price-card {
      width: 350px;
      margin-right: 25px;
    }
  }
  
  /* Hide Slick default arrows (we use custom) */
  .pricing-slider .slick-arrow { display: none !important; }
  
  /* Make track rendering smoother */
  .pricing-slider .slick-track {
    will-change: transform;
  }
  
  /* Optional: soften focus outlines on mouse click */
  .pricing-slider *:focus { outline: none; }

  .plan-enterprise{
    background-image: url(../imgs/elements/enterprise.png);
    background-repeat: round;
  }

  .plan-starter{
    background-image: url(../imgs/elements/starter.png);
  }

  .plan-premium{
    background-image: url(../imgs/elements/premium.png);
  }

  .plan-coming-soon{
    background-image: url(../imgs/elements/coming-soon.png);
  }
  .plan-button {
    background-color: #A4DA21;
    width: 232px;
    height: 50px;
    display: flex;               /* flexbox instead of inline-block */
    align-items: center;         /* vertical centering */
    justify-content: center;     /* horizontal centering */
    font-size: var(--font-lg-font-size);
    font-weight: var(--font-md-font-weight);
    letter-spacing: 0.025em;
    color: rgba(255, 255, 255, var(--tw-text-opacity));
    border-radius: 9999px;       /* optional pill style */
}

  .plan-title{
    font-size: var(--font-3xl-font-size);
    font-weight: var(--font-bold-font-weight);
  }

  .plan-enterprise-sub-title{
    font-size: var(--font-lg-font-size);
    font-weight: var(--font-bold-font-weight);
  }

  .plan-enterprise-description{
    font-size: var(--font-2xl-font-size);
    font-weight: var(--font-reg-font-weight);
  }

  .plan-feature{
    font-size: var(--font-lg-font-size);
    font-weight: var(--font-md-font-weight);
  }

  .plan-premium-tab{
    font-size: var(--font-xs-font-size);
    font-weight: var(--font-md-font-weight);
    background: linear-gradient(180deg,#FFDD00 0%, #E19600 100%);
}

.plan-billed-yearly-word{
    font-size: var(--font-md-font-size);
    font-style: var(--font-italic-font-style);
}

.plan-qr-code-template-word{
    font-size: var(--font-sm-font-size);
    font-style: var(--font-italic-font-style);
}

.plan-premium-deal-button {
    background-color: #A4DA21;
    width: 135px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--font-lg-font-size);
    font-weight: var(--font-md-font-weight);
    letter-spacing: 0.025em;
    color: rgba(255, 255, 255, var(--tw-text-opacity));
    border-radius: 9999px;
}


  .plan-premium-deal-countdown{
    background-color: #E6FFAB;
    width: 115px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
	--tw-bg-opacity: 1;
	padding-left: 0.75rem;
	padding-right: 0.75rem;
	padding-top: 0.75rem;
	padding-bottom: 0.75rem;
    border-color: #A4DA21;
	font-size: var(--font-lg-font-size);
    font-weight: var(--font-md-font-weight);
	line-height: 1;
	letter-spacing: 0.025em;
	--tw-text-opacity: 1;
	color: black;
  }

  .testimonial-page-single-layout{
    height: 300px;
  }

  .footer-title{
    font-size: var(--font-lg-font-size);
    font-weight: var(--font-bold-font-weight);
  }

  .footer-description{
    font-size: var(--font-lg-font-size);
    font-weight: var(--font-reg-font-weight);
  }

  .footer-powered-by-title{
    font-size: var(--font-lg-font-size);
    font-weight: var(--font-reg-font-weight);
  }

  .footer-mobile-powered-by-title{
    font-size: var(--font-md-font-size);
    font-weight: var(--font-reg-font-weight);
  }

  .footer-point{
    font-size: var(--font-lg-font-size);
    font-weight: var(--font-reg-font-weight);
  }

  .footer-mobile-point{
    font-size: var(--font-md-font-size);
    font-weight: var(--font-reg-font-weight);
  }

  .connection-platform-point-background{
    background: transparent linear-gradient(180deg, #00000000 0%, #000000 100%);
    opacity: 1;
}

.pill-toggle-word{
    font-size: var(--font-lg-font-size);
    font-weight: var(--font-md-font-weight);
  }

.truncate-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.truncate-3 {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.blog-share-modal-background{
    background: transparent linear-gradient(10deg, #00000000 0%, #000000 100%);
    opacity: 1;
}

.blog-share-modal-close{
    width: 35px;
    height: 35px;
}

.prose ul {
  list-style-type: disc;
  margin-left: 1.5rem;
  padding-left: 1rem;
}
.prose ol {
  list-style-type: decimal;
  margin-left: 1.5rem;
  padding-left: 1rem;
}
.prose li {
  margin-top: 0.25rem;
  margin-bottom: 0.25rem;
}
.prose h1, .prose h2, .prose h3, .prose h4 {
  margin-top: 1.5rem;
  margin-bottom: 1rem;
  font-weight: 700;
}
.prose p {
  margin-bottom: 1rem;
}

.blog-clickable-image {
    top: -10px;
    right: -10px;
    background-color: white !important;
    border-radius: 50%;
    color: black;
}