/* --- Theme base styles --- */

/* --- Font Family --- */
/* Inter */
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');



/* --- Generic
This is where reset, normalize & box-sizing styles go.
*/
*, *:before, *:after {
  box-sizing: border-box;
}
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
========================================================================== */

/**
* 1. Correct the line height in all browsers.
* 2. Prevent adjustments of font size after orientation changes in iOS.
*/

html {
  line-height: 1.15; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
}

/* Sections
========================================================================== */

/**
* Remove the margin in all browsers.
*/

body {
  margin: 0;
}

/**
* Correct the font size and margin on `h1` elements within `section` and
* `article` contexts in Chrome, Firefox, and Safari.
*/

h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/* Grouping content
========================================================================== */

/**
* Add the correct box sizing in Firefox.
*/

hr {
  box-sizing: content-box;
  height: 0;
}

/**
* 1. Correct the inheritance and scaling of font size in all browsers.
* 2. Correct the odd `em` font sizing in all browsers.
*/

pre {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/* Text-level semantics
========================================================================== */

/**
* 1. Remove the bottom border in Chrome 57-
* 2. Add the correct text decoration in Chrome, Edge, Opera, and Safari.
*/

abbr[title] {
  border-bottom: none; /* 1 */
  text-decoration: underline; /* 2 */
  text-decoration: underline dotted; /* 2 */
}

/**
* Add the correct font weight in Chrome, Edge, and Safari.
*/

b,
strong {
  font-weight: bolder;
}

/**
* 1. Correct the inheritance and scaling of font size in all browsers.
* 2. Correct the odd `em` font sizing in all browsers.
*/

code,
kbd,
samp {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/**
* Add the correct font size in all browsers.
*/

small {
  font-size: 80%;
}

/**
* Prevent `sub` and `sup` elements from affecting the line height in
* all browsers.
*/

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* Forms
========================================================================== */

/**
* 1. Change the font styles in all browsers.
* 2. Remove the margin in Firefox and Safari.
*/

button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-size: 100%; /* 1 */
  line-height: 1.15; /* 1 */
  margin: 0; /* 2 */
}

/**
* Remove the inheritance of text transform in Edge and Firefox.
* 1. Remove the inheritance of text transform in Firefox.
*/

button,
select { /* 1 */
  text-transform: none;
}

/**
* Correct the inability to style clickable types in iOS and Safari.
*/

button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
}

/**
* Remove the inner border and padding in Firefox.
*/

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
* Restore the focus styles unset by the previous rule.
*/

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/**
* Correct the padding in Firefox.
*/

fieldset {
  padding: 0.35em 0.75em 0.625em;
}

/**
* Remove the padding so developers are not caught out when they zero out `fieldset` elements in all browsers.
*/

legend {
  padding: 0;
}

/**
* Add the correct vertical alignment in Chrome, Firefox, and Opera.
*/

progress {
  vertical-align: baseline;
}

/**
* Correct the cursor style of increment and decrement buttons in Chrome.
*/

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

/**
* 1. Correct the odd appearance in Chrome and Safari.
* 2. Correct the outline style in Safari.
*/

[type="search"] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/**
* Remove the inner padding in Chrome and Safari on macOS.
*/

[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
* 1. Correct the inability to style clickable types in iOS and Safari.
* 2. Change font properties to `inherit` in Safari.
*/

::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/* Interactive
========================================================================== */

/*
* Add the correct display in Edge and Firefox.
*/

details {
  display: block;
}

/*
* Add the correct display in all browsers.
*/

summary {
  display: list-item;
}

/* --- Objects
Non-cosmetic design patterns including grid and layout classes)
*/


/* CSS variables */

:root {
  --column-gap: 2.13%;
  --column-width-multiplier: 8.333;
}

/* Mobile layout */

.row-fluid {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}


.row-fluid .span1,
.row-fluid .span2,
.row-fluid .span3,
.row-fluid .span4,
.row-fluid .span5,
.row-fluid .span6,
.row-fluid .span7,
.row-fluid .span8,
.row-fluid .span9,
.row-fluid .span10,
.row-fluid .span11,
.row-fluid .span12{
/*   min-height: 1px; */
  width: 100%;
}

/* Desktop layout */

@media (min-width: 768px) {
  .row-fluid {
    flex-wrap: nowrap;
    justify-content: space-between;
  }

  
  .row-fluid .span1 {
    width: calc(var(--column-width-multiplier) * 1% * 1 - var(--column-gap) * (11 * var(--column-width-multiplier) / 100));
  }
  
  .row-fluid .span2 {
    width: calc(var(--column-width-multiplier) * 1% * 2 - var(--column-gap) * (10 * var(--column-width-multiplier) / 100));
  }
  
  .row-fluid .span3 {
    width: calc(var(--column-width-multiplier) * 1% * 3 - var(--column-gap) * (9 * var(--column-width-multiplier) / 100));
  }
  
  .row-fluid .span4 {
    width: calc(var(--column-width-multiplier) * 1% * 4 - var(--column-gap) * (8 * var(--column-width-multiplier) / 100));
  }
  
  .row-fluid .span5 {
    width: calc(var(--column-width-multiplier) * 1% * 5 - var(--column-gap) * (7 * var(--column-width-multiplier) / 100));
  }
  
  .row-fluid .span6 {
    width: calc(var(--column-width-multiplier) * 1% * 6 - var(--column-gap) * (6 * var(--column-width-multiplier) / 100));
  }
  
  .row-fluid .span7 {
    width: calc(var(--column-width-multiplier) * 1% * 7 - var(--column-gap) * (5 * var(--column-width-multiplier) / 100));
  }
  
  .row-fluid .span8 {
    width: calc(var(--column-width-multiplier) * 1% * 8 - var(--column-gap) * (4 * var(--column-width-multiplier) / 100));
  }
  
  .row-fluid .span9 {
    width: calc(var(--column-width-multiplier) * 1% * 9 - var(--column-gap) * (3 * var(--column-width-multiplier) / 100));
  }
  
  .row-fluid .span10 {
    width: calc(var(--column-width-multiplier) * 1% * 10 - var(--column-gap) * (2 * var(--column-width-multiplier) / 100));
  }
  
  .row-fluid .span11 {
    width: calc(var(--column-width-multiplier) * 1% * 11 - var(--column-gap) * (1 * var(--column-width-multiplier) / 100));
  }
  
}
/* --- Unknown but removes bottom invisible padding */
.body-wrapper {
  height: 100px;
}


.content-wrapper {
  margin: 0;
  padding: 0;
}

@media screen and (min-width: 1380px) {
  .content-wrapper {
    padding: 0;
  }
}

.dnd-section > .row-fluid {
  margin: 0 auto;
}

.dnd-section .dnd-column {
  padding: 0;
}

@media (max-width: 767px) {
  .dnd-section .dnd-column {
    padding: 0;
  }
}

/* --- Global components --- */

/* @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    */
/*****************************************/



.p-b-1 {
  display: inline-block;
  padding: 12px 24px;
  font-family: var(--button-1-desktop-large-font-family);
  font-weight: var(--button-1-desktop-large-font-weight);
  font-size: var(--button-1-desktop-large-font-size);
  line-height: var(--button-1-desktop-large-line-height);
  letter-spacing: var(--button-1-desktop-large-letter-spacing);
  border-radius: 4px;
  background-color: var(--p-b-d);
  color: var(--w-t);
  text-align: center;
  cursor: pointer;
  transition: all .2s ease;
}

.p-b-1:disabled {
  background-color:  var(--border);
}

.p-b-1:hover { 
  background-color:  var(--p-b-h);
}

.p-b-2 {
  display: inline-block;
  padding: 12px 24px;
  font-family: var(--button-1-desktop-large-font-family);
  font-weight: var(--button-1-desktop-large-font-weight);
  font-size: var(--button-1-desktop-large-font-size);
  line-height: var(--button-1-desktop-large-line-height);
  letter-spacing: var(--button-1-desktop-large-letter-spacing);
  border-radius: 4px;
  background-color:  var(--p-b-h);
  color: var(--w-t);
  text-align: center;
  cursor: pointer;
  transition: all .2s ease;
  border: 1px solid transparent;
}

.p-b-2:disabled {
  background-color:  var(--border);
}

.p-b-2:hover { 
  background-color:  transparent;
  border: 1px solid var(--w-t);
}

.p-b-3 {
  display: inline-flex;
  align-items: center;
  gap: 10px; /* Spacing between text and icon */
  padding: 12px 24px;
  font-family: var(--button-1-desktop-large-font-family);
  font-weight: var(--button-1-desktop-large-font-weight);
  font-size: var(--button-1-desktop-large-font-size);
  line-height: var(--button-1-desktop-large-line-height);
  letter-spacing: var(--button-1-desktop-large-letter-spacing);
  border-radius: 4px;
  background-color:  var(--p-b-d);
  color: var(--w-t);
  text-align: center;
  cursor: pointer;
  transition: all .2s ease;
}

.p-b-3::before {
  content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><g clip-path="url(%23clip0)"><path d="M12 0C5.37258 0 0 5.37258 0 12C0 18.6274 5.37258 24 12 24C18.6274 24 24 18.6274 24 12C24 5.37258 18.6274 0 12 0ZM8.72123 17.2193V6.7807L17.7613 12L8.72123 17.2193Z" fill="white"/></g><defs><clipPath id="clip0"><rect width="24" height="24" fill="white"/></clipPath></defs></svg>');
  margin-top: 5px;
  width: 1.5em;
  height: 1.5em;
  display: flex;
  justify-content: center;
  align-items: center;
}

.p-b-3:disabled {
  background-color:  var(--border);
}

.p-b-3:hover { 
  background-color:  var(--p-b-h);
}

.s-b {
  display: inline-block;
  padding: 12px 24px;
  font-family: var(--button-1-desktop-large-font-family);
  font-weight: var(--button-1-desktop-large-font-weight);
  font-size: var(--button-1-desktop-large-font-size);
  line-height: var(--button-1-desktop-large-line-height);
  letter-spacing: var(--button-1-desktop-large-letter-spacing);
  border-radius: 4px;
  background-color: transparent;
  color: var(--s-b-d);
  text-align: center;
  cursor: pointer;
  transition: all .2s ease;
  border: 1px solid var(--s-b-d);
}

.s-b:disabled {
  background-color:  var(--border);
}

.s-b:hover { 
  color: var(--w-t);
  background-color:  var(--p-b-h);
  border: 1px solid transparent;
}

.link {
  font-family: var(--button-1-desktop-large-font-family);
  font-weight: var(--button-1-desktop-large-font-weight);
  font-size: var(--button-1-desktop-large-font-size);
  line-height: var(--button-1-desktop-large-line-height);
  letter-spacing: var(--button-1-desktop-large-letter-spacing);
  color: var(--l-d);
  cursor: pointer;
  position: relative;
  text-decoration: none;
  /* Remove default underline */
}

.link::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  height: 2px; /* Thickness of the border */
  width: 0;
  background-color: var(--l-d); /* Use same color as text or customize */
  transition: width 0.3s ease;
}

.link:hover::before {
  width: 100%;
}

.link::after {
  content: url('data:image/svg+xml;utf8,<svg width="20" height="21" viewBox="0 0 20 21" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(%23clip0_5817_15621)"><path d="M3.125 10.5H16.875M16.875 10.5L11.25 4.875M16.875 10.5L11.25 16.125" stroke="%233B7A57" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></g><defs><clipPath id="clip0_5817_15621"><rect width="20" height="20" fill="white" transform="translate(0 0.5)"/></clipPath></defs></svg>');
  position: absolute;
  right: -25px;
  top: 50%;
  transform: translateY(-50%);
  width: 20px;
  height: 21px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
}

.link:hover::after {
  opacity: 1;
}



.btn_default-icon {
  display: inline-flex;
  align-items: center;
  gap: 0.75em; /* Spacing between text and icon */
  padding: 0.9375em 1.5em 1.0625em 1.5em; /* Padding around the button */
  justify-content: center;
  border-radius: 12px; /* Rounded corners */
  border: 0px;
  background: var(--primary); /* Primary background color */
  color: var(--white); /* Text color */
  transition: all 150ms ease-out; /* Smooth transition on hover */
  text-decoration: none; /* Remove underline */
  cursor: pointer;
}

.btn_default-icon::after {
  content: url('https://1682788.fs1.hubspotusercontent-na1.net/hubfs/1682788/2024%20Files%20%28Sorted%29/Swept%20Website/Download%20Icon.svg');
  width: 1.1875em;
  height: 1em;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: all 150ms ease-out;
}

.btn_default-icon:hover {
  background: var(--blue); /* Change background color on hover */
  cursor: pointer; /* Pointer cursor on hover */
}


@media (max-width: 768px) {

  .p-b-1 {
    display: block;
    padding: 10px 24px;
    font-family: var(--button-1-mobile-font-family);
    font-weight: var(--button-1-mobile-font-weight);
    font-size: var(--button-1-mobile-font-size);
    line-height: var(--button-1-mobile-line-height);
    letter-spacing: var(--button-1-mobile-letter-spacing);
  }

  .p-b-2 {
    display: block;
    padding: 10px 24px;
    font-weight: var(--button-1-mobile-font-weight);
    font-size: var(--button-1-mobile-font-size);
    line-height: var(--button-1-mobile-line-height);
    letter-spacing: var(--button-1-mobile-letter-spacing);
  }

  .p-b-3 {
    display: flex;
    justify-content: center;
    padding: 10px 24px;
    font-weight: var(--button-1-mobile-font-weight);
    font-size: var(--button-1-mobile-font-size);
    line-height: var(--button-1-mobile-line-height);
    letter-spacing: var(--button-1-mobile-letter-spacing);
  }

  .s-b {
    display: block;
    padding: 10px 24px;
    font-weight: var(--button-1-mobile-font-weight);
    font-size: var(--button-1-mobile-font-size);
    line-height: var(--button-1-mobile-line-height);
    letter-spacing: var(--button-1-mobile-letter-spacing);
  }

}
/* @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    */
/*****************************************/


:root {

  --p-c: #52B2E2;
  --s-c: #000033;


  --l-b: #FFFFFF;
  --l-a-b-1: #F4F7FA;
  --l-a-b-2: #E8F2FC;
  --h-c-b: #FB5E34;
  --s-b: #F6FAF4;
  --a-b: #FCEEEE;
  --n-b: #FFFDED;


  --b-b: #CBD5E1;
  --b-l: rgba(203, 213, 225, .5);
  --b-n: #FEF08A;  

  --p-b-d: #52B2E2;
  --p-b-h: #000033;

  --s-b-d: #52B2E2;
  --s-b-h: #000033;

  --l-d: #52B2E2;

  --d-t-1: #000033;
  --d-t-2: #475569;
  --d-t-3: #61748F;
  --d-t-s: #334155;
  --w-t: #FFFFFF;
  --s-t: #437F15;
  --a-t: #D62424;
  
  --ds1: 0px 10px 50px rgba(251, 94, 52, 0.25);
  --ds2: 0px 10px 40px rgba(15, 15, 15, 0.075);
  --d-s-1: 0px 1px 4px rgba(15, 23, 42, 0.04);;

}
/* @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('https://fonts.googleapis.com/css2?family=Nunito+Sans:ital,opsz,wght@0,6..12,200..1000;1,6..12,200..1000&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,100..900;1,100..900&display=swap');



a {
  text-decoration: none;
}


p,h1,h2,h3,h4,h5,h6 {
  margin: 0;
}


:root {
  /* Desktop Large */
  --h1-desktop-large-font-family: 'Nunito Sans', sans-serif;
  --h1-desktop-large-font-weight: 700; /* Bold */
  --h1-desktop-large-font-size: 3.125em;
  --h1-desktop-large-line-height: 120%;
  --h1-desktop-large-letter-spacing: 0%;

  /* Mobile */
  --h1-mobile-font-family: 'Nunito Sans', sans-serif;
  --h1-mobile-font-weight: 700; /* Bold */
  --h1-mobile-font-size: 2.75em;
  --h1-mobile-line-height: 120%;
  --h1-mobile-letter-spacing: 0%;

  /* h2 Desktop Large */
  --h2-desktop-large-font-family: 'Nunito Sans', sans-serif;
  --h2-desktop-large-font-weight: 500; /* Semi Bold */
  --h2-desktop-large-font-size: 2.75em; /*  */
  --h2-desktop-large-line-height: 120%;
  --h2-desktop-large-letter-spacing: 0%;

  /* h2 Mobile */
  --h2-mobile-font-family: 'Nunito Sans', sans-serif;
  --h2-mobile-font-weight: 500; /* Bold */
  --h2-mobile-font-size: 1.625em; /*  */
  --h2-mobile-line-height: 120%;
  --h2-mobile-letter-spacing: 0%;

  /* h3 Desktop Large */
  --h3-desktop-large-font-family: 'Jost', sans-serif;
  --h3-desktop-large-font-weight: 400; 
  --h3-desktop-large-font-size: 2.25em; 
  --h3-desktop-large-line-height: 150%;
  --h3-desktop-large-letter-spacing: 0%;

  /* h3 Mobile */
  --h3-mobile-font-family: 'Jost', sans-serif;
  --h3-mobile-font-weight: 400; /* Medium */
  --h3-mobile-font-size: 1.5em; /* 28px */
  --h3-mobile-line-height: 150%;
  --h3-mobile-letter-spacing: 0%;

  /* h4 Desktop Large */
  --h4-desktop-large-font-family: 'Nunito Sans', sans-serif;
  --h4-desktop-large-font-weight: 500; /* Bold */
  --h4-desktop-large-font-size: 2em; /* 36px */
  --h4-desktop-large-line-height: 120%;
  --h4-desktop-large-letter-spacing: 0%;

  /* h4 Mobile */
  --h4-mobile-font-family: 'Nunito Sans', sans-serif;
  --h4-mobile-font-weight: 500; /* Bold */
  --h4-mobile-font-size: 1.375em; /* 24px */
  --h4-mobile-line-height: 120%;
  --h4-mobile-letter-spacing: 0%;

  /* h5 Desktop Large */
  --h5-desktop-large-font-family: 'Nunito Sans', sans-serif;
  --h5-desktop-large-font-weight: 500; /* Bold */
  --h5-desktop-large-font-size: 1.5em; /* 28px */
  --h5-desktop-large-line-height: 120%;
  --h5-desktop-large-letter-spacing: 0%;

  /* h5 Mobile */
  --h5-mobile-font-family: 'Nunito Sans', sans-serif;
  --h5-mobile-font-weight: 500; /* Bold */
  --h5-mobile-font-size: 1.125em; /* 20px */
  --h5-mobile-line-height: 120%;
  --h5-mobile-letter-spacing: 0%;


  /* h6 Desktop Large */
  --h6-desktop-large-font-family: 'Nunito Sans', sans-serif;
  --h6-desktop-large-font-weight: 700; 
  --h6-desktop-large-font-size: 1.25em; 
  --h6-desktop-large-line-height: 120%;
  --h6-desktop-large-letter-spacing: 0%;

  /* h6 Mobile */
  --h6-mobile-font-family: 'Nunito Sans', sans-serif;
  --h6-mobile-font-weight: 700; 
  --h6-mobile-font-size: 1em; 
  --h6-mobile-line-height: 120%;
  --h6-mobile-letter-spacing: 0%;


  /* body-1 Desktop Large */
  --body-1-desktop-large-font-family: 'Jost', sans-serif;
  --body-1-desktop-large-font-weight: 400; /* Regular */
  --body-1-desktop-large-font-size: 1.125em;
  --body-1-desktop-large-line-height: 150%;
  --body-1-desktop-large-letter-spacing: 0%;

  /* body-1 Mobile */
  --body-1-mobile-font-family: 'Jost', sans-serif;
  --body-1-mobile-font-weight: 400; /* Regular */
  --body-1-mobile-font-size: 0.875em; 
  --body-1-mobile-line-height: 150%;
  --body-1-mobile-letter-spacing: 0%;


  /* body-1-highlight Desktop Large */
  --body-1-highlight-desktop-large-font-family: 'Jost', sans-serif;
  --body-1-highlight-desktop-large-font-weight: 600; /* SemiBold */
  --body-1-highlight-desktop-large-font-size: 1.125em;
  --body-1-highlight-desktop-large-line-height: 150%;
  --body-1-highlight-desktop-large-letter-spacing: 0%;

  /* body-1-highlight Mobile */
  --body-1-highlight-mobile-font-family: 'Jost', sans-serif;
  --body-1-highlight-mobile-font-weight: 600; /* SemiBold */
  --body-1-highlight-mobile-font-size: 0.875em;
  --body-1-highlight-mobile-line-height: 150%;
  --body-1-highlight-mobile-letter-spacing: 0%;


  /* body-2 Desktop Large */
  --body-2-desktop-large-font-family: 'Jost', sans-serif;
  --body-2-desktop-large-font-weight: 400; /* Regular */
  --body-2-desktop-large-highlight-font-weight: 600; /* Regular */
  --body-2-desktop-large-font-size: 1em; /* 16px */
  --body-2-desktop-large-line-height: 150%;
  --body-2-desktop-large-letter-spacing: 0%;

  /* body-2 Mobile */
  --body-2-mobile-font-family: 'Jost', sans-serif;
  --body-2-mobile-font-weight: 400; /* Regular */
  --body-2-mobile-font-size: 0.75em; /* 12px */
  --body-2-mobile-highlight-font-size: 0.875em; /* 12px */
  --body-2-mobile-line-height: 150%;
  --body-2-mobile-letter-spacing: 0%;

  /* button-1 Desktop Large */
  --button-1-desktop-large-font-family: 'Jost', sans-serif;
  --button-1-desktop-large-font-weight: 600; /* SemiBold */
  --button-2-desktop-large-font-weight: 400; /* SemiBold */
  --button-1-desktop-large-font-size: 1.25em; /* 20px */
  --button-1-desktop-large-line-height: 150%;
  --button-1-desktop-large-letter-spacing: 0%;

  /* button-1 Mobile */
  --button-1-mobile-font-family: 'Jost', sans-serif;
  --button-1-mobile-font-weight: 500; /* Medium */
  --button-1-mobile-font-size: .875em; /* 16px */
  --button-1-mobile-line-height: 150%;
  --button-1-mobile-letter-spacing: 0%;


}

.h1-font {
  font-family: var(--h1-desktop-large-font-family);
  font-weight: var(--h1-desktop-large-font-weight);
  font-size: var(--h1-desktop-large-font-size);
  line-height: var(--h1-desktop-large-line-height);
  letter-spacing: var(--h1-desktop-large-letter-spacing);
}

h1 {

  font-family: var(--h1-desktop-large-font-family);
  font-weight: var(--h1-desktop-large-font-weight);
  font-size: var(--h1-desktop-large-font-size);
  line-height: var(--h1-desktop-large-line-height);
  letter-spacing: var(--h1-desktop-large-letter-spacing);

}

.h2-font {
  font-family: var(--h2-desktop-large-font-family);
  font-weight: var(--h2-desktop-large-font-weight);
  font-size: var(--h2-desktop-large-font-size);
  line-height: var(--h2-desktop-large-line-height);
  letter-spacing: var(--h2-desktop-large-letter-spacing);
}

h2 {
  font-family: var(--h2-desktop-large-font-family);
  font-weight: var(--h2-desktop-large-font-weight);
  font-size: var(--h2-desktop-large-font-size);
  line-height: var(--h2-desktop-large-line-height);
  letter-spacing: var(--h2-desktop-large-letter-spacing);
}

.h3-font {
  font-family: var(--h3-desktop-large-font-family);
  font-weight: var(--h3-desktop-large-font-weight);
  font-size: var(--h3-desktop-large-font-size);
  line-height: var(--h3-desktop-large-line-height);
  letter-spacing: var(--h3-desktop-large-letter-spacing);
}

h3 {
  font-family: var(--h3-desktop-large-font-family);
  font-weight: var(--h3-desktop-large-font-weight);
  font-size: var(--h3-desktop-large-font-size);
  line-height: var(--h3-desktop-large-line-height);
  letter-spacing: var(--h3-desktop-large-letter-spacing);
}

.h4-font {
  font-family: var(--h4-desktop-large-font-family);
  font-weight: var(--h4-desktop-large-font-weight);
  font-size: var(--h4-desktop-large-font-size);
  line-height: var(--h4-desktop-large-line-height);
  letter-spacing: var(--h4-desktop-large-letter-spacing);
}

h4 {
  font-family: var(--h4-desktop-large-font-family);
  font-weight: var(--h4-desktop-large-font-weight);
  font-size: var(--h4-desktop-large-font-size);
  line-height: var(--h4-desktop-large-line-height);
  letter-spacing: var(--h4-desktop-large-letter-spacing);
}

.h5-font {
  font-family: var(--h5-desktop-large-font-family);
  font-weight: var(--h5-desktop-large-font-weight);
  font-size: var(--h5-desktop-large-font-size);
  line-height: var(--h5-desktop-large-line-height);
  letter-spacing: var(--h5-desktop-large-letter-spacing);
}

h5 {
  font-family: var(--h5-desktop-large-font-family);
  font-weight: var(--h5-desktop-large-font-weight);
  font-size: var(--h5-desktop-large-font-size);
  line-height: var(--h5-desktop-large-line-height);
  letter-spacing: var(--h5-desktop-large-letter-spacing);
}

.h6-font {
  font-family: var(--h6-desktop-large-font-family);
  font-weight: var(--h6-desktop-large-font-weight);
  font-size: var(--h6-desktop-large-font-size);
  line-height: var(--h6-desktop-large-line-height);
  letter-spacing: var(--h6-desktop-large-letter-spacing);
}

h6 {
  font-family: var(--h6-desktop-large-font-family);
  font-weight: var(--h6-desktop-large-font-weight);
  font-size: var(--h6-desktop-large-font-size);
  line-height: var(--h6-desktop-large-line-height);
  letter-spacing: var(--h6-desktop-large-letter-spacing);
}


.body-1 {
  font-family: var(--body-1-desktop-large-font-family);
  font-weight: var(--body-1-desktop-large-font-weight);
  font-size: var(--body-1-desktop-large-font-size);
  line-height: var(--body-1-desktop-large-line-height);
  letter-spacing: var(--body-1-desktop-large-letter-spacing);
}

.body-1-highlight {
  font-family: var(--body-1-highlight-desktop-large-font-family);
  font-weight: var(--body-1-highlight-desktop-large-font-weight);
  font-size: var(--body-1-highlight-desktop-large-font-size);
  line-height: var(--body-1-highlight-desktop-large-line-height);
  letter-spacing: var(--body-1-highlight-desktop-large-letter-spacing);
}

.body-2 {
  font-family: var(--body-2-desktop-large-font-family);
  font-weight: var(--body-2-desktop-large-font-weight);
  font-size: var(--body-2-desktop-large-font-size);
  line-height: var(--body-2-desktop-large-line-height);
  letter-spacing: var(--body-2-desktop-large-letter-spacing);
}

.body-2-highlight {
  font-family: var(--body-2-desktop-large-font-family);
  font-weight: var( --body-2-desktop-large-highlight-font-weight);
  font-size: var(--body-2-desktop-large-font-size);
  line-height: var(--body-2-desktop-large-line-height);
  letter-spacing: var(--body-2-desktop-large-letter-spacing);
}

.button {
  font-family: var(--button-1-desktop-large-font-family);
  font-weight: var(--button-1-desktop-large-font-weight);
  font-size: var(--button-1-desktop-large-font-size);
  line-height: var(--button-1-desktop-large-line-height);
  letter-spacing: var(--button-1-desktop-large-letter-spacing);
}


.button-2 {
  font-family: var(--button-1-desktop-large-font-family);
  font-weight: var( --button-2-desktop-large-font-weight);
  font-size: var(--button-1-desktop-large-font-size);
  line-height: var(--button-1-desktop-large-line-height);
  letter-spacing: var(--button-1-desktop-large-letter-spacing);
}

/* Responsive for mobile */
@media (max-width: 768px) {

  .h1-font {
    font-family: var(--h1-mobile-font-family);
    font-weight: var(--h1-mobile-font-weight);
    font-size: var(--h1-mobile-font-size);
    line-height: var(--h1-mobile-line-height);
    letter-spacing: var(--h1-mobile-letter-spacing);
  }

  h1 {
    font-family: var(--h1-mobile-font-family);
    font-weight: var(--h1-mobile-font-weight);
    font-size: var(--h1-mobile-font-size);
    line-height: var(--h1-mobile-line-height);
    letter-spacing: var(--h1-mobile-letter-spacing);
  }

  .h2-font {
    font-family: var(--h2-mobile-font-family);
    font-weight: var(--h2-mobile-font-weight);
    font-size: var(--h2-mobile-font-size);
    line-height: var(--h2-mobile-line-height);
    letter-spacing: var(--h2-mobile-letter-spacing);
  }

  h2 {
    font-family: var(--h2-mobile-font-family);
    font-weight: var(--h2-mobile-font-weight);
    font-size: var(--h2-mobile-font-size);
    line-height: var(--h2-mobile-line-height);
    letter-spacing: var(--h2-mobile-letter-spacing);
  }

  .h3-font {
    font-family: var(--h3-mobile-font-family);
    font-weight: var(--h3-mobile-font-weight);
    font-size: var(--h3-mobile-font-size);
    line-height: var(--h3-mobile-line-height);
    letter-spacing: var(--h3-mobile-letter-spacing);
  }

  h3 {
    font-family: var(--h3-mobile-font-family);
    font-weight: var(--h3-mobile-font-weight);
    font-size: var(--h3-mobile-font-size);
    line-height: var(--h3-mobile-line-height);
    letter-spacing: var(--h3-mobile-letter-spacing);
  }

  .h4-font {
    font-family: var(--h4-mobile-font-family);
    font-weight: var(--h4-mobile-font-weight);
    font-size: var(--h4-mobile-font-size);
    line-height: var(--h4-mobile-line-height);
    letter-spacing: var(--h4-mobile-letter-spacing);
  }

  h4 {
    font-family: var(--h4-mobile-font-family);
    font-weight: var(--h4-mobile-font-weight);
    font-size: var(--h4-mobile-font-size);
    line-height: var(--h4-mobile-line-height);
    letter-spacing: var(--h4-mobile-letter-spacing);
  }

  .h5-font {
    font-family: var(--h5-mobile-font-family);
    font-weight: var(--h5-mobile-font-weight);
    font-size: var(--h5-mobile-font-size);
    line-height: var(--h5-mobile-line-height);
    letter-spacing: var(--h5-mobile-letter-spacing);
  }

  h5 {
    font-family: var(--h5-mobile-font-family);
    font-weight: var(--h5-mobile-font-weight);
    font-size: var(--h5-mobile-font-size);
    line-height: var(--h5-mobile-line-height);
    letter-spacing: var(--h5-mobile-letter-spacing);
  }

  .h6-font {
    font-family: var(--h6-mobile-font-family);
    font-weight: var(--h6-mobile-font-weight);
    font-size: var(--h6-mobile-font-size);
    line-height: var(--h6-mobile-line-height);
    letter-spacing: var(--h6-mobile-letter-spacing);
  }

  h6 {
    font-family: var(--h6-mobile-font-family);
    font-weight: var(--h6-mobile-font-weight);
    font-size: var(--h6-mobile-font-size);
    line-height: var(--h6-mobile-line-height);
    letter-spacing: var(--h6-mobile-letter-spacing);
  }

  .body-1 {
    font-family: var(--body-1-mobile-font-family);
    font-weight: var(--body-1-mobile-font-weight);
    font-size: var(--body-1-mobile-font-size);
    line-height: var(--body-1-mobile-line-height);
    letter-spacing: var(--body-1-mobile-letter-spacing);
  }

  .body-1-highlight {
    font-family: var(--body-1-highlight-mobile-font-family);
    font-weight: var(--body-1-highlight-mobile-font-weight);
    font-size: var(--body-1-highlight-mobile-font-size);
    line-height: var(--body-1-highlight-mobile-line-height);
    letter-spacing: var(--body-1-highlight-mobile-letter-spacing);
  }

  .body-2 {
    font-family: var(--body-2-mobile-font-family);
    font-weight: var(--body-2-mobile-font-weight);
    font-size: var(--body-2-mobile-font-size);
    line-height: var(--body-2-mobile-line-height);
    letter-spacing: var(--body-2-mobile-letter-spacing);
  }

  .body-2-highlight {
    font-family: var(--body-2-mobile-font-family);
    font-weight: var(--body-2-desktop-large-highlight-font-weight);
    font-size: var(--body-2-mobile-highlight-font-size);
    line-height: var(--body-2-mobile-line-height);
    letter-spacing: var(--body-2-mobile-letter-spacing);
  }

  .button {
    font-family: var(--button-1-mobile-font-family);
    font-weight: var(--button-1-mobile-font-weight);
    font-size: var(--button-1-mobile-font-size);
    line-height: var(--button-1-mobile-line-height);
    letter-spacing: var(--button-1-mobile-letter-spacing);
  }


  .button-2 {
    font-family: var(--button-1-mobile-font-family);
    font-weight: var( --button-2-desktop-large-font-weight);
    font-size: var(--button-1-mobile-font-size);
    line-height: var(--button-1-mobile-line-height);
    letter-spacing: var(--button-1-mobile-letter-spacing);
  }


}
/* @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    */
/*****************************************/

/********** Colors ***************/




.form .form-columns-1 .input{
   margin-right: 0 !important;
}

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

.form .form-columns-2 .input, .form-columns-2 .hs-form-field{
  margin-right: 0 !important;
  max-width:100% !important;
  width:100% !important;
}
.form .form-columns-2 {
  display: flex;
  gap: 1.25em;
  margin-bottom:1.875em;
}

.form .form-columns-3 {
  display: flex;
  gap: 1.25em;
  margin-bottom:1.875em;
}

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




.form input,
.form textarea,
.form select {
  padding: 0.75em 1.25em;
  width: 100%;
  display: block;
  background: var(--l-a-b-1);
  border-radius: 6px;
  border: 1px solid var(--b-b);
  margin-top: 0.5em; 
  margin-bottom: 1.813em;
  box-sizing: border-box;
  font-family: var(--body-1-desktop-large-font-family);
  font-weight: var(--body-1-desktop-large-font-weight);
  font-size: var(--body-1-desktop-large-font-size);
  line-height: var(--body-1-desktop-large-line-height);
  letter-spacing: var(--body-1-desktop-large-letter-spacing);
  color :var(--d-t-1);
}

.form select { 
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-appearance: none;
  -moz-appearance: none;

/*   background-image:
    linear-gradient(45deg, transparent 50%,  50%),
    linear-gradient(135deg,  50%, transparent 50%),
    linear-gradient(to right, #ccc, #ccc);
  background-position:
    calc(100% - 20px) calc(1em + 2px),
    calc(100% - 15px) calc(1em + 2px),
    calc(100% - 2.5em) 0.5em;
  background-size:
    5px 5px,
    5px 5px,
    1px 1.5em;
  background-repeat: no-repeat; */
}


.form select:focus {
/*   background-image:
    linear-gradient(45deg,  50%, transparent 50%),
    linear-gradient(135deg, transparent 50%,  50%),
    linear-gradient(to right, #ccc, #ccc);
  background-position:
    calc(100% - 15px) 1em,
    calc(100% - 20px) 1em,
    calc(100% - 2.5em) 0.5em;
  background-size:
    5px 5px,
    5px 5px,
    1px 1.5em;
  background-repeat: no-repeat;
  border-color: green;
  outline: 0; */
}


.form select:-moz-focusring {
  color: transparent;
  text-shadow: 0 0 0 #000;
}

.form input::placeholder, .form textarea::placeholder,.form select::placeholder { /* Standard */
  color: ;
}

.form label {
  margin-bottom: 0.5em;
  font-family: var(--body-1-highlight-desktop-large-font-family);
  font-weight: var(--body-1-highlight-desktop-large-font-weight);
  font-size: var(--body-1-highlight-desktop-large-font-size);
  line-height: var(--body-1-highlight-desktop-large-line-height);
  letter-spacing: var(--body-1-highlight-desktop-large-letter-spacing);
  color :var(--d-t-1);

}


.hs-error-msg {
  font-size: 0.875em !important;
  font-weight: 500;
  text-align: left;
  color: red !important;
}
.hs-error-msgs {
  margin-top: -1em;
}
/* .form input[type="submit"] {
display: block;
background-color: ;
padding: 12px 24px;
border: none;
border-radius: 4px;
cursor: pointer;
transition: background-color 0.3s;
color: !important;

} */

.form input[type="submit"]  {
  color:var(--w-t);
  background-color:#52B2E2;
  padding: 0.5em 1em;
  border: none;
  display: block;
  transition: all .2s ease;
  border-radius: 6px;
  cursor: pointer;
  margin-top:2.313em;
  margin-bottom:0em;
}
 
/* .hs-form-radio-display{
 display:flex;
 flex-direction:row-reverse;
 width:100%;
} */

.form input[type="submit"] :hover {
  background-color: #000033;
}

.form {
  background-color: white;
  padding: 2.5em ;
  border: none;
  border-radius: 12px;
}

.form input:focus,
.form select:focus,
.form textarea:focus {
  border-color: ;
}

.form textarea {
  resize: none;
  min-height: 9em;
  box-sizing: border-box;
}

.form ul{
  list-style-type: none;
}

.form legend{
  font-family: var(--body-2-desktop-large-font-family);
  font-weight: var(--body-2-desktop-large-font-weight);
  font-size: var(--body-2-desktop-large-font-size);
  line-height: var(--body-2-desktop-large-line-height);
  letter-spacing: var(--body-2-desktop-large-letter-spacing);
  color:var(--d-t-2);
}


.form .inputs-list{
  padding-left:0px;

}

.form .hs-form-booleancheckbox-display{

  display:flex ;
  /*   gap:1em; */
  align-items:center;
}

.form input[type='checkbox']{
  width:auto !important;
  width:16px;
  height:16px;
  display:inline;
  cursor:pointer;
  margin-right:0.4375em;
  margin-bottom:0;
  margin-top:0;
  accent-color: 
}

@media (max-width: 768px) {
  .form {
    padding: 1.5em 1em ;
  }

  .form input,
  .form textarea,
  .form select {
    margin-bottom: 1em;
    font-size: 1em; 
  }
  .form .form-columns-2 {
  flex-direction: column;
  gap: 1em;
}
.hs-error-msgs {
  margin-top: -10px;
}
}
@media (max-width: 400px), (min-device-width: 320px) and (max-device-width: 480px) {
.form .form-columns-1 .input{
   margin-right: 0 !important;
}
 .form .form-columns-1 .hs-input:not([type="checkbox"]), .form-columns-2 .hs-form-field .hs-input{
   width:100% !important;
 }
.form .form-columns-2 .input, .form-columns-2 .hs-form-field{
  margin-right: 0 !important;
  max-width:100% !important;
  width:100% !important;
}
}


/* --- Utilities --- */
/* common-Macro */
/* --- Macro CSS --- */