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




.btn-1 {
  padding: 0.05em;
  border-radius: 0.625em;
  display: inline-block;
  cursor: pointer;
}

.btn-1-inner {
  text-align: center;
  border-radius: 0.625em;
  padding: 1.25em 2.5em;
  background-color: var(--white);
  color: var(--bg);
  transition: .3s;
}

.btn-1:hover {
  background: var(--gradient-1); 
  color: var(--primary);
}
.btn-1:hover .btn-1-inner {
  background-color: #1F282F;
  color: var(--primary);
}


.btn-3 {
  padding: 0.05em;
  border-radius: 0.625em;
  display: block;
  cursor: pointer;
}

.btn-3-inner {
  text-align: center;
  border-radius: 0.625em;
  padding: 1.25em 2.5em;
  background-color: var(--primary);
  color: var(--white);
  transition: .3s;
}

.btn-3:hover {
  background: var(--gradient-1); 
  color: var(--primary);
}
.btn-3:hover .btn-3-inner {
  background-color: #1F282F;
  color: var(--primary);
}


@media (max-width: 768px) {
  .btn-1 {
    display: block;
  }

  .btn-1-inner {
    padding: .75em 0;

  }

  .btn-3-inner {
    padding: .75em 0;

  }
}
/* @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 {
  --primary: #55B018;
  --secondary: #4F38E0;
  --black: #09152B;
  --white-1: #FCFEFB;
  --white-2: #FFFFFF;
  --highlight: #3F8212;
  --highlight-bg: #EDFBE4;
  --highlight-bg-2: #F1F5F9;
  --highlight-bg-3: #FCFEFB;
  --highlight-bg-4: #F8FAFC;
  --paragraph: #334155;
  --placeholder: #64748B;
  --border-1: #CBD5E1;
  --border-2: #E2E8F0;
  --rating: #EAB308;
}
/* @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=Abhaya+Libre:wght@400;500;600;700;800&family=Inter+Tight:ital,wght@0,100..900;1,100..900&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&family=Montserrat:ital,wght@0,100..900;1,100..900&family=Quicksand:wght@300..700&display=swap');



@import url('https://fonts.googleapis.com/css2?family=Abhaya+Libre:wght@400;500;600;700;800&family=Inter+Tight:ital,wght@0,100..900;1,100..900&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&family=Montserrat:ital,wght@0,100..900;1,100..900&family=Quicksand:wght@300..700&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Abhaya+Libre:wght@400;500;600;700;800&family=Inter+Tight:ital,wght@0,100..900;1,100..900&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&family=Montserrat:ital,wght@0,100..900;1,100..900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Quicksand:wght@300..700&display=swap');


a {
  text-decoration: none;
}

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


:root {

  --heading1-font-family: 'Inter Tight', sans-serif;
  --heading1-font-weight: 600;
  --heading1-font-size: 3.75em;
  --heading1-line-height: 120%;

  --heading1-m-font-size: 2.125em;


  --heading-2-font: 'Inter Tight', sans-serif;
  --heading-2-weight: 600;
  --heading-2-size: 2.5em; /* 12px = 0.75em */
  --heading-2-line-height: 120%;

  --heading-2-m-size: 1.75em; /* 12px = 0.75em */

  --heading-3-font: 'Inter Tight', sans-serif;
  --heading-3-weight: 400;
  --heading-3-size: 2em;
  --heading-3-line-height: 120%;

  --heading-3-m-size: 1.5em;

  --heading-4-font: 'Inter Tight', sans-serif;
  --heading-4-weight: 500;
  --heading-4-size: 1.25em;
  --heading-4-line-height: 120%;

  --heading-4-m-size: 1.125em;

  --heading-5-font: 'Inter Tight', sans-serif;
  --heading-5-weight: 400;
  --heading-5-size: 1em;
  --heading-5-line-height: 120%;


  --p1-font-family: 'Poppins', sans-serif;
  --p1-font-weight: 400;
  --p1-font-size: 1.125em;
  --p1-line-height: 150%;
  --p1-letter-spacing: 0;


  --paragraph-1-highlighted-font: 'Inter', sans-serif;
  --paragraph-1-highlighted-weight: 600;
  --paragraph-1-highlighted-size: 1.125em; 
  --paragraph-1-highlighted-line-height: 150%;
  --paragraph-1-highlighted-letter-spacing: 0;

  /* Paragraph 2 / Desktop Medium */
  --p2-font-family: 'Poppins', sans-serif;
  --p2-font-weight: 400;
  --p2-font-size: 1em;
  --p2-line-height: 150%;
  --p2-letter-spacing: 0;

  /* Paragraph 2 Highlighted / Desktop Medium */
  --p2-highlighted-font-family: 'Poppins', sans-serif;
  --p2-highlighted-font-weight: 600;
  --p2-highlighted-font-size: 1em;
  --p2-highlighted-line-height: 150%;
  --p2-highlighted-letter-spacing: 0;


  --paragraph3-font-family: 'Inter', sans-serif;
  --paragraph3-font-weight: 400;
  --paragraph3-font-size: 0.875em;
  --paragraph3-line-height: 140%;
  --paragraph3-letter-spacing: 0%;





  --button-text-font: 'Inter', sans-serif;
  --button-text-weight: 00;
  --button-text-size: 1em; /* 12px / 16px */6
  --button-text-line-height: 100%;
  --button-text-letter-spacing: 0;


}


.heading-1 {
  font-family: var(--heading1-font-family);
  font-weight: var(--heading1-font-weight);
  font-size: var(--heading1-font-size);
  line-height: var(--heading1-line-height);
}

.heading-2 {
  font-family: var(--heading-2-font);
  font-weight: var(--heading-2-weight);
  font-size: var(--heading-2-size);
  line-height: var(--heading-2-line-height);
}

.heading-3 {
  font-family: var(--heading-3-font);
  font-weight: var(--heading-3-weight);
  font-size: var(--heading-3-size);
  line-height: var(--heading-3-line-height);
}

.heading-4 {
  font-family: var(--heading-4-font);
  font-weight: var(--heading-4-weight);
  font-size: var(--heading-4-size);
  line-height: var(--heading-4-line-height);
}

.heading-5 {
  font-family: var(--heading-5-font);
  font-weight: var(--heading-5-weight);
  font-size: var(--heading-5-size);
  line-height: var(--heading-5-line-height);
}


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

.p1-highlighted {
  font-family: var(--paragraph-1-highlighted-font);
  font-weight: var(--paragraph-1-highlighted-weight);
  font-size: var(--paragraph-1-highlighted-size);
  line-height: var(--paragraph-1-highlighted-line-height);
  letter-spacing: var(--paragraph-1-highlighted-letter-spacing);
}

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

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

.p3-text {
  font-family: var(--paragraph3-font-family);
  font-weight: var(--paragraph3-font-weight);
  font-size: var(--paragraph3-font-size);
  line-height: var(--paragraph3-line-height);
  letter-spacing: var(--paragraph3-letter-spacing);
}

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


/* Mobile Styles */
@media (max-width: 768px) {
  
  .heading-1 {
    font-size: var(--heading1-m-font-size);
  }

  .heading-2 {
    font-size: var(--heading-2-m-size);
  }

  .heading-3 {
    font-size: var( --heading-3-m-size);
  }

  .heading-4 {
    font-size: var( --heading-4-m-size);
  }
  
  .p1-text {
  font-size: 16px;
}

.p1-highlighted {
  font-size: 16px;
}

.p2-text {
  font-size: 14px;
}

.p2-highlighted {
  font-size: 14px;
}


}


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