/* Components CSS */




.fx-pagination .splide__pagination{
  bottom: -46px;
}

.fx-pagination .splide__pagination__page{
  height: 4px;
  width: 64px;
  border-radius:100px;
  background-color:#e9eaeb;
}

.fx-pagination .splide__pagination__page.is-active {
  background-color:#025AEC; 
  transform: scale(1);
  opacity:1;
}






.fx-card{
  border: 1px solid var(--neutral-300);
  border-radius: 24px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  height: 100%;
}

.fx-card-img{
  display: block;
}

.fx-card-img img{
  width: 100%;
  height: 315px;
  object-fit: cover;
}

.fx-card-content{
  padding: 24px;
  display: flex;
  flex-direction: column;
  height: 100%;
}

.fx-card-batchs{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-bottom: 34px;
}

.fx-card-batchs a{

  padding: 2px 10px;
  border-radius: 16px;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.5;
}

.fx-card-info{
  margin-bottom: 16px;
  font-size: 14px;
  font-weight: 600;
}

.fx-card-info a,
.fx-card-info span{
  color: var(--primary);
}

.fx-card h3.fx-card-heading{
  font-size: 24px;
  margin-bottom: 16px;
  color: var(--neutral-950);
}

.fx-card-richtext{
  margin-bottom: 32px;
}

.fx-card-link-label{
  margin-top:auto;
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--primary);
  font-weight: 600;
}

/* Slider arrow */

.fx-slider-arrow .splide__arrow{
  background-color:#025AEC;
  border-radius: 0;
  padding: 0;
  height: auto;
  --arrow-box: 52px;
  width: var(--arrow-box);
  border-radius: 8px;
  aspect-ratio: 1;
  opacity:100%;
  transition: all var(--transition-duration) ease-in-out;
}

.fx-slider-arrow .splide__arrow--prev{
  left: -16px;
}

.fx-slider-arrow .splide__arrow--next {
  right: -16px;
}

.fx-slider-arrow .splide__arrow svg{
  fill:var(--white);
  transition: all var(--transition-duration) ease-in-out;
}

.fx-slider-arrow .splide__arrow:disabled svg{
  fill:var(--neutral-950);
}

[data-theme="light"] .fx-slider-arrow .splide__arrow:disabled{
  background-color: rgba(245, 245, 245,100%);;
  opacity:100%;
}

[data-theme="dark"] .fx-slider-arrow .splide__arrow:disabled{
  background-color: rgba(164, 167, 174,100%);;
  opacity:100%;
}

/* Scroll Bar Css */

/* width */
::-webkit-scrollbar {
  width: 10px;
}

/* Track */
::-webkit-scrollbar-track {
  background: var(--neutral-300);
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: var(--primary);
}

.theme-batch a{
  background-color: var(--primary-100);
  color: var(--primary);
}
/* 
.theme-batch a:nth-child(2n+2) {
background-color: #F9F5FF;
color: #6941C6;
}

.theme-batch a:nth-child(3n+3) {
background-color: #EEF4FF;
color: #3538CD;
}

.theme-batch a:nth-child(4n+4) {
background-color: #FFF6ED;
color: #C4320A;
}
*/
@media only screen and (max-width: 767.90px) {
  .fx-card-content {
    height: fit-content;
  }
}

@media only screen and (max-width: 639.90px) {
  .fx-slider-arrow .splide__arrow{
    --arrow-box: 35px;
    width: var(--arrow-box);
  }
  .fx-card-img img {
    height: 255px;
  }

  .fx-card-richtext {
    margin-bottom: 22px;
  }

  .fx-card-batchs {
    margin-bottom: 22px;  
  }
}
/* @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    */
/*****************************************/
dth:100%;
}
/* @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    */
/*****************************************/
/* @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    */
/*****************************************/
/********************** Form *****************************/














/***************************************************************/
[data-theme="light"] {
  
  
  
  
}

[data-theme="dark"] {
  
  
  
}

.hs_cos_wrapper{
  width:100%;
}

form{
  width:100%;
}

.form-columns-2 {
  display: flex;
  align-items: center;
  gap: 24px;
}

fieldset.form-columns-1 textarea.hs-input {
  min-height: 120px;
}

.hs-form-private fieldset:not(:first-child) {
  margin-top: 24px;
}

form li {
  list-style: none;
}

fieldset{
  max-width:100% !important;
}

.hs-form-field input, .hs-form-field textarea {
  padding: 16px;

  border-radius: 8px ;
  width:100%;
}

[data-theme="light"] .hs-form-field input,[data-theme="light"] .hs-form-field textarea{
  border: 1px solid rgba(233, 234, 235, 1.0);
  background-color:rgba(255, 255, 255, 1.0);
  color:rgba(65, 70, 81, 1.0);
}

[data-theme="dark"] .hs-form-field input,[data-theme="dark"] .hs-form-field textarea{
  color:rgba(255, 255, 255, 1.0);
  border: 1px solid rgba(65, 70, 81, 1.0);
  background-color:rgba(0, 0, 0, 1.0);
}

fieldset.form-columns-2 .input,fieldset.form-columns-1 .input{
  margin:0px !important;
}

.hs-form-field > label {
  display: inline-block;
  color:#181d27;
  font-family: var(--heading-font);
  font-size: 16px;
  line-height: 1.3;
  text-transform: capitalize;
  margin-bottom: 8px;
}

form .hs-form-field input:not([type="checkbox"]),
form .hs-form-field textarea{
  width: 100% !important;
}

.hs-form-field input:placeholder,
.hs-form-field textarea:placeholder{
  font-family: var(--heading-font);
  color:rgba(113, 118, 128, 1.0);;
  letter-spacing: 0.2px;
}

.hs-form-field input:focus,
.hs-form-field input:focus-visible,
.hs-form-field textarea:focus,
.hs-form-field textarea:focus-visible{
  outline:none;
}

.hs-form-booleancheckbox label{
  display: flex;
  align-items: center;
  gap: 10px;
}

.hs-form-field input[type=checkbox] ,.hs-form-field input[type=radio] {
  appearance: none;
  padding: 8px;
  background-color:rgba(255, 255, 255, 0.0);;
  border-radius:4px;
  transition: all var(--transition-duration) ease-in-out;
}

.hs-form-field input[type=checkbox]:checked {
  content: "";
  background: url(data:image/svg+xml,<svg data-slot="icon" fill="none" stroke-width="1.5" stroke="#ffffff" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" d="m4.5 12.75 6 6 9-13.5"></path></svg>);
  background-color: var(--primary);
  background-repeat: no-repeat;
  background-position: center;
  z-index:9;
  background-size: 90%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.hs-error-msgs li{
  font-size:12px;
  margin-top: 4px;
  color:#f04438;
}

.form-columns-2{
  display: flex;
  align-items: center;
  gap: 24px;
}

.hs_submit{
  margin-top:40px; 
}
