/* Theme base styles */

/* INCLUDE THE VARIABLES AT THE TOP OF THE FILE, AS IT'S USED IN ALL STYLESHEETS BELOW */

:root {
  --container-width: 1272px;
  --dnd-section-padding: 60px 20px;
  --dnd-section-padding-tablet: 40px 20px;
  --dnd-section-padding-mobile: 30px 20px;
  --hero-section-padding: 100px 20px;
  --hero-section-padding-tablet: 60px 20px;
  --hero-section-padding-mobile: 40px 20px;
  --hero-section-padding-top-desktop: 100px;
  --hero-section-padding-top-tablet: 60px;
  --hero-section-padding-top-mobile: 40px;
}


:root {
  --primary-color: #1F1A49;
  --secondary-color: #2F6BF0;
  --accent-color: #FF4A75;
  --dark-color: #1F1A49; 
  --light-color: #F3F7FF;
  --white-color: #ffffff;
  --purple-color: #1F1A49;
  --blue-color: #2F6BF0;
  --teal-color: #32EAC6;
  --cerise-color: #FF4A75;
  --grey-color: #F3F7FF;
  --light-grey-color: #F0F0F0;
  --dark-grey-color: #D9D9D9;
  --drop-shadow: 0px 4px 14.2px 0px rgba(0, 0, 0, 0.05);
}


:root {
  --font-family: "Manrope", sans-serif;
  --body-font-size: 16px;
  --body-font-weight: 400;
  --body-font-letter-spacing: 0.5px;
  --body-font-line-height: 1.5;
  --heading-font-weight: 700;
  --heading-1-font-size: 60px;
  --heading-2-font-size: 40px;
  --heading-3-font-size: 32px;
  --heading-4-font-size: 24px;
  --heading-5-font-size: 20px;
  --heading-6-font-size: 16px;
  --paragraph-font-size: 1rem;
  --small-font-size: 0.875rem;
  --body-font-color: var(--primary-color);
  --heading-font-color: var(--primary-color);
  --anchor-font-color: var(--secondary-color);
  --anchor-font-hover-color: var(--purple-color);
}


:root {
  --button-background-color: var(--purple-color);
  --button-font-color: var(--white-color);
  --button-border: none;
  --button-border-radius: 50px;
  --button-padding: 12px 30px;
}


:root {
  --form-title-background-color: var(--light-color);
  --form-title-font-color: var(--purple-color);
  --form-label-font-color: var(--purple-color);
  --form-help-text-font-color: var(--purple-color);
  --form-error-text-font-color: red;
  --form-input-border-color: var(--dark-color);
  --form-input-focus-border-color: var(--purple-color);
}


:root {
  --table-header-background-color: var(--light-color);
  --table-background-color: var(--white-color);
  --table-border-color: var(--purple-color);
  --table-footer-background-color: var(--light-color);
  --table-footer-font-color: var(--purple-color);
}


:root {
  --header-height-desktop: 160px;
  --header-height-tablet: 120px;
  --header-height-mobile: 100px;
  --header-padding-top-desktop: 20px;
  --header-padding-top-tablet: 20px;
  --header-padding-top-mobile: 20px;
  --header-background-color: var(--white-color);
  --header-scrolled-padding-top: 5px;
  --header-scrolled-inner-padding-y: 15px;
  --header-default-inner-padding-y: 25px;
  --header-height-mobile-scrolled: calc(
    var(--header-height-mobile)
    - (var(--header-padding-top-mobile) - var(--header-scrolled-padding-top))
    - (2 * (var(--header-default-inner-padding-y) - var(--header-scrolled-inner-padding-y)))
  );
  --header-height-tablet-scrolled: calc(
    var(--header-height-tablet)
    - (var(--header-padding-top-tablet) - var(--header-scrolled-padding-top))
    - (2 * (var(--header-default-inner-padding-y) - var(--header-scrolled-inner-padding-y)))
  );
}


:root {
  --footer-background-color: var(--purple-color);
}


/*
  MANDATORY: All components must follow modern React patterns
  - NEVER use React.FC<Props> - Use (props: Props) instead
  - ALWAYS use export const Component for main components
  - ALWAYS use props.propertyName for prop access
  - ALWAYS include default export for Island compatibility
  - See: modern-react-patterns.md for complete guidelines
*/


/*
  MANDATORY: All island files must follow consistent naming patterns
  - Island files MUST be named [ModuleName]Island.tsx
  - Import pattern: import [ModuleName]Island from './islands/[ModuleName]Island.tsx?island'
  - Use in Island component: <Island module={[ModuleName]Island} hydrateOn="visible" />
  - Benefits: Clear identification, consistency, improved maintainability
  - Examples: TabbedResourcesIsland.tsx, TimelineIsland.tsx
*/

/*  Generic
    This is where reset, normalize & box-sizing styles go.
*/
/*! 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;
}

/**
 * Render the `main` element consistently in IE.
 */

main {
  display: block;
}

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

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */

hr {
  box-sizing: content-box; /* 1 */
  height: 0; /* 1 */
  overflow: visible; /* 2 */
}

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

/**
 * Remove the gray background on active links in IE 10.
 */

a {
  background-color: transparent;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, 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;
}

/* Embedded content
   ========================================================================== */

/**
 * Remove the border on images inside links in IE 10.
 */

img {
  border-style: none;
}

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

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */

button,
input { /* 1 */
  overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 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;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */

legend {
  box-sizing: border-box; /* 1 */
  color: inherit; /* 2 */
  display: table; /* 1 */
  max-width: 100%; /* 1 */
  padding: 0; /* 3 */
  white-space: normal; /* 1 */
}

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

progress {
  vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */

textarea {
  overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */

[type="checkbox"],
[type="radio"] {
  box-sizing: border-box; /* 1 */
  padding: 0; /* 2 */
}

/**
 * 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, IE 10+, and Firefox.
 */

details {
  display: block;
}

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

summary {
  display: list-item;
}

/* Misc
   ========================================================================== */

/**
 * Add the correct display in IE 10+.
 */

template {
  display: none;
}

/**
 * Add the correct display in IE 10.
 */

[hidden] {
  display: none;
}
*, *:before, *:after {
  box-sizing: border-box;
}

/*  Modules
    Styling for custom modules
*/


/*  Components
    Specific pieces of UI that are stylized. Typically used for global partial styling
*/
.s-background-color--primary,
.s-background-color--primary-hover:hover,
.s-background-color--primary-active.active,
.s-icon-background-color--primary svg {
  background-color: var(--primary-color);
}

.s-background-color--secondary,
.s-background-color--secondary-hover:hover,
.s-background-color--secondary-active.active,
.s-icon-background-color--secondary svg {
  background-color: var(--secondary-color);
}

.s-background-color--dark,
.s-background-color--dark-hover:hover,
.s-background-color--dark-active.active,
.s-icon-background-color--dark svg {
  background-color: var(--dark-color);
}

.s-background-color--light,
.s-background-color--light-hover:hover,
.s-background-color--light-active.active,
.s-icon-background-color--light svg {
  background-color: var(--light-color);
}

.s-background-color--white,
.s-background-color--white-hover:hover,
.s-background-color--white-active.active,
.s-icon-background-color--white svg {
  background-color: var(--white-color);
}

.s-background-color--grey,
.s-background-color--grey-hover:hover,
.s-background-color--grey-active.active,
.s-icon-background-color--grey svg {
  background-color: var(--grey-color);
}

.s-background-color--dark-grey,
.s-background-color--dark-grey-hover:hover,
.s-background-color--dark-grey-active.active,
.s-icon-background-color--dark-grey svg {
  background-color: var(--dark-grey-color);
}

.s-background-color--purple,
.s-background-color--purple-hover:hover,
.s-background-color--purple-active.active,
.s-icon-background-color--purple svg {
  background-color: var(--purple-color);
}

.s-background-color--teal,
.s-background-color--teal-hover:hover,
.s-background-color--teal-active.active,
.s-icon-background-color--teal svg {
  background-color: var(--teal-color);
}

.s-background-color--blue,
.s-background-color--blue-hover:hover,
.s-background-color--blue-active.active,
.s-icon-background-color--blue svg {
  background-color: var(--blue-color);
}

.s-background-color--cerise,
.s-background-color--cerise-hover:hover,
.s-background-color--cerise-active.active,
.s-icon-background-color--cerise svg {
  background-color: var(--cerise-color);
}

.dnd-section:has(.s-background-gradient__top-bottom--white-to-navy) {
  background: linear-gradient(
    180deg,
    var(--white-color) 0%,
    var(--white-color) 50%,
    var(--primary-color) 50%,
    var(--primary-color) 100%
  );
}

.dnd-section:has(.s-background-gradient__top-bottom--white-to-grey) {
  background: linear-gradient(180deg,
      var(--white-color) 0%,
      var(--white-color) 50%,
      var(--grey-color) 50%,
      var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__top-bottom--grey-to-navy) {
  background: linear-gradient(
    180deg,
    var(--grey-color) 0%,
    var(--grey-color) 50%,
    var(--primary-color) 50%,
    var(--primary-color) 100%
  );
}


.s-text-color--primary,
.s-text-color--primary-hover:hover,
.s-text-color--primary-hover:hover h1,
.s-text-color--primary-hover:hover h2,
.s-text-color--primary-hover:hover h3,
.s-text-color--primary-hover:hover h4,
.s-text-color--primary-hover:hover h5,
.s-text-color--primary-hover:hover h6,
.s-text-color--primary-hover:hover p,
.s-text-color--primary-hover:hover ul,
.s-text-color--primary-hover:hover li,
.s-text-color--primary-hover:hover a,
.s-text-color--primary-hover:hover i,
.s-text-color--primary-active.active,
.s-text-color--primary-active.active h1,
.s-text-color--primary-active.active h2,
.s-text-color--primary-active.active h3,
.s-text-color--primary-active.active h4,
.s-text-color--primary-active.active h5,
.s-text-color--primary-active.active h6,
.s-text-color--primary-active.active p,
.s-text-color--primary-active.active ul,
.s-text-color--primary-active.active li,
.s-text-color--primary-active.active a,
.s-text-color--primary-active.active i,
.s-text-color--primary h1,
.s-text-color--primary h2,
.s-text-color--primary h3,
.s-text-color--primary h4,
.s-text-color--primary h5,
.s-text-color--primary h6,
.s-text-color--primary p,
.s-text-color--primary ul,
.s-text-color--primary li,
.s-text-color--primary a,
.s-text-color--primary i,
h1.s-text-color--primary,
h2.s-text-color--primary,
h3.s-text-color--primary,
h4.s-text-color--primary,
h5.s-text-color--primary,
h6.s-text-color--primary,
p.s-text-color--primary,
ul.s-text-color--primary,
li.s-text-color--primary,
a.s-text-color--primary,
i.s-text-color--primary {
  color: var(--primary-color);
}

.s-text-color--primary svg path,
.s-text-color--primary-hover:hover svg path,
.s-text-color--primary-active.active svg path,
svg.s-text-color--primary {
  fill: var(--primary-color);
}

.s-text-color--secondary,
.s-text-color--secondary-hover:hover,
.s-text-color--secondary-hover:hover h1,
.s-text-color--secondary-hover:hover h2,
.s-text-color--secondary-hover:hover h3,
.s-text-color--secondary-hover:hover h4,
.s-text-color--secondary-hover:hover h5,
.s-text-color--secondary-hover:hover h6,
.s-text-color--secondary-hover:hover p,
.s-text-color--secondary-hover:hover ul,
.s-text-color--secondary-hover:hover li,
.s-text-color--secondary-hover:hover a,
.s-text-color--secondary-hover:hover i,
.s-text-color--secondary-active.active,
.s-text-color--secondary-active.active h1,
.s-text-color--secondary-active.active h2,
.s-text-color--secondary-active.active h3,
.s-text-color--secondary-active.active h4,
.s-text-color--secondary-active.active h5,
.s-text-color--secondary-active.active h6,
.s-text-color--secondary-active.active p,
.s-text-color--secondary-active.active ul,
.s-text-color--secondary-active.active li,
.s-text-color--secondary-active.active a,
.s-text-color--secondary-active.active i,
.s-text-color--secondary h1,
.s-text-color--secondary h2,
.s-text-color--secondary h3,
.s-text-color--secondary h4,
.s-text-color--secondary h5,
.s-text-color--secondary h6,
.s-text-color--secondary p,
.s-text-color--secondary ul,
.s-text-color--secondary li,
.s-text-color--secondary a,
.s-text-color--secondary i,
h1.s-text-color--secondary,
h2.s-text-color--secondary,
h3.s-text-color--secondary,
h4.s-text-color--secondary,
h5.s-text-color--secondary,
h6.s-text-color--secondary,
p.s-text-color--secondary,
ul.s-text-color--secondary,
li.s-text-color--secondary,
a.s-text-color--secondary,
i.s-text-color--secondary {
  color: var(--secondary-color);
}

.s-text-color--secondary svg path,
.s-text-color--secondary-hover:hover svg path,
.s-text-color--secondary-active.active svg path,
svg.s-text-color--secondary {
  fill: var(--secondary-color);
}

.s-text-color--dark,
.s-text-color--dark-hover:hover,
.s-text-color--dark-hover:hover h1,
.s-text-color--dark-hover:hover h2,
.s-text-color--dark-hover:hover h3,
.s-text-color--dark-hover:hover h4,
.s-text-color--dark-hover:hover h5,
.s-text-color--dark-hover:hover h6,
.s-text-color--dark-hover:hover p,
.s-text-color--dark-hover:hover ul,
.s-text-color--dark-hover:hover li,
.s-text-color--dark-hover:hover a,
.s-text-color--dark-hover:hover i,
.s-text-color--dark-active.active,
.s-text-color--dark-active.active h1,
.s-text-color--dark-active.active h2,
.s-text-color--dark-active.active h3,
.s-text-color--dark-active.active h4,
.s-text-color--dark-active.active h5,
.s-text-color--dark-active.active h6,
.s-text-color--dark-active.active p,
.s-text-color--dark-active.active ul,
.s-text-color--dark-active.active li,
.s-text-color--dark-active.active a,
.s-text-color--dark-active.active i,
.s-text-color--dark h1,
.s-text-color--dark h2,
.s-text-color--dark h3,
.s-text-color--dark h4,
.s-text-color--dark h5,
.s-text-color--dark h6,
.s-text-color--dark p,
.s-text-color--dark ul,
.s-text-color--dark li,
.s-text-color--dark a,
.s-text-color--dark i,
h1.s-text-color--dark,
h2.s-text-color--dark,
h3.s-text-color--dark,
h4.s-text-color--dark,
h5.s-text-color--dark,
h6.s-text-color--dark,
p.s-text-color--dark,
ul.s-text-color--dark,
li.s-text-color--dark,
a.s-text-color--dark,
i.s-text-color--dark {
  color: var(--dark-color);
}

.s-text-color--dark svg path,
.s-text-color--dark-hover:hover svg path,
.s-text-color--dark-active.active svg path,
svg.s-text-color--dark {
  fill: var(--dark-color);
}



.s-text-color--blue,
.s-text-color--blue-hover:hover,
.s-text-color--blue-hover:hover h1,
.s-text-color--blue-hover:hover h2,
.s-text-color--blue-hover:hover h3,
.s-text-color--blue-hover:hover h4,
.s-text-color--blue-hover:hover h5,
.s-text-color--blue-hover:hover h6,
.s-text-color--blue-hover:hover p,
.s-text-color--blue-hover:hover ul,
.s-text-color--blue-hover:hover li,
.s-text-color--blue-hover:hover a,
.s-text-color--blue-hover:hover i,
.s-text-color--blue-active.active,
.s-text-color--blue-active.active h1,
.s-text-color--blue-active.active h2,
.s-text-color--blue-active.active h3,
.s-text-color--blue-active.active h4,
.s-text-color--blue-active.active h5,
.s-text-color--blue-active.active h6,
.s-text-color--blue-active.active p,
.s-text-color--blue-active.active ul,
.s-text-color--blue-active.active li,
.s-text-color--blue-active.active a,
.s-text-color--blue-active.active i,
.s-text-color--blue h1,
.s-text-color--blue h2,
.s-text-color--blue h3,
.s-text-color--blue h4,
.s-text-color--blue h5,
.s-text-color--blue h6,
.s-text-color--blue p,
.s-text-color--blue ul,
.s-text-color--blue li,
.s-text-color--blue a,
.s-text-color--blue i,
h1.s-text-color--blue,
h2.s-text-color--blue,
h3.s-text-color--blue,
h4.s-text-color--blue,
h5.s-text-color--blue,
h6.s-text-color--blue,
p.s-text-color--blue,
ul.s-text-color--blue,
li.s-text-color--blue,
a.s-text-color--blue,
i.s-text-color--blue {
  color: var(--blue-color);
}

.s-text-color--blue svg path,
.s-text-color--blue-hover:hover svg path,
.s-text-color--blue-active.active svg path,
svg.s-text-color--blue {
  fill: var(--blue-color);
}

.s-text-color--white,
.s-text-color--white-hover:hover,
.s-text-color--white-hover:hover h1,
.s-text-color--white-hover:hover h2,
.s-text-color--white-hover:hover h3,
.s-text-color--white-hover:hover h4,
.s-text-color--white-hover:hover h5,
.s-text-color--white-hover:hover h6,
.s-text-color--white-hover:hover p,
.s-text-color--white-hover:hover ul,
.s-text-color--white-hover:hover li,
.s-text-color--white-hover:hover a,
.s-text-color--white-hover:hover i,
.s-text-color--white-active.active,
.s-text-color--white-active.active h1,
.s-text-color--white-active.active h2,
.s-text-color--white-active.active h3,
.s-text-color--white-active.active h4,
.s-text-color--white-active.active h5,
.s-text-color--white-active.active h6,
.s-text-color--white-active.active p,
.s-text-color--white-active.active ul,
.s-text-color--white-active.active li,
.s-text-color--white-active.active a,
.s-text-color--white-active.active i,
.s-text-color--white h1,
.s-text-color--white h2,
.s-text-color--white h3,
.s-text-color--white h4,
.s-text-color--white h5,
.s-text-color--white h6,
.s-text-color--white p,
.s-text-color--white ul,
.s-text-color--white li,
.s-text-color--white a:not(.c-button),
.s-text-color--white i,
.s-text-color--white label,
.s-text-color--white .hs-form-required,
h1.s-text-color--white,
h2.s-text-color--white,
h3.s-text-color--white,
h4.s-text-color--white,
h5.s-text-color--white,
h6.s-text-color--white,
p.s-text-color--white,
ul.s-text-color--white,
li.s-text-color--white,
a.s-text-color--white:not(.c-button),
i.s-text-color--white {
  color: var(--white-color);
}

.s-text-color--white svg path,
.s-text-color--white-hover:hover svg path,
.s-text-color--white-active.active svg path,
svg.s-text-color--white {
  fill: var(--white-color);
}

.s-section-drop-shadow {
  box-shadow: var(--drop-shadow);
}

/* Brand gradient backgrounds — GradientBackground module (Colour 1/2, type, position) */
.dnd-section:has(.s-background-gradient__fade--purple-to-purple--25) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 25%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--purple-to-purple--50) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 50%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--purple-to-purple--75) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 75%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--purple-to-purple--25) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 25%, var(--purple-color) 25%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--purple-to-purple--50) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 50%, var(--purple-color) 50%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--purple-to-purple--75) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 75%, var(--purple-color) 75%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--purple-to-blue--25) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--blue-color) 25%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--purple-to-blue--50) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--blue-color) 50%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--purple-to-blue--75) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--blue-color) 75%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--purple-to-blue--25) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 25%, var(--blue-color) 25%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--purple-to-blue--50) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 50%, var(--blue-color) 50%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--purple-to-blue--75) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 75%, var(--blue-color) 75%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--purple-to-teal--25) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--teal-color) 25%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--purple-to-teal--50) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--teal-color) 50%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--purple-to-teal--75) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--teal-color) 75%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--purple-to-teal--25) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 25%, var(--teal-color) 25%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--purple-to-teal--50) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 50%, var(--teal-color) 50%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--purple-to-teal--75) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 75%, var(--teal-color) 75%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--purple-to-cerise--25) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--cerise-color) 25%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--purple-to-cerise--50) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--cerise-color) 50%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--purple-to-cerise--75) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--cerise-color) 75%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--purple-to-cerise--25) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 25%, var(--cerise-color) 25%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--purple-to-cerise--50) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 50%, var(--cerise-color) 50%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--purple-to-cerise--75) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 75%, var(--cerise-color) 75%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--purple-to-white--25) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--white-color) 25%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--purple-to-white--50) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--white-color) 50%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--purple-to-white--75) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--white-color) 75%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--purple-to-white--25) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 25%, var(--white-color) 25%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--purple-to-white--50) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 50%, var(--white-color) 50%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--purple-to-white--75) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 75%, var(--white-color) 75%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--purple-to-grey--25) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--grey-color) 25%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--purple-to-grey--50) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--grey-color) 50%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--purple-to-grey--75) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--grey-color) 75%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--purple-to-grey--25) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 25%, var(--grey-color) 25%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--purple-to-grey--50) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 50%, var(--grey-color) 50%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--purple-to-grey--75) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 75%, var(--grey-color) 75%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--blue-to-purple--25) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--purple-color) 25%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--blue-to-purple--50) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--purple-color) 50%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--blue-to-purple--75) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--purple-color) 75%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--blue-to-purple--25) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 25%, var(--purple-color) 25%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--blue-to-purple--50) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 50%, var(--purple-color) 50%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--blue-to-purple--75) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 75%, var(--purple-color) 75%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--blue-to-blue--25) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 25%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--blue-to-blue--50) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 50%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--blue-to-blue--75) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 75%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--blue-to-blue--25) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 25%, var(--blue-color) 25%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--blue-to-blue--50) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 50%, var(--blue-color) 50%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--blue-to-blue--75) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 75%, var(--blue-color) 75%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--blue-to-teal--25) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--teal-color) 25%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--blue-to-teal--50) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--teal-color) 50%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--blue-to-teal--75) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--teal-color) 75%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--blue-to-teal--25) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 25%, var(--teal-color) 25%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--blue-to-teal--50) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 50%, var(--teal-color) 50%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--blue-to-teal--75) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 75%, var(--teal-color) 75%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--blue-to-cerise--25) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--cerise-color) 25%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--blue-to-cerise--50) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--cerise-color) 50%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--blue-to-cerise--75) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--cerise-color) 75%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--blue-to-cerise--25) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 25%, var(--cerise-color) 25%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--blue-to-cerise--50) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 50%, var(--cerise-color) 50%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--blue-to-cerise--75) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 75%, var(--cerise-color) 75%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--blue-to-white--25) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--white-color) 25%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--blue-to-white--50) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--white-color) 50%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--blue-to-white--75) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--white-color) 75%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--blue-to-white--25) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 25%, var(--white-color) 25%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--blue-to-white--50) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 50%, var(--white-color) 50%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--blue-to-white--75) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 75%, var(--white-color) 75%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--blue-to-grey--25) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--grey-color) 25%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--blue-to-grey--50) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--grey-color) 50%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--blue-to-grey--75) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--grey-color) 75%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--blue-to-grey--25) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 25%, var(--grey-color) 25%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--blue-to-grey--50) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 50%, var(--grey-color) 50%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--blue-to-grey--75) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 75%, var(--grey-color) 75%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--teal-to-purple--25) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--purple-color) 25%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--teal-to-purple--50) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--purple-color) 50%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--teal-to-purple--75) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--purple-color) 75%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--teal-to-purple--25) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 25%, var(--purple-color) 25%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--teal-to-purple--50) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 50%, var(--purple-color) 50%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--teal-to-purple--75) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 75%, var(--purple-color) 75%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--teal-to-blue--25) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--blue-color) 25%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--teal-to-blue--50) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--blue-color) 50%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--teal-to-blue--75) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--blue-color) 75%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--teal-to-blue--25) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 25%, var(--blue-color) 25%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--teal-to-blue--50) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 50%, var(--blue-color) 50%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--teal-to-blue--75) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 75%, var(--blue-color) 75%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--teal-to-teal--25) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 25%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--teal-to-teal--50) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 50%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--teal-to-teal--75) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 75%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--teal-to-teal--25) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 25%, var(--teal-color) 25%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--teal-to-teal--50) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 50%, var(--teal-color) 50%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--teal-to-teal--75) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 75%, var(--teal-color) 75%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--teal-to-cerise--25) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--cerise-color) 25%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--teal-to-cerise--50) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--cerise-color) 50%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--teal-to-cerise--75) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--cerise-color) 75%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--teal-to-cerise--25) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 25%, var(--cerise-color) 25%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--teal-to-cerise--50) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 50%, var(--cerise-color) 50%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--teal-to-cerise--75) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 75%, var(--cerise-color) 75%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--teal-to-white--25) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--white-color) 25%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--teal-to-white--50) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--white-color) 50%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--teal-to-white--75) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--white-color) 75%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--teal-to-white--25) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 25%, var(--white-color) 25%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--teal-to-white--50) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 50%, var(--white-color) 50%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--teal-to-white--75) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 75%, var(--white-color) 75%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--teal-to-grey--25) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--grey-color) 25%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--teal-to-grey--50) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--grey-color) 50%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--teal-to-grey--75) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--grey-color) 75%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--teal-to-grey--25) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 25%, var(--grey-color) 25%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--teal-to-grey--50) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 50%, var(--grey-color) 50%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--teal-to-grey--75) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 75%, var(--grey-color) 75%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--cerise-to-purple--25) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--purple-color) 25%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--cerise-to-purple--50) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--purple-color) 50%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--cerise-to-purple--75) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--purple-color) 75%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--cerise-to-purple--25) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 25%, var(--purple-color) 25%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--cerise-to-purple--50) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 50%, var(--purple-color) 50%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--cerise-to-purple--75) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 75%, var(--purple-color) 75%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--cerise-to-blue--25) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--blue-color) 25%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--cerise-to-blue--50) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--blue-color) 50%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--cerise-to-blue--75) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--blue-color) 75%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--cerise-to-blue--25) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 25%, var(--blue-color) 25%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--cerise-to-blue--50) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 50%, var(--blue-color) 50%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--cerise-to-blue--75) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 75%, var(--blue-color) 75%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--cerise-to-teal--25) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--teal-color) 25%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--cerise-to-teal--50) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--teal-color) 50%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--cerise-to-teal--75) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--teal-color) 75%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--cerise-to-teal--25) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 25%, var(--teal-color) 25%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--cerise-to-teal--50) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 50%, var(--teal-color) 50%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--cerise-to-teal--75) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 75%, var(--teal-color) 75%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--cerise-to-cerise--25) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 25%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--cerise-to-cerise--50) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 50%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--cerise-to-cerise--75) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 75%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--cerise-to-cerise--25) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 25%, var(--cerise-color) 25%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--cerise-to-cerise--50) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 50%, var(--cerise-color) 50%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--cerise-to-cerise--75) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 75%, var(--cerise-color) 75%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--cerise-to-white--25) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--white-color) 25%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--cerise-to-white--50) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--white-color) 50%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--cerise-to-white--75) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--white-color) 75%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--cerise-to-white--25) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 25%, var(--white-color) 25%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--cerise-to-white--50) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 50%, var(--white-color) 50%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--cerise-to-white--75) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 75%, var(--white-color) 75%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--cerise-to-grey--25) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--grey-color) 25%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--cerise-to-grey--50) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--grey-color) 50%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--cerise-to-grey--75) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--grey-color) 75%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--cerise-to-grey--25) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 25%, var(--grey-color) 25%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--cerise-to-grey--50) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 50%, var(--grey-color) 50%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--cerise-to-grey--75) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 75%, var(--grey-color) 75%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--white-to-purple--25) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--purple-color) 25%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--white-to-purple--50) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--purple-color) 50%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--white-to-purple--75) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--purple-color) 75%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--white-to-purple--25) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 25%, var(--purple-color) 25%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--white-to-purple--50) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 50%, var(--purple-color) 50%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--white-to-purple--75) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 75%, var(--purple-color) 75%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--white-to-blue--25) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--blue-color) 25%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--white-to-blue--50) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--blue-color) 50%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--white-to-blue--75) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--blue-color) 75%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--white-to-blue--25) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 25%, var(--blue-color) 25%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--white-to-blue--50) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 50%, var(--blue-color) 50%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--white-to-blue--75) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 75%, var(--blue-color) 75%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--white-to-teal--25) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--teal-color) 25%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--white-to-teal--50) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--teal-color) 50%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--white-to-teal--75) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--teal-color) 75%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--white-to-teal--25) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 25%, var(--teal-color) 25%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--white-to-teal--50) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 50%, var(--teal-color) 50%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--white-to-teal--75) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 75%, var(--teal-color) 75%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--white-to-cerise--25) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--cerise-color) 25%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--white-to-cerise--50) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--cerise-color) 50%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--white-to-cerise--75) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--cerise-color) 75%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--white-to-cerise--25) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 25%, var(--cerise-color) 25%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--white-to-cerise--50) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 50%, var(--cerise-color) 50%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--white-to-cerise--75) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 75%, var(--cerise-color) 75%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--white-to-white--25) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 25%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--white-to-white--50) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 50%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--white-to-white--75) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 75%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--white-to-white--25) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 25%, var(--white-color) 25%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--white-to-white--50) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 50%, var(--white-color) 50%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--white-to-white--75) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 75%, var(--white-color) 75%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--white-to-grey--25) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--grey-color) 25%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--white-to-grey--50) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--grey-color) 50%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--white-to-grey--75) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--grey-color) 75%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--white-to-grey--25) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 25%, var(--grey-color) 25%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--white-to-grey--50) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 50%, var(--grey-color) 50%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--white-to-grey--75) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 75%, var(--grey-color) 75%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--grey-to-purple--25) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--purple-color) 25%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--grey-to-purple--50) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--purple-color) 50%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--grey-to-purple--75) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--purple-color) 75%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--grey-to-purple--25) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 25%, var(--purple-color) 25%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--grey-to-purple--50) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 50%, var(--purple-color) 50%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--grey-to-purple--75) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 75%, var(--purple-color) 75%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--grey-to-blue--25) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--blue-color) 25%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--grey-to-blue--50) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--blue-color) 50%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--grey-to-blue--75) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--blue-color) 75%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--grey-to-blue--25) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 25%, var(--blue-color) 25%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--grey-to-blue--50) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 50%, var(--blue-color) 50%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--grey-to-blue--75) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 75%, var(--blue-color) 75%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--grey-to-teal--25) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--teal-color) 25%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--grey-to-teal--50) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--teal-color) 50%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--grey-to-teal--75) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--teal-color) 75%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--grey-to-teal--25) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 25%, var(--teal-color) 25%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--grey-to-teal--50) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 50%, var(--teal-color) 50%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--grey-to-teal--75) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 75%, var(--teal-color) 75%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--grey-to-cerise--25) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--cerise-color) 25%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--grey-to-cerise--50) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--cerise-color) 50%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--grey-to-cerise--75) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--cerise-color) 75%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--grey-to-cerise--25) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 25%, var(--cerise-color) 25%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--grey-to-cerise--50) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 50%, var(--cerise-color) 50%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--grey-to-cerise--75) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 75%, var(--cerise-color) 75%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--grey-to-white--25) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--white-color) 25%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--grey-to-white--50) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--white-color) 50%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--grey-to-white--75) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--white-color) 75%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--grey-to-white--25) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 25%, var(--white-color) 25%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--grey-to-white--50) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 50%, var(--white-color) 50%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--grey-to-white--75) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 75%, var(--white-color) 75%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--grey-to-grey--25) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 25%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--grey-to-grey--50) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 50%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--grey-to-grey--75) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 75%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--grey-to-grey--25) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 25%, var(--grey-color) 25%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--grey-to-grey--50) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 50%, var(--grey-color) 50%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--grey-to-grey--75) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 75%, var(--grey-color) 75%, var(--grey-color) 100%);
}
/* GradientBackground — positions 80%, 85%, 90%, 95% */

.dnd-section:has(.s-background-gradient__fade--purple-to-purple--80) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 80%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--purple-to-purple--85) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 85%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--purple-to-purple--90) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 90%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--purple-to-purple--95) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 95%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--purple-to-purple--80) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 80%, var(--purple-color) 80%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--purple-to-purple--85) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 85%, var(--purple-color) 85%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--purple-to-purple--90) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 90%, var(--purple-color) 90%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--purple-to-purple--95) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 95%, var(--purple-color) 95%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--purple-to-blue--80) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--blue-color) 80%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--purple-to-blue--85) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--blue-color) 85%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--purple-to-blue--90) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--blue-color) 90%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--purple-to-blue--95) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--blue-color) 95%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--purple-to-blue--80) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 80%, var(--blue-color) 80%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--purple-to-blue--85) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 85%, var(--blue-color) 85%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--purple-to-blue--90) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 90%, var(--blue-color) 90%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--purple-to-blue--95) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 95%, var(--blue-color) 95%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--purple-to-teal--80) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--teal-color) 80%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--purple-to-teal--85) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--teal-color) 85%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--purple-to-teal--90) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--teal-color) 90%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--purple-to-teal--95) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--teal-color) 95%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--purple-to-teal--80) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 80%, var(--teal-color) 80%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--purple-to-teal--85) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 85%, var(--teal-color) 85%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--purple-to-teal--90) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 90%, var(--teal-color) 90%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--purple-to-teal--95) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 95%, var(--teal-color) 95%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--purple-to-cerise--80) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--cerise-color) 80%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--purple-to-cerise--85) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--cerise-color) 85%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--purple-to-cerise--90) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--cerise-color) 90%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--purple-to-cerise--95) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--cerise-color) 95%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--purple-to-cerise--80) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 80%, var(--cerise-color) 80%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--purple-to-cerise--85) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 85%, var(--cerise-color) 85%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--purple-to-cerise--90) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 90%, var(--cerise-color) 90%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--purple-to-cerise--95) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 95%, var(--cerise-color) 95%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--purple-to-white--80) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--white-color) 80%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--purple-to-white--85) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--white-color) 85%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--purple-to-white--90) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--white-color) 90%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--purple-to-white--95) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--white-color) 95%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--purple-to-white--80) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 80%, var(--white-color) 80%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--purple-to-white--85) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 85%, var(--white-color) 85%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--purple-to-white--90) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 90%, var(--white-color) 90%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--purple-to-white--95) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 95%, var(--white-color) 95%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--purple-to-grey--80) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--grey-color) 80%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--purple-to-grey--85) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--grey-color) 85%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--purple-to-grey--90) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--grey-color) 90%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--purple-to-grey--95) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--grey-color) 95%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--purple-to-grey--80) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 80%, var(--grey-color) 80%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--purple-to-grey--85) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 85%, var(--grey-color) 85%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--purple-to-grey--90) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 90%, var(--grey-color) 90%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--purple-to-grey--95) {
  background: linear-gradient(180deg, var(--purple-color) 0%, var(--purple-color) 95%, var(--grey-color) 95%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--blue-to-purple--80) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--purple-color) 80%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--blue-to-purple--85) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--purple-color) 85%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--blue-to-purple--90) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--purple-color) 90%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--blue-to-purple--95) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--purple-color) 95%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--blue-to-purple--80) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 80%, var(--purple-color) 80%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--blue-to-purple--85) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 85%, var(--purple-color) 85%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--blue-to-purple--90) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 90%, var(--purple-color) 90%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--blue-to-purple--95) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 95%, var(--purple-color) 95%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--blue-to-blue--80) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 80%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--blue-to-blue--85) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 85%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--blue-to-blue--90) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 90%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--blue-to-blue--95) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 95%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--blue-to-blue--80) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 80%, var(--blue-color) 80%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--blue-to-blue--85) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 85%, var(--blue-color) 85%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--blue-to-blue--90) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 90%, var(--blue-color) 90%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--blue-to-blue--95) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 95%, var(--blue-color) 95%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--blue-to-teal--80) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--teal-color) 80%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--blue-to-teal--85) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--teal-color) 85%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--blue-to-teal--90) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--teal-color) 90%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--blue-to-teal--95) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--teal-color) 95%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--blue-to-teal--80) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 80%, var(--teal-color) 80%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--blue-to-teal--85) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 85%, var(--teal-color) 85%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--blue-to-teal--90) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 90%, var(--teal-color) 90%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--blue-to-teal--95) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 95%, var(--teal-color) 95%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--blue-to-cerise--80) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--cerise-color) 80%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--blue-to-cerise--85) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--cerise-color) 85%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--blue-to-cerise--90) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--cerise-color) 90%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--blue-to-cerise--95) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--cerise-color) 95%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--blue-to-cerise--80) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 80%, var(--cerise-color) 80%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--blue-to-cerise--85) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 85%, var(--cerise-color) 85%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--blue-to-cerise--90) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 90%, var(--cerise-color) 90%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--blue-to-cerise--95) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 95%, var(--cerise-color) 95%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--blue-to-white--80) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--white-color) 80%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--blue-to-white--85) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--white-color) 85%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--blue-to-white--90) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--white-color) 90%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--blue-to-white--95) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--white-color) 95%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--blue-to-white--80) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 80%, var(--white-color) 80%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--blue-to-white--85) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 85%, var(--white-color) 85%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--blue-to-white--90) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 90%, var(--white-color) 90%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--blue-to-white--95) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 95%, var(--white-color) 95%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--blue-to-grey--80) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--grey-color) 80%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--blue-to-grey--85) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--grey-color) 85%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--blue-to-grey--90) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--grey-color) 90%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--blue-to-grey--95) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--grey-color) 95%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--blue-to-grey--80) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 80%, var(--grey-color) 80%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--blue-to-grey--85) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 85%, var(--grey-color) 85%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--blue-to-grey--90) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 90%, var(--grey-color) 90%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--blue-to-grey--95) {
  background: linear-gradient(180deg, var(--blue-color) 0%, var(--blue-color) 95%, var(--grey-color) 95%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--teal-to-purple--80) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--purple-color) 80%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--teal-to-purple--85) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--purple-color) 85%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--teal-to-purple--90) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--purple-color) 90%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--teal-to-purple--95) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--purple-color) 95%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--teal-to-purple--80) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 80%, var(--purple-color) 80%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--teal-to-purple--85) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 85%, var(--purple-color) 85%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--teal-to-purple--90) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 90%, var(--purple-color) 90%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--teal-to-purple--95) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 95%, var(--purple-color) 95%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--teal-to-blue--80) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--blue-color) 80%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--teal-to-blue--85) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--blue-color) 85%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--teal-to-blue--90) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--blue-color) 90%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--teal-to-blue--95) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--blue-color) 95%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--teal-to-blue--80) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 80%, var(--blue-color) 80%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--teal-to-blue--85) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 85%, var(--blue-color) 85%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--teal-to-blue--90) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 90%, var(--blue-color) 90%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--teal-to-blue--95) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 95%, var(--blue-color) 95%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--teal-to-teal--80) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 80%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--teal-to-teal--85) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 85%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--teal-to-teal--90) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 90%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--teal-to-teal--95) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 95%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--teal-to-teal--80) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 80%, var(--teal-color) 80%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--teal-to-teal--85) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 85%, var(--teal-color) 85%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--teal-to-teal--90) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 90%, var(--teal-color) 90%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--teal-to-teal--95) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 95%, var(--teal-color) 95%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--teal-to-cerise--80) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--cerise-color) 80%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--teal-to-cerise--85) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--cerise-color) 85%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--teal-to-cerise--90) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--cerise-color) 90%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--teal-to-cerise--95) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--cerise-color) 95%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--teal-to-cerise--80) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 80%, var(--cerise-color) 80%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--teal-to-cerise--85) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 85%, var(--cerise-color) 85%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--teal-to-cerise--90) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 90%, var(--cerise-color) 90%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--teal-to-cerise--95) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 95%, var(--cerise-color) 95%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--teal-to-white--80) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--white-color) 80%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--teal-to-white--85) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--white-color) 85%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--teal-to-white--90) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--white-color) 90%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--teal-to-white--95) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--white-color) 95%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--teal-to-white--80) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 80%, var(--white-color) 80%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--teal-to-white--85) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 85%, var(--white-color) 85%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--teal-to-white--90) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 90%, var(--white-color) 90%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--teal-to-white--95) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 95%, var(--white-color) 95%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--teal-to-grey--80) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--grey-color) 80%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--teal-to-grey--85) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--grey-color) 85%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--teal-to-grey--90) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--grey-color) 90%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--teal-to-grey--95) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--grey-color) 95%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--teal-to-grey--80) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 80%, var(--grey-color) 80%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--teal-to-grey--85) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 85%, var(--grey-color) 85%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--teal-to-grey--90) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 90%, var(--grey-color) 90%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--teal-to-grey--95) {
  background: linear-gradient(180deg, var(--teal-color) 0%, var(--teal-color) 95%, var(--grey-color) 95%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--cerise-to-purple--80) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--purple-color) 80%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--cerise-to-purple--85) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--purple-color) 85%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--cerise-to-purple--90) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--purple-color) 90%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--cerise-to-purple--95) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--purple-color) 95%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--cerise-to-purple--80) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 80%, var(--purple-color) 80%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--cerise-to-purple--85) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 85%, var(--purple-color) 85%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--cerise-to-purple--90) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 90%, var(--purple-color) 90%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--cerise-to-purple--95) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 95%, var(--purple-color) 95%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--cerise-to-blue--80) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--blue-color) 80%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--cerise-to-blue--85) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--blue-color) 85%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--cerise-to-blue--90) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--blue-color) 90%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--cerise-to-blue--95) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--blue-color) 95%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--cerise-to-blue--80) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 80%, var(--blue-color) 80%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--cerise-to-blue--85) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 85%, var(--blue-color) 85%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--cerise-to-blue--90) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 90%, var(--blue-color) 90%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--cerise-to-blue--95) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 95%, var(--blue-color) 95%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--cerise-to-teal--80) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--teal-color) 80%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--cerise-to-teal--85) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--teal-color) 85%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--cerise-to-teal--90) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--teal-color) 90%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--cerise-to-teal--95) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--teal-color) 95%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--cerise-to-teal--80) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 80%, var(--teal-color) 80%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--cerise-to-teal--85) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 85%, var(--teal-color) 85%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--cerise-to-teal--90) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 90%, var(--teal-color) 90%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--cerise-to-teal--95) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 95%, var(--teal-color) 95%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--cerise-to-cerise--80) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 80%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--cerise-to-cerise--85) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 85%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--cerise-to-cerise--90) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 90%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--cerise-to-cerise--95) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 95%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--cerise-to-cerise--80) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 80%, var(--cerise-color) 80%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--cerise-to-cerise--85) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 85%, var(--cerise-color) 85%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--cerise-to-cerise--90) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 90%, var(--cerise-color) 90%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--cerise-to-cerise--95) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 95%, var(--cerise-color) 95%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--cerise-to-white--80) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--white-color) 80%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--cerise-to-white--85) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--white-color) 85%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--cerise-to-white--90) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--white-color) 90%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--cerise-to-white--95) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--white-color) 95%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--cerise-to-white--80) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 80%, var(--white-color) 80%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--cerise-to-white--85) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 85%, var(--white-color) 85%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--cerise-to-white--90) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 90%, var(--white-color) 90%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--cerise-to-white--95) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 95%, var(--white-color) 95%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--cerise-to-grey--80) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--grey-color) 80%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--cerise-to-grey--85) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--grey-color) 85%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--cerise-to-grey--90) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--grey-color) 90%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--cerise-to-grey--95) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--grey-color) 95%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--cerise-to-grey--80) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 80%, var(--grey-color) 80%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--cerise-to-grey--85) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 85%, var(--grey-color) 85%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--cerise-to-grey--90) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 90%, var(--grey-color) 90%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--cerise-to-grey--95) {
  background: linear-gradient(180deg, var(--cerise-color) 0%, var(--cerise-color) 95%, var(--grey-color) 95%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--white-to-purple--80) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--purple-color) 80%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--white-to-purple--85) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--purple-color) 85%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--white-to-purple--90) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--purple-color) 90%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--white-to-purple--95) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--purple-color) 95%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--white-to-purple--80) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 80%, var(--purple-color) 80%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--white-to-purple--85) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 85%, var(--purple-color) 85%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--white-to-purple--90) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 90%, var(--purple-color) 90%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--white-to-purple--95) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 95%, var(--purple-color) 95%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--white-to-blue--80) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--blue-color) 80%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--white-to-blue--85) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--blue-color) 85%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--white-to-blue--90) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--blue-color) 90%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--white-to-blue--95) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--blue-color) 95%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--white-to-blue--80) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 80%, var(--blue-color) 80%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--white-to-blue--85) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 85%, var(--blue-color) 85%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--white-to-blue--90) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 90%, var(--blue-color) 90%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--white-to-blue--95) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 95%, var(--blue-color) 95%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--white-to-teal--80) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--teal-color) 80%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--white-to-teal--85) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--teal-color) 85%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--white-to-teal--90) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--teal-color) 90%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--white-to-teal--95) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--teal-color) 95%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--white-to-teal--80) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 80%, var(--teal-color) 80%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--white-to-teal--85) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 85%, var(--teal-color) 85%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--white-to-teal--90) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 90%, var(--teal-color) 90%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--white-to-teal--95) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 95%, var(--teal-color) 95%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--white-to-cerise--80) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--cerise-color) 80%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--white-to-cerise--85) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--cerise-color) 85%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--white-to-cerise--90) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--cerise-color) 90%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--white-to-cerise--95) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--cerise-color) 95%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--white-to-cerise--80) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 80%, var(--cerise-color) 80%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--white-to-cerise--85) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 85%, var(--cerise-color) 85%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--white-to-cerise--90) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 90%, var(--cerise-color) 90%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--white-to-cerise--95) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 95%, var(--cerise-color) 95%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--white-to-white--80) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 80%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--white-to-white--85) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 85%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--white-to-white--90) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 90%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--white-to-white--95) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 95%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--white-to-white--80) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 80%, var(--white-color) 80%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--white-to-white--85) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 85%, var(--white-color) 85%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--white-to-white--90) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 90%, var(--white-color) 90%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--white-to-white--95) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 95%, var(--white-color) 95%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--white-to-grey--80) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--grey-color) 80%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--white-to-grey--85) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--grey-color) 85%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--white-to-grey--90) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--grey-color) 90%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--white-to-grey--95) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--grey-color) 95%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--white-to-grey--80) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 80%, var(--grey-color) 80%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--white-to-grey--85) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 85%, var(--grey-color) 85%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--white-to-grey--90) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 90%, var(--grey-color) 90%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--white-to-grey--95) {
  background: linear-gradient(180deg, var(--white-color) 0%, var(--white-color) 95%, var(--grey-color) 95%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--grey-to-purple--80) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--purple-color) 80%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--grey-to-purple--85) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--purple-color) 85%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--grey-to-purple--90) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--purple-color) 90%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--grey-to-purple--95) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--purple-color) 95%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--grey-to-purple--80) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 80%, var(--purple-color) 80%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--grey-to-purple--85) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 85%, var(--purple-color) 85%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--grey-to-purple--90) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 90%, var(--purple-color) 90%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--grey-to-purple--95) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 95%, var(--purple-color) 95%, var(--purple-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--grey-to-blue--80) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--blue-color) 80%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--grey-to-blue--85) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--blue-color) 85%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--grey-to-blue--90) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--blue-color) 90%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--grey-to-blue--95) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--blue-color) 95%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--grey-to-blue--80) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 80%, var(--blue-color) 80%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--grey-to-blue--85) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 85%, var(--blue-color) 85%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--grey-to-blue--90) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 90%, var(--blue-color) 90%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--grey-to-blue--95) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 95%, var(--blue-color) 95%, var(--blue-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--grey-to-teal--80) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--teal-color) 80%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--grey-to-teal--85) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--teal-color) 85%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--grey-to-teal--90) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--teal-color) 90%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--grey-to-teal--95) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--teal-color) 95%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--grey-to-teal--80) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 80%, var(--teal-color) 80%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--grey-to-teal--85) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 85%, var(--teal-color) 85%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--grey-to-teal--90) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 90%, var(--teal-color) 90%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--grey-to-teal--95) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 95%, var(--teal-color) 95%, var(--teal-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--grey-to-cerise--80) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--cerise-color) 80%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--grey-to-cerise--85) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--cerise-color) 85%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--grey-to-cerise--90) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--cerise-color) 90%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--grey-to-cerise--95) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--cerise-color) 95%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--grey-to-cerise--80) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 80%, var(--cerise-color) 80%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--grey-to-cerise--85) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 85%, var(--cerise-color) 85%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--grey-to-cerise--90) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 90%, var(--cerise-color) 90%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--grey-to-cerise--95) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 95%, var(--cerise-color) 95%, var(--cerise-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--grey-to-white--80) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--white-color) 80%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--grey-to-white--85) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--white-color) 85%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--grey-to-white--90) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--white-color) 90%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--grey-to-white--95) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--white-color) 95%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--grey-to-white--80) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 80%, var(--white-color) 80%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--grey-to-white--85) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 85%, var(--white-color) 85%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--grey-to-white--90) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 90%, var(--white-color) 90%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--grey-to-white--95) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 95%, var(--white-color) 95%, var(--white-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--grey-to-grey--80) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 80%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--grey-to-grey--85) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 85%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--grey-to-grey--90) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 90%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__fade--grey-to-grey--95) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 95%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--grey-to-grey--80) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 80%, var(--grey-color) 80%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--grey-to-grey--85) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 85%, var(--grey-color) 85%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--grey-to-grey--90) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 90%, var(--grey-color) 90%, var(--grey-color) 100%);
}

.dnd-section:has(.s-background-gradient__hard-stop--grey-to-grey--95) {
  background: linear-gradient(180deg, var(--grey-color) 0%, var(--grey-color) 95%, var(--grey-color) 95%, var(--grey-color) 100%);
}
/* Menu and simple menu */

.hs-menu-wrapper ul {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  margin: 0;
  padding-left: 0;
}

/* Horizontal menu */

.hs-menu-wrapper.hs-menu-flow-horizontal .hs-menu-children-wrapper {
  flex-direction: column;
}

@media (max-width: 767px) {
  .hs-menu-wrapper.hs-menu-flow-horizontal ul {
    flex-direction: column;
  }
}

/* Vertical menu */

.hs-menu-wrapper.hs-menu-flow-vertical ul {
  flex-direction: column;
}

/* Flyouts */

.hs-menu-wrapper.hs-menu-flow-vertical.flyouts ul {
  display: inline-flex;
}

@media (max-width: 767px) {
  .hs-menu-wrapper.hs-menu-flow-vertical ul {
    display: flex;
  }
}

.hs-menu-wrapper.flyouts .hs-item-has-children {
  position: relative;
}

.hs-menu-wrapper.flyouts .hs-menu-children-wrapper {
  left: -9999px;
  opacity: 0;
  position: absolute;
}

.hs-menu-wrapper.flyouts .hs-menu-children-wrapper a {
  display: block;
  white-space: nowrap;
}

.hs-menu-wrapper.hs-menu-flow-horizontal.flyouts .hs-item-has-children:hover > .hs-menu-children-wrapper {
  left: 0;
  opacity: 1;
  top: 100%;
}

.hs-menu-wrapper.hs-menu-flow-vertical.flyouts .hs-item-has-children:hover > .hs-menu-children-wrapper {
  left: 100%;
  opacity: 1;
  top: 0;
}

@media (max-width: 767px) {
  .hs-menu-wrapper.flyouts .hs-menu-children-wrapper,
  .hs-menu-wrapper.hs-menu-flow-horizontal.flyouts .hs-item-has-children:hover > .hs-menu-children-wrapper,
  .hs-menu-wrapper.hs-menu-flow-vertical.flyouts .hs-item-has-children:hover > .hs-menu-children-wrapper {
    left: 0;
    opacity: 1;
    position: relative;
    top: auto;
  }
}

/* CTA, logo, and rich text images */

.hs_cos_wrapper_type_cta img,
.hs_cos_wrapper_type_logo img,
.hs_cos_wrapper_type_rich_text img {
  height: auto;
  max-width: 100%;
}

span.hs_cos_wrapper_type_linked_image {
  display: flex;
}

/* In-page editor UI */

.in-editor-ui-label {
  background: #fff;
  border: 1px dotted blue;
  color: var(--primary-color) !important;
  font-family: 'Courier New', Courier, monospace;
  font-weight: 300;
  padding: 10px 15px;
}

/* Tools/Utility classes */

.l-negative-scroll-position,
a[data-hs-anchor="true"] {
  display: block;
  height: 1px;
  position: relative;
  top: -200px;
  width: 1px;
  z-index: -9999;
}
.l-footer {
  background-color: var(--footer-background-color);
  color: var(--white-color);
  padding-top: 60px;
  padding-left: 20px;
  padding-right: 20px;
}

.l-footer h2, 
.l-footer h3,
.l-footer h4,
.l-footer h5,
.l-footer h6 {
  color: var(--white-color);
}

.l-footer ul {
  gap: 10px;
}

.l-footer ul:not(.hs-menu-children-wrapper) {
  gap: 0;
  margin-top: 15px;
}

.l-footer ul.hs-menu-children-wrapper {
  margin-top: 10px;
}

.l-footer li {
  margin-bottom: 0;
  padding-left: 0;
}

.l-footer ul li a {
  color: var(--white-color);
  font-weight: 500;
  line-height: 100%;
  text-decoration: none;
}

.l-footer ul li a:hover,
.l-footer ul li a:focus {
  color: var(--teal-color);
}

.l-footer .hs-menu-item.hs-menu-depth-1:not(:last-child) {
  margin-bottom: 16px;
}

.l-footer .hs-menu-item.hs-menu-depth-2.hs-item-has-children > a{
  font-weight: 700;
}

.l-footer .hs-menu-item.hs-menu-depth-2.hs-item-has-children ul.hs-menu-children-wrapper {
  padding-left: 10px;
}

.l-footer__main-section {
  position: relative;
}

.l-footer__inner {
  flex-direction: column;
  flex-wrap: wrap;
  margin: 0 auto;
  max-width: var(--container-width);
}

.l-footer__main-section__logo-and-feedback {
  margin: 0 auto;
  max-width: var(--container-width);
  padding-bottom: 20px;
}

.l-footer__main-section__left,
.l-footer__main-section__right {
  width: 100%;
}

.l-footer__main-section__logo {
  width: 100%;
}

.l-footer__main-section__logo img {
  border-radius: 0;
  margin-bottom: 0;
  max-width: 180px;
  width: 100%;
}

.c-footer__main-section__feedback {
  max-width: 200px;
  padding: 20px 20px 20px 0;
}

.c-footer__main-section__feedback .c-button {
  padding: 15px 20px !important;
  width: 100%;
}

.l-footer__main-section-navigation {
  flex-grow: 1;
  gap: 30px;
  justify-content: flex-start;
  margin-top: 30px;
}

/* Top-level nav links only - HubSpot adds hs-menu-depth-1 for first-level items */
.l-footer__main-section-navigation .hs-menu-depth-1 > a {
  font-weight: 700;
}

.l-footer__main-section-navigation-column {
  width: calc(50% - 15px);
}

.l-footer__main-section__right-form form {
  margin-top: 0;
}

.l-footer__main-section__right-form [data-hsfc-id=Renderer] form label {
  color: var(--white-color) !important;
}

.l-footer__main-section__right-form [data-hsfc-id=Renderer] form,
.l-footer__main-section__right-form [data-hsfc-id=Renderer] form input,
.l-footer__main-section__right-form [data-hsfc-id=Renderer] form textarea,
.l-footer__main-section__right-form [data-hsfc-id=Renderer] form select,
.l-footer__main-section__right-form [data-hsfc-id=Renderer] form button {
  font-family: var(--font-family) !important;
}

/* Submit button */
.l-footer__main-section__right-form form input[type=submit],
.l-footer__main-section__right-form form .hs-button {
  background-color: var(--white-color);
  color: var(--primary-color);
  float: right;
  
}

.l-footer__main-section__right-form [data-hsfc-id=Renderer] form input {
  background-color: var(--white-color);
  border: none;
  border-radius: 0;
}

.l-footer__main-section__right-form [data-hsfc-id=Renderer] .hsfc-Step .hsfc-Step__Content {
  padding: 0;
}

.l-footer__main-section__right-form [data-hsfc-id=Renderer] .hsfc-Row {
  gap: 16px;
  margin-bottom: 13px;
}

.l-footer__main-section__right-form [data-hsfc-id=Renderer] .hsfc-Row:last-child {
  margin-bottom: 0;
}

.l-footer__main-section__right-form [data-hsfc-id=Renderer] .hsfc-NavigationRow {
  margin-top: 20px;
}

.l-footer__main-section__right-form [data-hsfc-id=Renderer] .hsfc-NavigationRow__Buttons {
  justify-content: flex-start !important;
}

.l-footer__main-section__right-form [data-hsfc-id=Renderer] .hsfc-NavigationRow__Buttons button {
  align-items: center;
  background-color: var(--teal-color) !important;
  color: var(--purple-color) !important;
  border: 2px solid var(--purple-color) !important;
  display: inline-flex;
  gap: 10px !important;
  justify-content: center !important;
  padding: 15px 40px !important;
  position: relative;
}

.l-footer__bottom-bar {
  background-color: var(--dark-color);
  color: var(--white-color);
}

.l-footer__bottom-bar .l-footer__inner {
  padding: 30px 0;
}

.l-footer__bottom-bar a {
  color: var(--white-color) !important;
}

.l-footer__bottom-bar a:hover,
.l-footer__bottom-bar a:focus {
  color: var(--teal-color) !important;
}

.l-footer__bottom-bar ul[role="menu"] {
  gap: 15px;
}

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) { }

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
  .l-footer {
    padding-left: 40px;
    padding-right: 40px;
  }
}

/* X-Large devices (large desktops, 1200px and up) */
@media (min-width: 992px) {
  .l-footer__inner {
    flex-direction: row;
  }

  .l-footer__main-section__left {
    padding-right: 5%;
    width: 50%;
  }

  .l-footer__main-section__right {
    padding-left: 5%;
    width: 50%;
  }

  .l-footer__main-section-navigation {
    margin-top: 0;
    gap: 15px;
    justify-content: space-between;
  }

  .l-footer__main-section-navigation-column {
    width: auto;
  }
  .l-footer__main-section__logo-and-feedback {
    padding-bottom: 40px;
  }
  .l-footer__main-section__logo {
    max-width: 180px;
  }
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 1200px) {}

/* XX-Large devices (larger desktops, 1400px and up) */
@media (min-width: 1400px) {
  .l-footer {
    padding-left: unset;
    padding-right: unset;
  }
}
body.js-no-scroll {
  overflow: hidden;
}

/* Exclude HubSpot embed rows (classes like embed-410652075196-row-0-...) */
.l-header-style--fixed #l-main-content .dnd-section:first-of-type:not([class*="embed-"]) {
  padding-top: calc(var(--header-height-mobile) + var(--header-padding-top-mobile) + var(--hero-section-padding-top-mobile));
}

.l-header {
  background-color: transparent;
  padding: var(--header-padding-top-mobile) 20px 0 20px;
  transition: all .5s ease;
  margin: 0 auto;
  width: 100vw;
  z-index: 2;
}

.l-header:has(.js-header-mobile-menu--active) {
  background-color: var(--header-background-color);
  transition: none;
}

.l-header:has(.js-header-mobile-menu--active) .l-header__inner {
  border-radius: 0;
  box-shadow: none;
}

.l-header--fixed {
  position: fixed;
}

.l-header__inner {
  background-color: var(--header-background-color);
  border-radius: 170px;
  box-shadow: var(--drop-shadow);
  padding: var(--header-default-inner-padding-y) 25px;
  margin: 0 auto;
  width: 100%;
  max-width: var(--container-width);
  transition: padding 0.5s ease;
}

.c-header__logo a {
  display: flex;
}

.c-header__logo img {
  max-height: 100%;
  max-width: 175px;
}

.c-header__subtitle {
  font-size:10px;
  margin-bottom: 0;
}

.c-header__logo img {
  max-height: 100%;
  border-radius: 0;
  margin-bottom: 0;
}

/* MENU */
.c-header__menu {
  display: none;
}

.c-header__menu ul[role="menu"] {
  justify-content: space-evenly;
  gap: 15px;
}

.c-header__menu ul[role="menu"] a {
  color: var(--primary-color);
  text-decoration: none;
}

.c-header__menu ul[role="menu"] a:hover,
.c-header__menu ul[role="menu"] a:focus {
  color: var(--teal-color);
}

.c-header__menu ul[role="menu"] li.hs-menu-item.hs-menu-depth-1 > a {}

.c-header__menu li {
  margin-bottom: 0;
}

.c-header__menu li.hs-menu-depth-1.hs-item-has-children > a {
  display: inline-block;
}

.c-header__menu li.hs-menu-depth-1.hs-item-has-children > a::after {
  content: '';
  display: inline-block;
  width: 8px;
  height: 5px;
  margin-left: 8px;
  vertical-align: middle;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5' viewBox='0 0 8 5' fill='none'%3E%3Cpath d='M3.75 4.625L0 0.875L0.875 0L3.75 2.875L6.625 0L7.5 0.875L3.75 4.625Z' fill='white'/%3E%3C/svg%3E");
}

.c-header__menu li.hs-item-has-children {
  position: relative;
}

.c-header__menu li.hs-menu-depth-1.hs-item-has-children::after,
.c-header__menu li.hs-menu-depth-2.hs-item-has-children::after {
  content: '';
  position: absolute;
  background-color: transparent;
}

.c-header__menu li.hs-menu-depth-1.hs-item-has-children::after {
  top: 100%;
  left: 0;
  width: 100%;
  height: 12px;
}

.c-header__menu li.hs-menu-depth-2.hs-item-has-children::after {
  width: 0;
  height: 0;
  top: auto;
  right: auto;
  transform: none;
}

.c-header__menu .hs-menu-wrapper.flyouts .hs-menu-children-wrapper {
  background-color: var(--header-background-color);
  box-shadow: var(--drop-shadow);
  gap: 10px;
  padding: 10px 20px 10px 10px;
  border-radius: 10px;
  min-width: 100%;
}

.c-header__menu .hs-menu-wrapper.flyouts li.hs-menu-depth-1.hs-item-has-children > .hs-menu-children-wrapper {
  top: calc(100% + 12px);
}

.c-header__menu .hs-menu-wrapper.flyouts li.hs-menu-depth-2.hs-item-has-children > .hs-menu-children-wrapper {
  left: calc(100% + 18px);
  top: -10px;
  z-index: 2;
}

/* BUTTONS */
.c-header__buttons {
  display: none;
  height: 100%;
}

.c-header__buttons .l-button-group {
  padding-top: 0;
}

.c-header__button-item {
  color: var(--primary-color);
  gap: 10px;
  font-size: 1.2rem;
  font-weight: 500;
  height: 100%;
  padding: 24px 40px;
  text-decoration: none !important;
}

/* BURGER MENU BUTTON */
.c-header__burger-menu {
  background-color: transparent;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px;
  color: var(--primary-color);
  position: relative;
  width: 24px;
  height: 24px;
  -webkit-appearance: unset;
}

.c-header__burger-menu:focus {
  outline: 2px solid var(--primary-color);
  outline-offset: 2px;
}

.c-header__burger-menu.js-header-mobile-menu--active {
  display: flex;
}

.c-header__burger-menu svg {
  width: 24px;
  height: 24px;
}

/* MOBILE MENU ICONS - Both positioned absolutely for smooth transition */
.c-header-mobile-menu__icon--open,
.c-header-mobile-menu__icon--close {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  transition: opacity 300ms ease, transform 300ms ease;
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.c-header-mobile-menu__icon--open {
  opacity: 1;
  visibility: visible;
}

.c-header-mobile-menu__icon--close {
  opacity: 0;
  visibility: hidden;
}

.js-header-mobile-menu--active .c-header-mobile-menu__icon--open {
  opacity: 0;
  visibility: hidden;
}

.js-header-mobile-menu--active .c-header-mobile-menu__icon--close {
  opacity: 1;
  visibility: visible;
}

/* MENU ICONS */
button.c-header-mobile-menu__icon--open,
button.c-header-mobile-menu__icon--close,
button.c-header-search__icon,
button.c-site-search-modal__close {
  background-color: transparent;
  border: none;
  cursor: pointer;
  font-size: 1rem;
  line-height: 1;
  -webkit-appearance: unset;
}

/* MOBILE MENU OVERLAY */
.c-header__mobile-menu-overlay {
  background-color: transparent;
  display: none;
  height: 100vh;
  left: 0;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 998;
}

.c-header__mobile-menu-overlay.js-header-mobile-menu--active {
  display: block;
}

/* MOBILE MENU CONTAINER */
.c-header__mobile-menu {
  background-color: var(--header-background-color);
  box-shadow: var(--drop-shadow);
  bottom: 0;
  display: none;
  left: 0;
  overflow-y: auto;
  position: fixed;
  top: calc(var(--header-height-mobile) - 10px);
  transition: top 0.5s ease;
  width: 100%;
  z-index: 999;
}

.c-header__mobile-menu.js-header-mobile-menu--active {
  display: block;
}

.c-header__mobile-menu-inner {
  display: flex;
  flex-direction: column;
  min-height: 100%;
  padding: 20px;
}

.c-header__mobile-menu-content {
  width: 100%;
}

/* MOBILE MENU BUTTONS */
.c-header__mobile-menu-buttons {
  gap: 15px;
  width: 100%;
}

.c-header__mobile-button-item {
  color: var(--primary-color);
  display: block;
  font-size: 1.2rem;
  font-weight: 500;
  gap: 10px;
  padding: 16px 24px;
  text-align: center;
  text-decoration: none !important;
  width: 100%;
}

.c-header__mobile-button-item:focus {
  outline: 2px solid var(--primary-color);
  outline-offset: 2px;
}

/* MOBILE MENU LIST */
.c-header-mobile-menu__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* MOBILE MENU LIST ITEMS - Add borders to all items */
.c-header-mobile-menu__list > li {
  margin: 0 !important;
}


/* MOBILE MENU LINKS */
.c-header-mobile-menu__link {
  color: var(--primary-color);
  display: block;
  font-weight: 500;
  padding: 0 0 20px 0;
  text-decoration: none;
  width: 100%;
}

.c-header-mobile-menu__link:hover,
.c-header-mobile-menu__link:focus {
  color: var(--secondary-color);
  outline: none;
}

/* MOBILE MENU ACCORDION */

.c-header-mobile-menu__accordion-summary {
  cursor: pointer;
  gap: 20px;
  list-style: none;
  padding-bottom: 20px;
}

.c-header-mobile-menu__accordion-summary::-webkit-details-marker {
  display: none;
}

.c-header-mobile-menu__accordion-link {
  color: var(--primary-color);
  text-decoration: none;
  flex: 1;
}

.c-header-mobile-menu__accordion-link:hover,
.c-header-mobile-menu__accordion-link:focus {
  color: var(--secondary-color);
  outline: none;
}

.c-header-mobile-menu__accordion-icon {
  color: var(--primary-color);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 200ms ease;
  flex-shrink: 0;
}

.c-header-mobile-menu__accordion-icon svg {
  width: 18px;
  height: 18px;
}

.c-header-mobile-menu__accordion-item[open] .c-header-mobile-menu__accordion-icon {
  transform: rotate(90deg);
  color: var(--secondary-color);
}

.c-header-mobile-menu__accordion-panel {
  padding: 0 0 10px 0;
}

.c-header-mobile-menu__accordion-panel ul[role="menu"] {
  list-style: none;
  margin: 0;
  padding: 0;
}

.c-header-mobile-menu__accordion-panel ul[role="menu"] li {
  padding: 0;
}

.c-header-mobile-menu__accordion-panel ul[role="menu"] a {
  color: var(--primary-color);
  display: block;
  padding: 10px 0;
  text-decoration: none;
}

.c-header-mobile-menu__accordion-panel ul[role="menu"] a:hover,
.c-header-mobile-menu__accordion-panel ul[role="menu"] a:focus {
  color: var(--secondary-color);
  outline: none;
}

/* SITE SEARCH */
.c-site-search-modal {
  background: rgba(255,255,255,.95);
  bottom: 0;
  display: none;
  height: 100vh;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  width: 100vw;
  z-index: 999;
}

.js-site-search-modal--active {
  display: block;
}

.c-site-search-modal__inner {
  margin: 2em auto;
  max-width: var(--container-width);
  position: relative;
  width: 600px;
}

.c-site-search-modal__close {
  position: absolute;
  right: 0;
  top: 0;
}

.c-site-search-modal__search-form {
  padding-top: 1rem;
}

.c-site-search-modal__search-form .hs-search-field__input,
.c-site-search-modal__search-form .hs-search-field__button {
  padding: .5rem;
}

.c-site-search-modal__search-form .hs-search-field__bar button {
  font-size: 1rem;
  line-height: 1;
}

.c-site-search-modal__search-form .hs-search-field__bar button svg {
  fill: white;
  height: 1rem;
}

.c-site-search-modal__search-form .hs-search-field__suggestions .results-for,
.c-site-search-modal__search-form .hs-search-field__suggestions a {
  padding: .25rem .5rem
}

.c-site-search-modal__search-form .hs-search-field--open .hs-search-field__suggestions,
.c-site-search-modal__search-form .inpage-editor-active-field .hs-search-field__suggestions {
  border: none;
}

.c-site-search-modal__search-form .hs-search-field__suggestions a:focus,
.c-site-search-modal__search-form .hs-search-field__suggestions a:hover {
  background-color: var(--secondary-color);
  color: var(--white-color);
}

/* Navigation skipper */
.l-header__skip {
  height: 1px;
  left: -1000px;
  overflow: hidden;
  position: absolute;
  text-align: left;
  top: -1000px;
  width: 1px;
}

.l-header__skip:hover,
.l-header__skip:focus,
.l-header__skip:active {
  height: auto;
  left: 0.5rem;
  overflow: visible;
  padding: 0.25rem 0.5rem;
  top: 0.5rem;
  width: auto;
}

/* Scrolled header — compact padding after 150px scroll (see js/header-scroll.js) */
.l-header.l-header--scrolled {
  padding-top: var(--header-scrolled-padding-top);
}

.l-header.l-header--scrolled .l-header__inner {
  padding-top: var(--header-scrolled-inner-padding-y);
  padding-bottom: var(--header-scrolled-inner-padding-y);
}

.l-header.l-header--scrolled .c-header__mobile-menu {
  bottom: 0;
  top: calc(var(--header-height-mobile-scrolled) - 10px);
}

.l-header.l-header--scrolled .c-header__mobile-menu-inner {
  min-height: 100%;
}


/*********************
  RESPONSIVE STYLES
*********************/

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
  .l-header-style--fixed #l-main-content .dnd-section:first-of-type:not([class*="embed-"]) {
    padding-top: calc(var(--header-height-tablet) + var(--header-padding-top-tablet) + var(--hero-section-padding-top-tablet));
  }

  .l-header {
    height: var(--header-height-tablet);
    padding: var(--header-padding-top-tablet) 20px 0 20px;
  }

  .l-header__inner {
  }

  /* Ensure desktop menu is hidden on tablet */
  .c-header__menu {
    display: none;
  }

  .c-header__buttons {
    display: none;
  }

  .c-header__mobile-menu {
    bottom: 0;
    top: var(--header-height-tablet);
  }

  .c-header__mobile-menu-inner {
    min-height: 100%;
  }

  .l-header.l-header--scrolled .c-header__mobile-menu {
    bottom: 0;
    top: var(--header-height-tablet-scrolled);
  }

  .l-header.l-header--scrolled .c-header__mobile-menu-inner {
    min-height: 100%;
  }
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
  /* Ensure mobile menu styles still apply up to 1200px */
  .c-header__mobile-menu {
    bottom: 0;
    top: var(--header-height-tablet);
  }

  .c-header__mobile-menu-inner {
    min-height: 100%;
  }

  .l-header.l-header--scrolled .c-header__mobile-menu {
    bottom: 0;
    top: var(--header-height-tablet-scrolled);
  }

  .l-header.l-header--scrolled .c-header__mobile-menu-inner {
    min-height: 100%;
  }
}

/* X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
  .l-header-style--fixed #l-main-content .dnd-section:first-of-type:not([class*="embed-"]) {
    /*padding-top: calc(var(--header-height-desktop) + var(--header-padding-top-desktop) + var(--hero-section-padding-top-desktop));*/
    padding-top: 245px;
  }

  .l-header {
    height: var(--header-height-desktop);
    padding: var(--header-padding-top-desktop) 20px 0 20px;
  }

  .c-header__logo img {
    max-width: 150px;
  }

  .c-header__subtitle {
    font-size:10px;
    margin-bottom: 0;
  }

  .c-header__menu {
    display: flex;
  }

  .c-header__buttons {
    display: flex;
  }

  .c-header__menu ul[role="menu"] {
    gap: 5px;
  }

  /* Hide burger menu on desktop */
  .c-header__burger-menu {
    display: none !important;
  }

  /* Hide mobile menu on desktop */
  .c-header__mobile-menu {
    display: none !important;
  }

  /* Hide mobile menu buttons on desktop */
  .c-header__mobile-menu-buttons {
    display: none !important;
  }
}

/* XX-Large devices (larger desktops, 1400px and up)*/
@media (min-width: 1400px) {
  .l-header {
    height: var(--header-height-desktop);
    padding: var(--header-padding-top-desktop) 0 0 0;
  }
  .c-header__logo img {
    max-width: 200px;
  }
  .c-header__menu ul[role="menu"] {
    gap: 25px;
  }
}

/*  Elements
    Base HMTL elements are styled in this section (<body<, <h1>, <a>, <p>, <button> etc.)
*/
.c-accordion {}

.c-accordion__list {}

.c-accordion__item {
  border-bottom: 1px solid var(--dark-color);
}

.c-accordion__item:first-child {
  border-top: 1px solid var(--dark-color);
}

.c-accordion__details {}

.c-accordion__summary {
  cursor: pointer;
  gap: 20px;
	list-style: none;
  padding: 15px 0;
}

.c-accordion__summary::-webkit-details-marker {
	display: none;
}

.c-accordion__question-text {
  margin: 0;
}

/* Lets the question + optional subtitle share space with the chevron in the summary row. */
.c-accordion__question-block {
  min-width: 0;
}

.c-accordion__question-subtitle {
  margin: 0;
  margin-top: 8px;
  font-family: var(--font-family, "Manrope", sans-serif);
  font-size: calc(var(--paragraph-font-size) * .9);
  font-weight: var(--body-font-weight, 400);
  line-height: var(--body-font-line-height, 1.5);
  letter-spacing: var(--body-font-letter-spacing, 0.5px);
  color: var(--body-font-color, var(--primary-color, #1f1a49));
}

.c-accordion__panel {
  padding-right: 48px;
}

.c-accordion__answer {}

.c-accordion__icon {
	color: var(--primary-color);
	transition: transform 200ms ease;
}

.c-accordion__icon svg {
  width: 18px;
}

.c-accordion__details[open] .c-accordion__icon {
	transform: rotate(90deg);
	color: var(--secondary-color);
}

@media (min-width: 768px) {
  .c-accordion__question-subtitle {
    font-size: var(--paragraph-font-size);
  }
}
/**
 * Blog card teaser — shared by BlogCard React component and HubL (e.g. related posts callback).
 * Root stacking uses theme flex utilities (.l-flex / .l-flex--direction-column) in markup.
 */

.c-blog-card {
  position: relative;
  box-sizing: border-box;
  text-decoration: none;
  color: inherit;
  min-width: 0;
}

.c-blog-card:focus-visible {
  outline: 2px solid var(--blue-color, #19895b);
  outline-offset: 2px;
}

/* Image: no padding, top radii only; tags sit over this layer */
.c-blog-card__media {
  position: relative;
  overflow: hidden;
  background-color: var(--grey-color, #f4f3f1);
  border-radius: 10px 10px 0 0;
}

.c-blog-card__media--empty {
  min-height: 180px;
}

.c-blog-card__tags {
  position: absolute;
  top: 20px;
  right: 20px;
  left: 20px;
  pointer-events: none;
}

.c-blog-card__img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  min-height: 200px;
}

/* Content: bottom radii only; room for arrow handled via meta margin-bottom */
.c-blog-card__content {
  background-color: var(--grey-color, #f4f3f1);
  box-sizing: border-box;
  padding: 40px 30px 30px;
  min-width: 0;
  border-radius: 0 0 5px 5px;
  flex-grow: 1;
}

.c-blog-card__title {
  margin: 0 0 8px;
}

/* Space below excerpt so the corner arrow does not overlap text (35px icon + offset). */
.c-blog-card__meta,
.c-blog-card__meta--rich {
  margin: 0 0 45px;
  font-size: 1rem;
  color: var(--purple-color, #1e3a8a);
}

.c-blog-card__arrow {
  position: absolute;
  right: 30px;
  bottom: 30px;
  line-height: 0;
  pointer-events: none;
}
/**
 * Blog case study card — shared by BlogCaseStudyCard and HubL listing markup.
 * Layout uses theme flex utilities (.l-flex / .l-flex--direction-column) on the card link.
 */

.c-blog-case-study-card {
  position: relative;
  box-sizing: border-box;
  text-decoration: none;
  color: inherit;
  min-width: 0;
}

/* Image container: relative positioning for tag overlay */
.c-blog-case-study-card__media {
  position: relative;
  overflow: hidden;
  border-radius: 20px;
  width: 100%;
}

.c-blog-case-study-card__media--empty {
  min-height: 200px;
  background-color: var(--grey-color, #f4f3f1);
}

.c-blog-case-study-card__tags {
  position: absolute;
  top: 25px;
  left: 25px;
  right: 25px;
  height: auto;
  box-sizing: border-box;
  pointer-events: none;
  z-index: 1;
}

.c-blog-case-study-card__img {
  position: relative;
  display: block;
  width: 100%;
  height: 175px;
  max-height: 175px;
  object-fit: cover;
  object-position: center;
  border-radius: 20px;
}

.c-blog-case-study-card__title {
  line-height: 1.4;
  margin: 30px 0 0;
}

.c-blog-case-study-card__description {
  margin: 10px 0 0;
}

/* Featured variant (FeaturedCaseStudy module) */
.c-blog-case-study-card--featured .c-blog-case-study-card__media {
  border-radius: 20px 20px 0 0;
}

.c-blog-case-study-card--featured .c-blog-case-study-card__img {
  height: 175px;
  max-height: 175px;
  border-radius: 20px 20px 0 0;
  margin-bottom: -1px;
}

.c-blog-case-study-card--featured .c-blog-case-study-card__content {
  background-color: var(--purple-color, #1e3a8a);
  color: var(--white-color, #ffffff);
  padding: 40px 45px;
  border-radius: 0 0 20px 20px;
  box-sizing: border-box;
}

.c-blog-case-study-card--featured .c-blog-case-study-card__title {
  margin: 0;
  color: inherit;
}

.c-blog-case-study-card--featured .c-blog-case-study-card__description {
  margin: 20px 0 0;
  color: inherit;
}

@media (min-width: 992px) {
  .c-blog-case-study-card__img {
    height: 310px;
    max-height: 310px;
  }
  .c-blog-case-study-card--featured .c-blog-case-study-card__img {
    height: 365px;
    max-height: 365px;
  }
}
/**
 * Shared card shell styles (CareersCard and other modules).
 * Pair with theme flex utilities for layout.
 */

.c-card {
  border-radius: 20px;
  padding: 30px;
  background-color: var(--grey-color);
}
.l-button-group {
  gap: .5rem;
  padding-top: 1em;
  width: 100%;
}

.l-button-group.c-share-by-email {
    margin-top: 1em;
}

button:not(.c-case-studies__thumb):not(.c-header__burger-menu):not(.c-timeline-arrow):not(.c-header-search__icon):not(.c-site-search-modal__close):not(.c-header-mobile-menu__icon--open):not(.c-header-mobile-menu__icon--close):not(.uiButton):not(.c-dialog__close-icon):not(.splide__arrow):not(.hs-overlay__close--top):not(.splide__pagination__page):not(.c-hubspot-reviews__nav-button):not([class*="ToolbarIconButton"]):not([class*="PrivateButton"]):not(.c-tabbed-resources__tab):not(.c-tabbed-resources__search-button):not(.c-book-event__change-status-trigger):not(.c-content-feedback__thumb):not(.c-vertical-tabs__tab):not(.c-case-study-listing__clear):not(.c-data-connections__clear):not(.c-data-connections__filter-item):not(.c-tag):not(.hs-image__grid__list__item__button):not(.hs-image__grid__lightbox__button):not(.hs-image__grid__lightbox__button--close):not(.c-horizontal-tabs__tab):not(.osano-cm-button):not(.osano-cm-widget):not(.osano-cm-close):not(.hs-sprocket-button):not(.hs-tools-menu-item-button):not(.osano-cm-dialog__close),
.c-button,
.hsfc-Button {
  align-items: center;
  background-color: var(--button-background-color);
  border-radius: var(--button-border-radius);
  border: var(--button-border);
  color: var(--button-font-color);
  cursor: pointer;
  display: inline-flex;
  font-size: calc(var(--paragraph-font-size) * .9);
  font-weight: 600;
  max-width: var(--button-max-width);
  padding: 10px 25px;
  position: relative;
  text-align: center;
  text-decoration: none;
  transition: all 0.35s ease;
  white-space: normal;
  width: auto;
}

button:not(.c-case-studies__thumb):not(.c-header__burger-menu):not(.c-timeline-arrow):not(.c-header-search__icon):not(.c-site-search-modal__close):not(.c-header-mobile-menu__icon--open):not(.c-header-mobile-menu__icon--close):not(.uiButton):not(.c-dialog__close-icon):not(.splide__arrow):not(.hs-overlay__close--top):not(.splide__pagination__page):not(.c-hubspot-reviews__nav-button):not([class*="ToolbarIconButton"]):not([class*="PrivateButton"]):not(.c-tabbed-resources__tab):not(.c-tabbed-resources__search-button):not(.c-book-event__change-status-trigger):not(.c-content-feedback__thumb):not(.c-vertical-tabs__tab):not(.c-case-study-listing__clear):not(.c-data-connections__clear):not(.c-data-connections__filter-item):not(.c-tag):not(.hs-image__grid__list__item__button):not(.hs-image__grid__lightbox__button):not(.hs-image__grid__lightbox__button--close):not(.c-horizontal-tabs__tab):not(.osano-cm-button):not(.osano-cm-widget):not(.osano-cm-close):not(.hs-sprocket-button):not(.hs-tools-menu-item-button):not(.hsfc-Button):not(.osano-cm-dialog__close),
button:not(.c-case-studies__thumb):not(.c-header__burger-menu):not(.c-timeline-arrow):not(.c-header-search__icon):not(.c-site-search-modal__close):not(.c-header-mobile-menu__icon--open):not(.c-header-mobile-menu__icon--close):not(.uiButton):not(.c-dialog__close-icon):not(.splide__arrow):not(.hs-overlay__close--top):not(.splide__pagination__page):not(.c-hubspot-reviews__nav-button):not([class*="ToolbarIconButton"]):not([class*="PrivateButton"]):not(.c-tabbed-resources__tab):not(.c-tabbed-resources__search-button):not(.c-book-event__change-status-trigger):not(.c-content-feedback__thumb):not(.c-vertical-tabs__tab):not(.c-case-study-listing__clear):not(.c-data-connections__clear):not(.c-data-connections__filter-item):not(.c-tag):not(.hs-image__grid__list__item__button):not(.hs-image__grid__lightbox__button):not(.hs-image__grid__lightbox__button--close):not(.c-horizontal-tabs__tab):not(.osano-cm-button):not(.osano-cm-widget):not(.osano-cm-close):not(.hs-sprocket-button):not(.hs-tools-menu-item-button):not(.hsfc-Button):focus,
button:not(.c-case-studies__thumb):not(.c-header__burger-menu):not(.c-timeline-arrow):not(.c-header-search__icon):not(.c-site-search-modal__close):not(.c-header-mobile-menu__icon--open):not(.c-header-mobile-menu__icon--close):not(.uiButton):not(.c-dialog__close-icon):not(.splide__arrow):not(.hs-overlay__close--top):not(.splide__pagination__page):not(.c-hubspot-reviews__nav-button):not([class*="ToolbarIconButton"]):not([class*="PrivateButton"]):not(.c-tabbed-resources__tab):not(.c-tabbed-resources__search-button):not(.c-book-event__change-status-trigger):not(.c-content-feedback__thumb):not(.c-vertical-tabs__tab):not(.c-case-study-listing__clear):not(.c-data-connections__clear):not(.c-data-connections__filter-item):not(.c-tag):not(.hs-image__grid__list__item__button):not(.hs-image__grid__lightbox__button):not(.hs-image__grid__lightbox__button--close):not(.c-horizontal-tabs__tab):not(.osano-cm-button):not(.osano-cm-widget):not(.osano-cm-close):not(.hs-sprocket-button):not(.hs-tools-menu-item-button):not(.hsfc-Button):focus-within,
.c-button:hover,
.c-button:focus,
.c-button:focus-within {
  transform: scale(1.05);
}


button:disabled,
.c-button:disabled {
  background-color: #D0D0D0;
  border-color: #D0D0D0;
  color: #E6E6E6;
}

button.hs-overlay__close--top {
  cursor: pointer;
}

/*
  Solid Button Styles
*/
button.c-button__solid--purple,
button.c-button.c-button__solid--purple,
button:not(.c-header__burger-menu):not(.c-timeline-arrow):not(.c-header-search__icon):not(.c-site-search-modal__close):not(.c-header-mobile-menu__icon--open):not(.c-header-mobile-menu__icon--close):not(.uiButton):not(.c-dialog__close-icon):not(.splide__arrow):not(.hs-overlay__close--top):not(.splide__pagination__page):not(.c-hubspot-reviews__nav-button):not([class*="ToolbarIconButton"]):not([class*="PrivateButton"]):not(.c-tabbed-resources__tab):not(.c-tabbed-resources__search-button):not(.c-vertical-tabs__tab):not(.c-horizontal-tabs__tab):not(.c-data-connections__clear):not(.c-data-connections__filter-item):not(.c-button__solid--purple):not(.osano-cm-button):not(.osano-cm-widget):not(.osano-cm-close):not(.hs-sprocket-button):not(.hs-tools-menu-item-button):not(.hsfc-Button):not(.osano-cm-dialog__close),
.c-button__solid--purple {
  background-color: var(--purple-color) !important;
  border: 1px solid var(--purple-color) !important;
  color: var(--white-color) !important;
}

button.c-button__solid--purple:hover,
button.c-button__solid--purple:focus,
button.c-button__solid--purple:focus-within,
button.c-button.c-button__solid--purple:hover,
button.c-button.c-button__solid--purple:focus,
button.c-button.c-button__solid--purple:focus-within,
.c-button__solid--purple:hover,
.c-button__solid--purple:focus,
.c-button__solid--purple:focus-within {
  /* No hover/focus state changes needed for solid purple buttons */
}

button.c-button__solid--teal,
button.c-button.c-button__solid--teal,
button:not(.c-header__burger-menu):not(.c-timeline-arrow):not(.c-header-search__icon):not(.c-site-search-modal__close):not(.c-header-mobile-menu__icon--open):not(.c-header-mobile-menu__icon--close):not(.uiButton):not(.c-dialog__close-icon):not(.splide__arrow):not(.hs-overlay__close--top):not(.splide__pagination__page):not(.c-hubspot-reviews__nav-button):not([class*="ToolbarIconButton"]):not([class*="PrivateButton"]):not(.c-tabbed-resources__tab):not(.c-tabbed-resources__search-button):not(.c-vertical-tabs__tab):not(.c-horizontal-tabs__tab):not(.c-data-connections__clear):not(.c-data-connections__filter-item):not(.c-button__solid--teal):not(.osano-cm-button):not(.osano-cm-widget):not(.osano-cm-close):not(.hs-sprocket-button):not(.hs-tools-menu-item-button):not(.hsfc-Button):not(.osano-cm-dialog__close),
.c-button__solid--teal,
#l-main-content .c-blog-listing__actions button.c-button.c-button__solid--teal {
  background-color: var(--teal-color) !important;
  border: 1px solid var(--teal-color) !important;
  color: var(--purple-color) !important;
}

button.c-button__solid--teal:hover,
button.c-button__solid--teal:focus,
button.c-button__solid--teal:focus-within,
.c-button__solid--teal:hover,
.c-button__solid--teal:focus,
.c-button__solid--teal:focus-within {
  /* No hover/focus state changes needed for Solid Teal buttons */
}

button.c-button__solid--white,
.c-button__solid--white {
  background-color: var(--white-color) !important;
  border: 1px solid var(--white-color) !important;
  color: var(--blue-color) !important;
}

button.c-button__solid--white:hover,
button.c-button__solid--white:focus,
button.c-button__solid--white:focus-within,
.c-button__solid--white:hover,
.c-button__solid--white:focus,
.c-button__solid--white:focus-within {
  /* No hover/focus state changes needed for solid white buttons */
}

button.c-button__solid--blue,
button.c-button.c-button__solid--blue,
button:not(.c-header__burger-menu):not(.c-timeline-arrow):not(.c-header-search__icon):not(.c-site-search-modal__close):not(.c-header-mobile-menu__icon--open):not(.c-header-mobile-menu__icon--close):not(.uiButton):not(.c-dialog__close-icon):not(.splide__arrow):not(.hs-overlay__close--top):not(.splide__pagination__page):not(.c-hubspot-reviews__nav-button):not([class*="ToolbarIconButton"]):not([class*="PrivateButton"]):not(.c-tabbed-resources__tab):not(.c-tabbed-resources__search-button):not(.c-vertical-tabs__tab):not(.c-horizontal-tabs__tab):not(.c-data-connections__clear):not(.c-data-connections__filter-item):not(.c-button__solid--blue):not(.osano-cm-button):not(.osano-cm-widget):not(.osano-cm-close):not(.hs-sprocket-button):not(.hs-tools-menu-item-button):not(.hsfc-Button):not(.osano-cm-dialog__close),
.c-button__solid--blue {
  background-color: var(--blue-color) !important;
  border: 1px solid var(--blue-color) !important;
  color: var(--white-color) !important;
}

button.c-button__solid--blue:hover,
button.c-button__solid--blue:focus,
button.c-button__solid--blue:focus-within,
.c-button__solid--blue:hover,
.c-button__solid--blue:focus,
.c-button__solid--blue:focus-within {
  /* No hover/focus state changes needed for solid blue buttons */
}

button.c-button__solid--dark-grey,
button.c-button.c-button__solid--dark-grey,
button:not(.c-header__burger-menu):not(.c-timeline-arrow):not(.c-header-search__icon):not(.c-site-search-modal__close):not(.c-header-mobile-menu__icon--open):not(.c-header-mobile-menu__icon--close):not(.uiButton):not(.c-dialog__close-icon):not(.splide__arrow):not(.hs-overlay__close--top):not(.splide__pagination__page):not(.c-hubspot-reviews__nav-button):not([class*="ToolbarIconButton"]):not([class*="PrivateButton"]):not(.c-tabbed-resources__tab):not(.c-tabbed-resources__search-button):not(.c-vertical-tabs__tab):not(.c-horizontal-tabs__tab):not(.c-data-connections__clear):not(.c-data-connections__filter-item):not(.c-button__solid--dark-grey):not(.osano-cm-button):not(.osano-cm-widget):not(.osano-cm-close):not(.hs-sprocket-button):not(.hs-tools-menu-item-button):not(.hsfc-Button):not(.osano-cm-dialog__close),
.c-button__solid--dark-grey {
  background-color: var(--dark-grey-color) !important;
  border: 1px solid var(--dark-grey-color) !important;
  color: var(--purple-color) !important;
}

button.c-button__solid--dark-grey:hover,
button.c-button__solid--dark-grey:focus,
button.c-button__solid--dark-grey:focus-within,
.c-button__solid--dark-grey:hover,
.c-button__solid--dark-grey:focus,
.c-button__solid--dark-grey:focus-within {
  /* No hover/focus state changes needed for solid dark grey buttons */
}


/*
  Outline Button Styles
*/
button.c-button__outline--purple,
button.c-button.c-button__outline--purple,
button:not(.c-header__burger-menu):not(.c-timeline-arrow):not(.c-header-search__icon):not(.c-site-search-modal__close):not(.c-header-mobile-menu__icon--open):not(.c-header-mobile-menu__icon--close):not(.uiButton):not(.c-dialog__close-icon):not(.splide__arrow):not(.hs-overlay__close--top):not(.splide__pagination__page):not(.c-hubspot-reviews__nav-button):not([class*="ToolbarIconButton"]):not([class*="PrivateButton"]):not(.c-tabbed-resources__tab):not(.c-tabbed-resources__search-button):not(.c-vertical-tabs__tab):not(.c-horizontal-tabs__tab):not(.c-data-connections__clear):not(.c-data-connections__filter-item):not(.c-button__outline--purple):not(.osano-cm-button):not(.osano-cm-widget):not(.osano-cm-close):not(.hs-sprocket-button):not(.hs-tools-menu-item-button):not(.hsfc-Button):not(.osano-cm-dialog__close),
.c-button__outline--purple {
  background-color: transparent !important;
  border: 1px solid var(--purple-color) !important;
  color: var(--purple-color) !important;
}

button.c-button__outline--purple:hover,
button.c-button__outline--purple:focus,
button.c-button__outline--purple:focus-within,
.c-button__outline--purple:hover,
.c-button__outline--purple:focus,
.c-button__outline--purple:focus-within {
  /* No hover/focus state changes needed for outline purple buttons */
}


button.c-button__outline--teal,
button.c-button.c-button__outline--teal,
button:not(.c-header__burger-menu):not(.c-timeline-arrow):not(.c-header-search__icon):not(.c-site-search-modal__close):not(.c-header-mobile-menu__icon--open):not(.c-header-mobile-menu__icon--close):not(.uiButton):not(.c-dialog__close-icon):not(.splide__arrow):not(.hs-overlay__close--top):not(.splide__pagination__page):not(.c-hubspot-reviews__nav-button):not([class*="ToolbarIconButton"]):not([class*="PrivateButton"]):not(.c-tabbed-resources__tab):not(.c-tabbed-resources__search-button):not(.c-vertical-tabs__tab):not(.c-horizontal-tabs__tab):not(.c-data-connections__clear):not(.c-data-connections__filter-item):not(.c-button__outline--teal):not(.osano-cm-button):not(.osano-cm-widget):not(.osano-cm-close):not(.hs-sprocket-button):not(.hs-tools-menu-item-button):not(.hsfc-Button):not(.osano-cm-dialog__close),
.c-button__outline--teal {
  background-color: transparent !important;
  border: 1px solid var(--teal-color) !important;
  color: var(--purple-color) !important;
}

button.c-button__outline--teal:hover,
button.c-button__outline--teal:focus,
button.c-button__outline--teal:focus-within,
.c-button__outline--teal:hover,
.c-button__outline--teal:focus,
.c-button__outline--teal:focus-within {
  /* No hover/focus state changes needed for outline teal buttons */
}

button.c-button__outline--blue,
button.c-button.c-button__outline--blue,
button:not(.c-header__burger-menu):not(.c-timeline-arrow):not(.c-header-search__icon):not(.c-site-search-modal__close):not(.c-header-mobile-menu__icon--open):not(.c-header-mobile-menu__icon--close):not(.uiButton):not(.c-dialog__close-icon):not(.splide__arrow):not(.hs-overlay__close--top):not(.splide__pagination__page):not(.c-hubspot-reviews__nav-button):not([class*="ToolbarIconButton"]):not([class*="PrivateButton"]):not(.c-tabbed-resources__tab):not(.c-tabbed-resources__search-button):not(.c-vertical-tabs__tab):not(.c-horizontal-tabs__tab):not(.c-data-connections__clear):not(.c-data-connections__filter-item):not(.c-button__outline--blue):not(.osano-cm-button):not(.osano-cm-widget):not(.osano-cm-close):not(.hs-sprocket-button):not(.hs-tools-menu-item-button):not(.hsfc-Button):not(.osano-cm-dialog__close),
.c-button__outline--blue {
  background-color: transparent !important;
  border: 1px solid var(--blue-color) !important;
  color: var(--purple-color) !important;
}

button.c-button__outline--blue:hover,
button.c-button__outline--blue:focus,
button.c-button__outline--blue:focus-within,
.c-button__outline--blue:hover,
.c-button__outline--blue:focus,
.c-button__outline--blue:focus-within {
  /* No hover/focus state changes needed for outline blue buttons */
}

button.c-button__outline--dark-grey,
button.c-button.c-button__outline--dark-grey,
button:not(.c-header__burger-menu):not(.c-timeline-arrow):not(.c-header-search__icon):not(.c-site-search-modal__close):not(.c-header-mobile-menu__icon--open):not(.c-header-mobile-menu__icon--close):not(.uiButton):not(.c-dialog__close-icon):not(.splide__arrow):not(.hs-overlay__close--top):not(.splide__pagination__page):not(.c-hubspot-reviews__nav-button):not([class*="ToolbarIconButton"]):not([class*="PrivateButton"]):not(.c-tabbed-resources__tab):not(.c-tabbed-resources__search-button):not(.c-vertical-tabs__tab):not(.c-horizontal-tabs__tab):not(.c-data-connections__clear):not(.c-data-connections__filter-item):not(.c-button__outline--dark-grey):not(.osano-cm-button):not(.osano-cm-widget):not(.osano-cm-close):not(.hs-sprocket-button):not(.hs-tools-menu-item-button):not(.hsfc-Button):not(.osano-cm-dialog__close),
.c-button__outline--dark-grey {
  background-color: transparent !important;
  border: 1px solid var(--dark-grey-color) !important;
  color: var(--purple-color) !important;
}

button.c-button__outline--dark-grey:hover,
button.c-button__outline--dark-grey:focus,
button.c-button__outline--dark-grey:focus-within,
.c-button__outline--dark-grey:hover,
.c-button__outline--dark-grey:focus,
.c-button__outline--dark-grey:focus-within {
  /* No hover/focus state changes needed for outline dark grey buttons */
}

button.c-button__outline--white,
button.c-button.c-button__outline--white,
button:not(.c-header__burger-menu):not(.c-timeline-arrow):not(.c-header-search__icon):not(.c-site-search-modal__close):not(.c-header-mobile-menu__icon--open):not(.c-header-mobile-menu__icon--close):not(.uiButton):not(.c-dialog__close-icon):not(.splide__arrow):not(.hs-overlay__close--top):not(.splide__pagination__page):not(.c-hubspot-reviews__nav-button):not([class*="ToolbarIconButton"]):not([class*="PrivateButton"]):not(.c-tabbed-resources__tab):not(.c-tabbed-resources__search-button):not(.c-vertical-tabs__tab):not(.c-horizontal-tabs__tab):not(.c-data-connections__clear):not(.c-data-connections__filter-item):not(.c-button__outline--white):not(.osano-cm-button):not(.osano-cm-widget):not(.osano-cm-close):not(.hs-sprocket-button):not(.hs-tools-menu-item-button):not(.hsfc-Button):not(.osano-cm-dialog__close),
.c-button__outline--white {
  background-color: transparent !important;
  border: 1px solid var(--white-color) !important;
  color: var(--white-color) !important;
}

button.c-button__outline--white:hover,
button.c-button__outline--white:focus,
button.c-button__outline--white:focus-within,
.c-button__outline--white:hover,
.c-button__outline--white:focus,
.c-button__outline--white:focus-within {
  /* No hover/focus state changes needed for outline white buttons */
}

/*
  Link Button Styles
*/
.c-button__link,
.c-button__link--white {
  background-color: transparent !important;
  border: none;
  cursor: pointer;
  font-weight: 600;
  padding-left: 0 !important;
  padding-right: 0 !important;
  text-align: left !important;
  text-decoration: underline;
}

.c-button__link {
  color: var(--blue-color);
}

.c-button__link--white {
  color: var(--white-color);
}

.c-button__link:hover,
.c-button__link:focus,
.c-button__link:focus-within,
.c-button__link--white:hover,
.c-button__link--white:focus,
.c-button__link--white:focus-within {
  background-color: transparent;
  border: none;
  transform: none !important;
}

.c-button__link:hover,
.c-button__link:focus,
.c-button__link:focus-within {
  color: var(--blue-color);
}

.c-button__link.c-button__link--white:hover,
.c-button__link.c-button__link--white:focus,
.c-button__link.c-button__link--white:focus-within {
  color: var(--white-color);
}

/*
  Link button icon

  Important: We use an SVG mask (not background-image) so the icon always
  inherits `currentColor` via `background-color: currentColor;`.
*/
.c-button__link::after,
.c-button__link--white::after {
  content: '';
  display: inline-block;
  width: 16px;
  height: 16px;
  margin-left: 8px;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2716%27%20height%3D%2716%27%20viewBox%3D%270%200%2016%2016%27%20fill%3D%27none%27%3E%3Cpath%20d%3D%27M13.0386%207.53751C12.6351%207.53751%2012.2986%207.874%2012.2986%208.27751V14.5196H1.46344V3.68449H7.70557C8.10908%203.68449%208.44557%203.34801%208.44557%202.9445C8.44557%202.54098%208.10908%202.2045%207.70557%202.2045H0.739998C0.336485%202.2045%200%202.54098%200%202.9445V15.2434C0%2015.6469%200.336485%2015.9834%200.739998%2015.9834H13.0389C13.4424%2015.9834%2013.7789%2015.6469%2013.7789%2015.2434V8.26129C13.7789%207.85712%2013.4424%207.53772%2013.0389%207.53772L13.0386%207.53751Z%27%20fill%3D%27black%27%2F%3E%3Cpath%20d%3D%27M15.2433%200H10.8183C10.4148%200%2010.0783%200.336485%2010.0783%200.739997C10.0783%201.14351%2010.4148%201.47999%2010.8183%201.47999H13.4767L5.90581%209.0509C5.61994%209.33678%205.61994%209.80799%205.90581%2010.0939C6.05697%2010.245%206.2423%2010.3127%206.42764%2010.3127C6.61297%2010.3127%206.79763%2010.2457%206.94946%2010.0939L14.5204%202.52296V5.18136C14.5204%205.58487%2014.8568%205.92136%2015.2604%205.92136C15.6639%205.92136%2016.0004%205.58487%2016.0004%205.18136V0.740098C15.9833%200.336586%2015.6468%200%2015.2433%200Z%27%20fill%3D%27black%27%2F%3E%3C%2Fsvg%3E") no-repeat center;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2716%27%20height%3D%2716%27%20viewBox%3D%270%200%2016%2016%27%20fill%3D%27none%27%3E%3Cpath%20d%3D%27M13.0386%207.53751C12.6351%207.53751%2012.2986%207.874%2012.2986%208.27751V14.5196H1.46344V3.68449H7.70557C8.10908%203.68449%208.44557%203.34801%208.44557%202.9445C8.44557%202.54098%208.10908%202.2045%207.70557%202.2045H0.739998C0.336485%202.2045%200%202.54098%200%202.9445V15.2434C0%2015.6469%200.336485%2015.9834%200.739998%2015.9834H13.0389C13.4424%2015.9834%2013.7789%2015.6469%2013.7789%2015.2434V8.26129C13.7789%207.85712%2013.4424%207.53772%2013.0389%207.53772L13.0386%207.53751Z%27%20fill%3D%27black%27%2F%3E%3Cpath%20d%3D%27M15.2433%200H10.8183C10.4148%200%2010.0783%200.336485%2010.0783%200.739997C10.0783%201.14351%2010.4148%201.47999%2010.8183%201.47999H13.4767L5.90581%209.0509C5.61994%209.33678%205.61994%209.80799%205.90581%2010.0939C6.05697%2010.245%206.2423%2010.3127%206.42764%2010.3127C6.61297%2010.3127%206.79763%2010.2457%206.94946%2010.0939L14.5204%202.52296V5.18136C14.5204%205.58487%2014.8568%205.92136%2015.2604%205.92136C15.6639%205.92136%2016.0004%205.58487%2016.0004%205.18136V0.740098C15.9833%200.336586%2015.6468%200%2015.2433%200Z%27%20fill%3D%27black%27%2F%3E%3C%2Fsvg%3E") no-repeat center;
  -webkit-mask-size: contain;
  mask-size: contain;
}

/* 
  Button icons
*/
.c-button::before,
.c-button::after {
  position: relative;
}
.c-button::after {
  margin-left: 10px;
  right: 0;
  transition: all 0.35s ease;
}

.c-button:hover::after,
.c-button:focus::after,
.c-button:focus-within::after,
.c-content-card__link--full:hover .c-button::after,
.c-content-card__link--full:focus .c-button::after,
.c-content-card__link--full:focus-within .c-button::after {
  right: -5px;
}

.c-button__icon--none::after {
  display: none;
}

.c-button__icon--arrow::after {
  content: '';
  background-color: currentColor;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cmask id='mask0_269_876' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='24' height='24'%3E%3Crect width='24' height='24' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_269_876)'%3E%3Cpath d='M14 18L12.6 16.55L16.15 13H4V11H16.15L12.6 7.45L14 6L20 12L14 18Z' fill='black'/%3E%3C/g%3E%3C/svg%3E") no-repeat center;
  mask-size: contain;
  width: 24px;
  height: 24px;
  display: inline-block;
}

.c-button__icon--login::after {
  content: '';
  background-color: currentColor;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cmask id='mask0_1176_8861' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='24' height='24'%3E%3Crect width='24' height='24' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_1176_8861)'%3E%3Cpath d='M11.9905 20.5V19H18.6923C18.7692 19 18.8398 18.9679 18.9038 18.9038C18.9679 18.8398 19 18.7692 19 18.6923V5.30775C19 5.23075 18.9679 5.16025 18.9038 5.09625C18.8398 5.03208 18.7692 5 18.6923 5H11.9905V3.5H18.6923C19.1974 3.5 19.625 3.675 19.975 4.025C20.325 4.375 20.5 4.80258 20.5 5.30775V18.6923C20.5 19.1974 20.325 19.625 19.975 19.975C19.625 20.325 19.1974 20.5 18.6923 20.5H11.9905ZM10.6348 16.2692L9.59625 15.1845L12.0308 12.75H3.5V11.25H12.0308L9.59625 8.8155L10.6348 7.73075L14.9038 12L10.6348 16.2692Z' fill='%231C215A'/%3E%3C/g%3E%3C/svg%3E") no-repeat center;
  mask-size: contain;
  width: 24px;
  height: 24px;
  display: inline-block;
}

.c-button__icon--support::before {
  content: '';
  background-color: currentColor;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cmask id='mask0_1347_2705' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='24' height='24'%3E%3Crect width='24' height='24' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_1347_2705)'%3E%3Cpath d='M11.989 17.6152C12.2745 17.6152 12.5157 17.5168 12.7125 17.3198C12.9093 17.1226 13.0078 16.8812 13.0078 16.5955C13.0078 16.31 12.9092 16.0688 12.712 15.872C12.5148 15.6753 12.2735 15.577 11.988 15.577C11.7025 15.577 11.4613 15.6756 11.2645 15.8728C11.0677 16.0699 10.9692 16.3113 10.9692 16.5968C10.9692 16.8822 11.0678 17.1234 11.265 17.3203C11.4622 17.5169 11.7035 17.6152 11.989 17.6152ZM11.2808 14.0345H12.6885C12.7013 13.5423 12.7734 13.1491 12.9047 12.8548C13.0363 12.5606 13.3552 12.1706 13.8615 11.6848C14.3013 11.2449 14.6382 10.8388 14.872 10.4663C15.106 10.0939 15.223 9.65417 15.223 9.147C15.223 8.28617 14.9137 7.61375 14.2952 7.12975C13.6766 6.64592 12.9448 6.404 12.1 6.404C11.2653 6.404 10.5747 6.62675 10.028 7.07225C9.48117 7.51775 9.09108 8.04242 8.85775 8.64625L10.1423 9.1615C10.2641 8.8295 10.4724 8.50608 10.7673 8.19125C11.0621 7.87658 11.4999 7.71925 12.0808 7.71925C12.6718 7.71925 13.1086 7.88108 13.3913 8.20475C13.6741 8.52858 13.8155 8.88467 13.8155 9.273C13.8155 9.61283 13.7187 9.92375 13.525 10.2057C13.3315 10.4877 13.0848 10.7602 12.7848 11.023C12.1283 11.6153 11.7135 12.0878 11.5405 12.4405C11.3673 12.793 11.2808 13.3243 11.2808 14.0345ZM12.0017 21.5C10.6877 21.5 9.45267 21.2507 8.2965 20.752C7.14033 20.2533 6.13467 19.5766 5.2795 18.7218C4.42433 17.8669 3.74725 16.8617 3.24825 15.706C2.74942 14.5503 2.5 13.3156 2.5 12.0017C2.5 10.6877 2.74933 9.45267 3.248 8.2965C3.74667 7.14033 4.42342 6.13467 5.27825 5.2795C6.13308 4.42433 7.13833 3.74725 8.294 3.24825C9.44967 2.74942 10.6844 2.5 11.9983 2.5C13.3123 2.5 14.5473 2.74933 15.7035 3.248C16.8597 3.74667 17.8653 4.42342 18.7205 5.27825C19.5757 6.13308 20.2528 7.13833 20.7518 8.294C21.2506 9.44967 21.5 10.6844 21.5 11.9983C21.5 13.3123 21.2507 14.5473 20.752 15.7035C20.2533 16.8597 19.5766 17.8653 18.7218 18.7205C17.8669 19.5757 16.8617 20.2528 15.706 20.7518C14.5503 21.2506 13.3156 21.5 12.0017 21.5ZM12 20C14.2333 20 16.125 19.225 17.675 17.675C19.225 16.125 20 14.2333 20 12C20 9.76667 19.225 7.875 17.675 6.325C16.125 4.775 14.2333 4 12 4C9.76667 4 7.875 4.775 6.325 6.325C4.775 7.875 4 9.76667 4 12C4 14.2333 4.775 16.125 6.325 17.675C7.875 19.225 9.76667 20 12 20Z' fill='black'/%3E%3C/g%3E%3C/svg%3E") no-repeat center;
  mask-size: contain;
  width: 24px;
  height: 24px;
  display: inline-block;
  margin-right: 8px;
}

.c-button__icon--support.c-button__link {
  padding-left: 0 !important;
}

.c-button__icon--plus::after {
  content: '';
  background-color: currentColor;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 13 13' fill='none'%3E%3Cpath d='M5.75 7.25H0V5.75H5.75V0H7.25V5.75H13V7.25H7.25V13H5.75V7.25Z' fill='black'/%3E%3C/svg%3E") no-repeat center;
  mask-size: contain;
  width: 13px;
  height: 13px;
  display: inline-block;
}


/* 
  Button burger 
*/
.c-button-burger {
  display: block;
  width: 40px;
  height: 36px;
  position: relative;
  cursor: pointer;
  margin-bottom: 10px;
  margin-top: 10px;
}
.c-button-burger .line {
  fill: none;
  stroke: var(--dark-color);
  stroke-width: 4;
  transition: stroke-dasharray .6s cubic-bezier(.4,0,.2,1),stroke-dashoffset .6s cubic-bezier(.4,0,.2,1)
}

.c-button-burger .line1 {
  stroke-dasharray: 60 207;
  stroke-width: 4
}

.c-button-burger .line2 {
  stroke-dasharray: 60 60;
  stroke-width: 4
}

.c-button-burger .line3 {
  stroke-dasharray: 60 207;
  stroke-width: 4
}

.c-button-burger.open .line1 {
  stroke-dasharray: 90 207;
  stroke-dashoffset: -134;
  stroke-width: 4
}

.c-button-burger.open .line2 {
  stroke-dasharray: 1 60;
  stroke-dashoffset: -40;
  stroke-width: 4
}

.c-button-burger.open .line3 {
  stroke-dasharray: 90 207;
  stroke-dashoffset: -134;
  stroke-width: 4
}

@media screen and (max-width: 767px) {
	.l-button-group.l-flex--justify-content-flex-end {
		justify-content: flex-start;
    margin-top:1em;
	}
}

/* Smaller button */
.c-button--small {
  font-size: .8rem;
  padding: 10px 30px;
}

/* Link styles */
.c-back-link {
  align-items: center;
  display: flex;
  font-size: .8rem;
  gap: 8px;
  line-height: 1;
}

.c-back-link svg {
  width: .8rem;
}

.c-back-link--white {
  color: #fff;
}

@media (min-width: 768px) {
  button:not(.c-case-studies__thumb):not(.c-header__burger-menu):not(.c-timeline-arrow):not(.c-header-search__icon):not(.c-site-search-modal__close):not(.c-header-mobile-menu__icon--open):not(.c-header-mobile-menu__icon--close):not(.uiButton):not(.c-dialog__close-icon):not(.splide__arrow):not(.hs-overlay__close--top):not(.splide__pagination__page):not(.c-hubspot-reviews__nav-button):not([class*="ToolbarIconButton"]):not([class*="PrivateButton"]):not(.c-tabbed-resources__tab):not(.c-tabbed-resources__search-button):not(.c-book-event__change-status-trigger):not(.c-content-feedback__thumb):not(.c-vertical-tabs__tab):not(.c-case-study-listing__clear):not(.c-data-connections__clear):not(.c-data-connections__filter-item):not(.c-tag):not(.hs-image__grid__list__item__button):not(.hs-image__grid__lightbox__button):not(.hs-image__grid__lightbox__button--close):not(.c-horizontal-tabs__tab):not(.osano-cm-button):not(.osano-cm-widget):not(.osano-cm-close):not(.hs-sprocket-button):not(.hs-tools-menu-item-button):not(.hsfc-Button),
  .c-button {
    font-size: var(--paragraph-font-size);
    padding: var(--button-padding);
  }
}
/**
 * ContentCards shared styles
 *
 * This file is intentionally shared across modules that use the
 * `.c-content-cards` classname family.
 */

.c-content-cards {
  margin-top: 25px;
}

.c-content-cards__list {
  --content-cards-gap: 30px;
  gap: var(--content-cards-gap);
  margin: 0;
  padding: 0;
}

.c-content-cards__item {
  /* Flex-wrap + gap: subtract total gap space from 100% before dividing. */
  width: calc(
    (100% - (var(--content-cards-gap) * (var(--content-cards-per-row-mobile, 1) - 1))) /
      var(--content-cards-per-row-mobile, 1)
  );
}

.c-content-cards__item:focus-visible {
  outline: 2px solid var(--blue-color, #2F6BF0);
  outline-offset: 4px;
}

@media (min-width: 768px) {
  .c-content-cards__item {
    width: calc(
      (100% - (var(--content-cards-gap) * (var(--content-cards-per-row-tablet, 1) - 1))) /
        var(--content-cards-per-row-tablet, 1)
    );
  }
}

@media (min-width: 992px) {
  .c-content-cards__item {
    width: calc(
      (100% - (var(--content-cards-gap) * (var(--content-cards-per-row-desktop, 1) - 1))) /
        var(--content-cards-per-row-desktop, 1)
    );
  }
}

.c-content-cards__card {
  position: relative;
  width: 100%;
  height: 100%;
}

/*
  Top-right corner accent on the card (overlays the image corner).
  Quarter-circle: square with only the inner corner rounded.
  --content-cards-corner-color is reserved for a future per-card colour field.
*/
.c-content-cards__card::before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1;
  width: 72px;
  height: 72px;
  background-color: var(--content-cards-corner-color, var(--teal-color, #32EAC6));
  border-top-right-radius: 20px;
  border-bottom-left-radius: 100%;
  pointer-events: none;
}

.c-content-cards__image {
  display: block;
  width: 100%;
  height: 250px;
  margin-bottom: 30px;
  border-radius: 20px;
  object-fit: cover;
  object-position: center;
  transition: height 200ms ease;
  /* Prevent the image shrinking when text takes more space. */
  flex-shrink: 0;
}

@media (min-width: 992px) {
  .c-content-cards__image {
    height: 300px;
  }
}

.c-content-cards__description {
  display: block;
}

.c-content-cards .c-button.c-button__link,
.c-content-cards .c-button.c-button__link--white {
  display: inline-flex;
}

.c-content-cards__divider {
  display: none;
  height: 1px;
  width: 100%;
  margin: 15px 0;
  opacity: 0.15;
  background: var(--primary-color, #1F1A49);
}

.c-content-cards__divider.c-content-cards__divider--mobile {
  display: block;
}

@media (min-width: 992px) {
  .c-content-cards__divider {
    display: block;
    margin: 25px 0;
  }
  .c-content-cards__divider.c-content-cards__divider--mobile {
    display: none !important;
  }
}

.c-content-cards.s-text-color--white .c-content-cards__divider {
  background: var(--white-color, #ffffff);
}


/*
  Touch-first behavior:
  - Below 1200px, show all content (no hover-reveal).
  - At 1200px and up, hide description + link until hover/focus-within.
*/
@media (min-width: 1200px) {
  .c-content-cards {
    margin-top: 40px;
    --content-cards-divider-color: var(--primary-color, #1F1A49);
  }

  .c-content-cards.s-text-color--white {
    --content-cards-divider-color: var(--white-color, #ffffff);
  }

  .c-content-cards__description {
    display: none;
  }

  .c-content-cards .c-button.c-button__link,
  .c-content-cards .c-button.c-button__link--white {
    display: none;
  }

  /*
    Hover-reveal desktop layout:
    - Row height comes from the tallest card (align-items: stretch on the list).
    - min-height reserves space so hover only reallocates space inside the card.
    - The image flexes/shrinks; text, divider, and link never clamp or ellipsize.
  */
  .c-content-cards__item {
    align-self: stretch;
    min-height: 500px;
  }

  .c-content-cards__card {
    height: 100%;
    min-height: 500px;
    overflow: hidden;
    box-sizing: border-box;
    padding-bottom: 25px;
    border-bottom: 1px solid transparent;
    border-bottom-color: color-mix(
      in srgb,
      var(--content-cards-divider-color, var(--primary-color, #1F1A49)) 15%,
      transparent
    );
  }

  /*
    Image fills remaining card space and shrinks on hover when description/link appear.
    flex-shrink is allowed here (overrides the global flex-shrink: 0 on the image).
  */
  .c-content-cards__image {
    /*
      height: 0 lets flex-grow allocate vertical space for object-fit: cover.
      min-height: 1px allows the image to shrink down on hover when text appears.
    */
    height: 0;
    flex: 1 1 0;
    min-height: 1px;
    flex-shrink: 1;
  }

  .c-content-cards__title,
  .c-content-cards__description,
  .c-content-cards__divider,
  .c-content-cards .c-button.c-button__link,
  .c-content-cards .c-button.c-button__link--white {
    flex-shrink: 0;
  }

  .c-content-cards__divider {
    display: none;
  }

  .c-content-cards__item:hover .c-content-cards__description,
  .c-content-cards__item:focus-within .c-content-cards__description {
    display: block;
    overflow: visible;
  }

  .c-content-cards__item:hover .c-content-cards__divider,
  .c-content-cards__item:focus-within .c-content-cards__divider {
    display: block;
  }

  .c-content-cards__item:hover .c-content-cards__card,
  .c-content-cards__item:focus-within .c-content-cards__card {
    border-bottom-color: transparent;
    /*
      Extreme copy lengths: keep the card footprint fixed but allow in-card scroll
      after the image has shrunk to its minimum.
    */
    overflow-y: auto;
  }

  .c-content-cards__item:hover .c-button.c-button__link,
  .c-content-cards__item:focus-within .c-button.c-button__link,
  .c-content-cards__item:hover .c-button.c-button__link--white,
  .c-content-cards__item:focus-within .c-button.c-button__link--white {
    display: inline-flex;
  }

  .c-content-cards__divider--mobile {
    display: none !important;
  }
}
/**
 * IconCards shared styles
 *
 * This file defines layout + spacing for the `.c-icon-cards` classname family.
 * Flex behavior (display, direction, wrap, alignment) must come from theme flex utilities.
 */

.c-icon-cards {
  margin-top: 20px;
}

.c-icon-cards__list {
  --icon-cards-gap: 30px;
  gap: var(--icon-cards-gap);
}

.c-icon-cards__item {
  /* Flex-wrap + gap: subtract total gap space from 100% before dividing. */
  width: calc(
    (100% - (var(--icon-cards-gap) * (var(--icon-cards-per-row-mobile, 1) - 1))) /
      var(--icon-cards-per-row-mobile, 1)
  );
}

.c-icon-cards__item:focus-visible {
  outline: 2px solid var(--blue-color, #2F6BF0);
  outline-offset: 4px;
}

@media (min-width: 768px) {
  .c-icon-cards {
    margin-top: 40px;
  }
  .c-icon-cards__item {
    width: calc(
      (100% - (var(--icon-cards-gap) * (var(--icon-cards-per-row-tablet, 1) - 1))) /
        var(--icon-cards-per-row-tablet, 1)
    );
  }
}

.c-icon-cards__card {
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  border-radius: 20px;
}

.c-icon-cards__content {
  flex-grow: 1;
}

.c-icon-cards__title {
  line-height: 1.2;
  margin: 0 0 10px 0;
}

.c-icon-cards__sub-title {
  font-size: 16px;
  font-weight: 700;
  color: var(--blue-color);
  margin: 0 0 10px 0;
}

/*
  Style 1 & 4
  Icon, title, description stacked and center aligned.
*/
.c-icon-cards--style_1 .c-icon-cards__card,
.c-icon-cards--style_4 .c-icon-cards__card {
  padding: 30px;
  text-align: center;
}

.c-icon-cards--style_1 .c-icon-cards__icon {
  width: 50px;
  height: 50px;
  margin-bottom: 20px;
}

/*
  Style 2
  - Mobile-first: icon above content (column)
  - >= 768px: 2 column layout (handled by flex utilities in markup)
*/
.c-icon-cards--style_2 .c-icon-cards__card {
  padding: 30px;
  text-align: left;
}

.c-icon-cards--style_2 .c-icon-cards__style-2 {
  gap: 20px;
}

.c-icon-cards--style_2 .c-icon-cards__icon {
  width: 40px;
  height: 40px;
  margin-top: 5px;
}

/*
  Style 5
  - Same layout as Style 2 (icon left, content right from md)
  - Tag uses shared `.c-tag.c-tag--cerise` above the title in the content column
*/
.c-icon-cards--style_5 .c-icon-cards__card {
  padding: 30px;
  text-align: left;
}

.c-icon-cards--style_5 .c-icon-cards__style-5 {
  gap: 20px;
}

.c-icon-cards--style_5 .c-icon-cards__icon {
  width: 40px;
  height: 40px;
}

.c-icon-cards--style_5 .c-icon-cards__content .c-tag {
  align-self: flex-start;
  margin-bottom: 15px;
}

.c-icon-cards--style_5 .c-icon-cards__title {
  margin-bottom: 10px;
}

/*
  Style 6
  - Same layout as Style 2 (icon left, content right from md)
  - Tag or link shares a row with the title (space-between, flex-start)
*/
.c-icon-cards--style_6 .c-icon-cards__card {
  padding: 30px;
  text-align: left;
}

.c-icon-cards--style_6 .c-icon-cards__style-6 {
  gap: 20px;
}

.c-icon-cards--style_6 .c-icon-cards__icon {
  width: 40px;
  height: 40px;
}

.c-icon-cards--style_6 .c-icon-cards__title-row {
  flex-direction: column;
  gap: 16px;
  width: 100%;
}

.c-icon-cards--style_6 .c-icon-cards__title-row .c-icon-cards__title {
  flex: 1 1 auto;
  min-width: 0;
  margin-bottom: 0;
}

.c-icon-cards--style_6 .c-icon-cards__title-row .c-tag,
.c-icon-cards--style_6 .c-icon-cards__title-row .c-button {
  flex-shrink: 0;
}

/* Style 6 link only — do not change global `.c-button__link` padding */
.c-icon-cards--style_6 .c-icon-cards__title-row .c-button.c-button__link {
  padding: 0;
}

.c-icon-cards--style_6 .c-icon-cards__description {
  padding-top: 30px;
}

/*
  Style 3
  - Header row: icon + title aligned center with 20px gap
  - Icon list: rows with 15px gap between icon and text
*/
.c-icon-cards--style_3 .c-icon-cards__header {
  gap: 20px;
}

.c-icon-cards--style_3 .c-icon-cards__card {
  padding: 30px;
}

.c-icon-cards--style_3 .c-icon-cards__icon {
  width: 40px;
  height: 40px;
}

.c-icon-cards--style_3 .c-icon-cards__icon-list {
  margin-top: 20px;
  gap: 10px;
}

.c-icon-cards--style_3 .c-icon-cards__icon-list-item {
  gap: 15px;
}

.c-icon-cards--style_3 .c-icon-cards__icon-list-item-icon {
  width: 20px;
  height: 100%;
  flex-shrink: 0;
  padding-top: 2px;
}

.c-icon-cards__icon-list-item-icon svg {
  display: block;
  width: 100%;
  height: 100%;
}

.c-icon-cards__icon {
  display: block;
  flex-shrink: 0;
}

.c-icon-cards__icon-list-item-text {
  margin: 0;
}

@media (min-width: 768px) {
  .c-icon-cards--style_6 .c-icon-cards__title-row {
    flex-direction: row;
  }
}

@media (min-width: 992px) {

  .c-icon-cards--style_2 .c-icon-cards__card,
  .c-icon-cards--style_3 .c-icon-cards__card,
  .c-icon-cards--style_5 .c-icon-cards__card,
  .c-icon-cards--style_6 .c-icon-cards__card {
    padding: 40px;
  }

  .c-icon-cards__item {
    width: calc(
      (100% - (var(--icon-cards-gap) * (var(--icon-cards-per-row-desktop, 1) - 1))) /
        var(--icon-cards-per-row-desktop, 1)
    );
  }
}
.l-video-embed-container {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  max-width: 100%;
}

.l-video-embed-container iframe,
.l-video-embed-container object,
.l-video-embed-container embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.l-cookiebot-privacy-wrapper .hs-embed-wrapper {
  max-height: 100% !important;
  max-width: 100vw !important;
  width: 100%;
}

.CookieDeclarationType {
  border: none !important;
  padding: unset !important;
}
form {
  margin-top: 1rem;
}

form,
.submitted-message {
  font-family: var(--font-family);
  font-size: var(--paragraph-font-size);
  font-weight: 400;
  line-height: 1.5;
  color: var(--body-font-color);
}

/* Form title */
.form-title {
  background-color: var(--form-title-background-color);
  color: var(--form-title-font-color);
}

/* Form fields */
.hs-form-field {
  margin-bottom: 1.4rem;
}

/* Labels */
form label {
  display: block;
  font-size: 1rem;
  font-weight: 400;
  line-height: normal;
  margin-bottom: 0.45rem;
  color: var(--form-label-font-color);
}

/* Help text - legends */
form legend {
  font-size: 0.875rem;
  color: var(--form-help-text-font-color);
}

/* Inputs */
form input[type=text],
form input[type=email],
form input[type=password],
form input[type=tel],
form input[type=number],
form input[type=file],
form select,
form textarea {
  background-color: #FFF;
  border: 1px solid #e7e7f0;
  border-radius: 5px;
  display: inline-block;
  font-size: 1rem;
  padding: 12px 30px;
  width: 100%;
  color: var(--body-font-color);
}

form input[type=text]:focus,
form input[type=email]:focus,
form input[type=password]:focus,
form input[type=tel]:focus,
form input[type=number]:focus,
form input[type=file]:focus,
form select:focus,
form textarea:focus {
  border-color: var(--form-input-focus-border-color);
}

form select {
  /** Replace the dropdown arrow indicator */
  appearance: none;
  background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: right 1rem center;
  background-size: 1em;
}

form fieldset {
  border: none;
  margin: 0;
  max-width: 100% !important;
  padding: 0;
}

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

/* Form placeholder text */
::-webkit-input-placeholder {
  color: var(--body-font-color);
}

::-webkit-input-placeholder,
::-moz-placeholder,
:-ms-input-placeholder,
:-moz-placeholder,
::placeholder,
.hs-fieldtype-date .input .hs-dateinput:before {
  color: var(--body-font-color);
}

/* Inputs - checkbox/radio */
form .inputs-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

form .inputs-list > li {
  display: block;
  margin: 0.7rem 0;
}

form .inputs-list input,
form .inputs-list span {
  vertical-align: middle;
}

form input[type=checkbox],
form input[type=radio] {
  cursor: pointer;
  margin-right: 10px;
}

form input[type=checkbox] {
  height: 18px;
  margin-top: 2px;
  position: relative;
  top: 2px;
  width: 18px;
}

/* Inputs - datepicker */
.hs-dateinput {
  position: relative;
}

.hs-dateinput:before {
  content:'\01F4C5';
  position: absolute;
  right: 10%;
  top: 50%;
  transform: translateY(-50%);
}

.fn-date-picker .pika-table thead th {
  color: #FFF;
}

.fn-date-picker td.is-selected .pika-button {
  border-radius: 0;
  box-shadow: none;
  background: var(--primary-color);
}

.fn-date-picker td .pika-button:hover,
.fn-date-picker td .pika-button:focus {
  border-radius: 0 !important;
  color: #FFF;
  background-color: var(--primary-color) !important;
}

.fn-date-picker td.is-today .pika-button {
  color: var(--primary-color);
}

/* Inputs - file picker */
form input[type=file] {
  background-color: transparent;
  border: initial;
  padding: .7rem 0;
}

/* Headings and text */
form .hs-richtext,
form .hs-richtext p {
  font-size: 0.875rem;
  font-weight: 400;
  margin: 0 0 1.4rem;
}

form .hs-richtext img {
  max-width: 100% !important;
}

/* GDPR */
form .legal-consent-container .hs-richtext,
form .legal-consent-container .hs-richtext p {
  font-size: .75rem;
}

.legal-consent-container .hs-form-booleancheckbox-display > span {
  margin-left: 1.5rem !important;
}

.legal-consent-container .hs-form-booleancheckbox-display > span p {
  font-size: .8rem;
}

.legal-consent-container label {
  color: var(--primary-color);
  font-size: .8rem;
  margin-bottom: 1.5rem;
}

.legal-consent-container li {
  padding-left: 0;
}

.legal-consent-container .hs-form-booleancheckbox-display input {
  display: inline-flex;
  position: relative;
  top: 5px;
}

/* Validation */
.hs-form-required {
  color: var(--form-error-text-font-color);
  margin-left: 7px;
}

.hs-input.invalid.error {
  border-color: var(--form-error-text-font-color);
}

.hs-error-msg {
  color: var(--form-error-text-font-color);
  margin-top: 0.35rem;
}

/* Submit button */
form input[type=submit],
form .hs-button {
  background-color: var(--blue-color);
  border-radius: var(--button-border-radius);
  border: none;
  color: var(--white-color);
  cursor: pointer;
  font-weight: 700;
  letter-spacing: -4%;
  font-size: 1rem;
  max-width: var(--button-max-width);
  padding: var(--button-padding);
  text-align: center;
  transition: all ease .35s;
  white-space: normal;
  text-decoration: none;
}

form .hs-submit .actions {
  display: inline-flex;
  position: relative;
}

/* Captcha */
.grecaptcha-badge {
  /* margin: 0 auto; */
}

/** Style underline **/
.s-form--underline form input[type=email],
.s-form--underline form input[type=file],
.s-form--underline form input[type=number],
.s-form--underline form input[type=password],
.s-form--underline form input[type=tel],
.s-form--underline form input[type=text],
.s-form--underline form select,
.s-form--underline form textarea{
  border: 0 none;
  border-bottom: 1px solid var(--form-label-font-color);
  border-radius: 0;
  outline: 0;
  padding-left: 0;
  padding-right: 0;
  width: 100% !important;
  background-color: transparent;
}

/* Override HubSpot styles */
[data-hsfc-id=Renderer] .hsfc-Step .hsfc-Step__Content {
  padding: 0 !important;
}

[data-hsfc-id=Renderer] .hsfc-FieldLabel,
[data-hsfc-id=Renderer] .hsfc-TextInput,
[data-hsfc-id=Renderer] .hsfc-TextareaInput {
  font-family: var(--font-family) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  color: var(--body-font-color) !important;
}

[data-hsfc-id=Renderer] .hsfc-FieldLabel {
  font-size: 12px !important;
}

[data-hsfc-id=Renderer] .hsfc-TextInput,
[data-hsfc-id=Renderer] .hsfc-TextareaInput,
[data-hsfc-id=Renderer] .hsfc-PhoneInput:not(.hsfc-PhoneInput--rtl) .hsfc-PhoneInput__FlagAndCaret {
  background-color: var(--grey-color) !important;
  border: none !important;
  border-radius: 8px !important;
}

.s-background-color--grey [data-hsfc-id=Renderer] .hsfc-TextInput,
.s-background-color--grey [data-hsfc-id=Renderer] .hsfc-TextareaInput,
.s-background-color--grey [data-hsfc-id=Renderer] .hsfc-PhoneInput:not(.hsfc-PhoneInput--rtl) .hsfc-PhoneInput__FlagAndCaret {
  background-color: var(--white-color) !important;
}

[data-hsfc-id=Renderer] .hsfc-PhoneInput:not(.hsfc-PhoneInput--rtl) .hsfc-PhoneInput__FlagAndCaret {
  border-radius: 8px 0 0 8px !important;
}

[data-hsfc-id=Renderer] .hsfc-TextInput[type=tel] {
  border-radius: 0 8px 8px 0 !important;
}

[data-hsfc-id=Renderer] .hsfc-PhoneInput:not(.hsfc-PhoneInput--rtl) .hsfc-PhoneInput__Input:focus {
  outline: none !important;
}

[data-hsfc-id=Renderer] .hsfc-PhoneInput:not(.hsfc-PhoneInput--rtl) .hsfc-PhoneInput__Input:focus-visible {
  outline: none !important;
}

[data-hsfc-id=Renderer] .hsfc-NavigationRow__Buttons:has(>*:only-child) {
  justify-content: flex-start !important;
}

.hsfc-DataPrivacyField {
  color: var(--body-font-color) !important;
  font-family: var(--font-family) !important;
  font-size: 12px;
}
/*
 * Petal image overlay — reusable across modules (AdvancedImage and others).
 * Markup: .c-petal > .c-petal__inner > .c-petal__frame > img
 */

.c-petal {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  --petal-border-width: 28px;
  --petal-border-offset-top: 30px;
  --petal-crop-inset: 20px;
  --petal-accent-color: var(--cerise-color);
}

/* Regular — tighter corner crop */
.c-petal--size-regular {
  --petal-crop-inset: 20px;
}

/*
 * Large — larger frame bleed than Regular (no transform: scale; that breaks
 * border-radius clipping and shows a second rectangular copy of the image).
 */
.c-petal--size-large {
  --petal-crop-inset: 54px;
}

.c-petal__inner {
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.c-petal__frame {
  position: absolute;
  z-index: 1;
  overflow: hidden;
  border-radius: 0 100% 0 100%;
  width: calc(100% + var(--petal-crop-inset));
  height: calc(100% + var(--petal-crop-inset));
  top: 0;
  left: calc(-1 * var(--petal-crop-inset));
}

.c-petal__frame img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.c-petal--orientation-left {
  --petal-border-width: 100px;
  --petal-border-offset-top: 85px;
}

.c-petal--orientation-left .c-petal__frame,
.c-petal--orientation-right .c-petal__frame {
  border-radius: 0 100% 0 100%;
}

/* Shared cerise accent on the bottom-left curve of the mask shape */
.c-petal--orientation-left .c-petal__inner::before,
.c-petal--orientation-right .c-petal__inner::before {
  content: '';
  position: absolute;
  top: var(--petal-border-offset-top);
  left: calc(-2 * var(--petal-crop-inset));
  z-index: 0;
  width: calc(100% + var(--petal-crop-inset));
  height: calc(100% + var(--petal-crop-inset));
  box-sizing: border-box;
  border-radius: 0 100% 0 100%;
  border-top: none;
  border-right: none;
  border-left: var(--petal-border-width) solid
    var(--petal-accent-color, var(--cerise-color, #ff4a75));
  border-bottom: var(--petal-border-width) solid
    var(--petal-accent-color, var(--cerise-color, #ff4a75));
  pointer-events: none;
  transform: rotate(-5deg);
}

/*
 * Right: mirror left via scaleX so border geometry matches;
 * photo is un-flipped inside the frame.
 */
.c-petal--orientation-right {
  --petal-border-width: 100px;
  --petal-border-offset-top: 85px;
}

.c-petal--orientation-right .c-petal__inner {
  transform: scaleX(-1);
}

.c-petal--orientation-right .c-petal__frame img {
  transform: scaleX(-1);
}

/*
 * Large petal — full-square gradient behind the photo (::before border disabled).
 * Hard stop: transparent 0–60%, solid accent 60–100%.
 */
.c-petal--size-large .c-petal__inner {
  z-index: 1;
}

.c-petal--size-large .c-petal__inner::before {
  display: none;
}

.c-petal--size-large.c-petal--orientation-left::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: linear-gradient(
    to bottom left,
    transparent 0%,
    transparent 60%,
    var(--petal-accent-color, var(--cerise-color, #ff4a75)) 60%,
    var(--petal-accent-color, var(--cerise-color, #ff4a75)) 100%
  );
}

.c-petal--size-large.c-petal--orientation-right::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: linear-gradient(
    to bottom right,
    transparent 0%,
    transparent 60%,
    var(--petal-accent-color, var(--cerise-color, #ff4a75)) 60%,
    var(--petal-accent-color, var(--cerise-color, #ff4a75)) 100%
  );
}
.c-dialog {
  border: none;
  max-width: var(--dialog-max-width, 800px);
  max-height: var(--dialog-max-height, none);
  padding: var(--dialog-padding, 1.5rem);
  position: fixed;
  width: 100%;
}

.c-dialog::backdrop {
  animation: fade-in 1s;
  background: rgba(0, 0, 0, 0.4);
  backdrop-filter: blur(3px);
}

.c-dialog__close-form {
  margin-top: 0;
  position: absolute;
  right: 0;
  top: 0;
}

.c-dialog__close-icon {
  background: var(--primary-color);
  color: var(--white-color);
  cursor: pointer;
  padding: .5rem;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 1;
}

.c-dialog__close-icon svg {
  fill: currentColor;
}

.c-dialog--video {
  --dialog-max-width: 98%;
  --dialog-padding: 0;
  overflow: hidden;
}

.c-dialog__video-embed--external {
  height: 0;
  padding-bottom: 56.25%;
  width: 100%;
}

.c-dialog__video-embed--external iframe {
  aspect-ratio: 16 / 9;
  height: unset;
  width: 100%;
}

@keyframes fade-in {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@media (min-width: 1024px) {
  .c-dialog--video {
    --dialog-max-width: 75%;
  }
}
#l-main-content .splide__pagination {
  bottom: -40px;
}

#l-main-content .splide__pagination__page {
  background: var(--primary-color);
}

#l-main-content .splide__pagination__page.is-active {
  background: var(--secondary-color);
}

#l-main-content .splide__arrow {
  opacity: 1;
}

#l-main-content .splide__arrow.splide__arrow--prev {
  left: 0;
}

#l-main-content .splide__arrow.splide__arrow--next {
  right: 0;
}

#l-main-content .splide__arrow.splide__arrow--prev,
#l-main-content .splide__arrow.splide__arrow--next {
  background: var(--secondary-color);
}

#l-main-content .splide__arrow svg {
  fill: var(--white-color);
}

#l-main-content .splide__slide img {
  max-width: 100%;
}
/* Table */
table {
  border: 1px solid var(--table-border-color);
  border-collapse: separate;
  border-spacing: 0;
  margin-bottom: 1.4rem;
  overflow-wrap: break-word;
  background-color: var(--table-background-color);
  border-color: var(--table-border-color);
  border-radius: 5px;
  width: 100%;
  overflow: hidden;
}

/* Table Cells */
th,
td {
  border-right: 1px solid;
  border-bottom: 1px solid;
  padding: 0.75rem;
  vertical-align: top;
  border-color: var(--table-border-color);
  color: var(--table-font-color);
}

/* Remove right border from last column */
th:last-child,
td:last-child {
  border-right: none;
}

/* Remove bottom border from last row */
tbody tr:last-child th,
tbody tr:last-child td {
  border-bottom: none;
}

/* Table Header */
thead th,
thead td {
  vertical-align: bottom;
  background-color: var(--table-header-background-color);
  color: var(--table-header-font-color);
}

/* Table Footer */
tfoot td {
  background-color: var(--table-footer-background-color);
  border-bottom: none;
  color: var(--table-footer-font-color);
}
/**
 * Shared topic / label tags (Featured Blogs and other modules).
 * Use with theme flex utilities on the list, e.g. l-flex l-flex--direction-row l-flex--wrap.
 */

.c-tags {
  gap: 12px;
}

.c-tag {
  box-sizing: border-box;
  color: var(--white-color);
  padding: 8px;
  border-radius: 8px;
  background-color: var(--cerise-color);
  font-size: 14px;
  font-weight: 400;
  line-height: 100%;
}

/* Background colour modifiers — pair with base `.c-tag` (TagsRepeater and other modules). */
.c-tag.c-tag--purple {
  background-color: var(--purple-color);
  color: var(--white-color);
}

.c-tag.c-tag--blue {
  background-color: var(--blue-color);
  color: var(--white-color);
}

/* Teal is light: purple text for contrast (matches CtaCardWithTags). */
.c-tag.c-tag--teal {
  background-color: var(--teal-color);
  color: var(--purple-color);
}

.c-tag.c-tag--cerise {
  background-color: var(--cerise-color);
  color: var(--white-color);
}

/* Selected / current page — inverse of default .c-tag; :visited keeps link color correct */
.c-tag.c-tag--active,
.c-tag.c-tag--active:hover,
.c-tag.c-tag--active:focus,
.c-tag.c-tag--active:visited {
  background-color: var(--white-color);
  color: var(--cerise-color);
}
html {
  scroll-behavior: smooth;
  font-size: var(--body-font-size);
}

html[lang^="ja"] body,
html[lang^="zh"] body,
html[lang^="ko"] body {
  line-break: strict;
  word-break: break-all;
}

body {
  color: var(--body-font-color);
  font-family: var(--font-family);
  font-weight: var(--body-font-weight);
  letter-spacing: var(--body-font-letter-spacing);
  line-height: var(--body-font-line-height);
  word-break: break-word;
}

/* Paragraphs */
p {
  font-size: calc(var(--paragraph-font-size) * .9);
  margin: 0 0 1.2em 0;
}

strong {
  font-weight: var(--heading-font-weight);
}


/* Anchors */
a {
  cursor: pointer;
  text-decoration: underline;
  transition: all .3s ease-in-out;
  color: var(--anchor-font-color);
}

a:not(.c-button):active,
a:not(.c-button):hover,
a:not(.c-button):focus {
  text-decoration: none;
  color: var(--anchor-font-hover-color);
}

a.s-link-dark:hover,
a.s-link-dark:focus {
  color: var(--primary-color);
}

/* Headings */
h1,
h2,
h3, 
h4,
h5,
h6 {
  color: var(--heading-font-color);
  font-family: var(--font-family);
  font-weight: var(--heading-font-weight);
  letter-spacing: var(--heading-font-letter-spacing);
  line-height: var(--heading-font-line-height);
  margin: 0 0 .5rem 0;
}

h3,
h4 {
  font-weight: 600;
}

h5,
h6 {
  font-weight: 500;
}

h1 {
  font-size: calc(var(--heading-1-font-size) * .5);
  line-height: 1.2;
  margin-bottom: .75rem;
}

h2 {
  font-size: calc(var(--heading-2-font-size) * .65);
}

h3 {
  font-size: calc(var(--heading-3-font-size) * .6);
}

h4 {
  font-size: calc(var(--heading-4-font-size) * .75);
}

h5 {
  font-size: calc(var(--heading-5-font-size) * .75);
}

h6 {
  font-size: var(--heading-6-font-size);
}


small, .text_small {
  font-size: var(--small-font-size);
  font-weight: var(--body-font-weight);
  letter-spacing: var(--body-font-letter-spacing);
  line-height: var(--body-font-line-height);
}

/* Lists */
ul,
ol {
  margin: 0 0 1.4rem;
  padding-left: 0;
}

ul ul,
ol ul,
ul ol,
ol ol {
  margin: .5em 0 0 0;
  padding-left: 0;
}

ul.no-list {
  list-style: none;
}

li {
  line-height: 1.6;
  margin-bottom: .5em;
  padding-left: 0.25em;
  font-size: calc(var(--body-font-size) * .9);
}

li:not(.hs-menu-item):not(.splide__slide):not(.osano-cm-list-item) {
  margin-left: 1rem;
}

ol {
  list-style-type: none;
  counter-reset: item;
  /* margin: 0; */
  /* padding: 0; */
}

ol li:not(.hs-menu-item):not(.splide__slide):not(.osano-cm-list) {
  margin-left: 0;
}

ol>li {
  display: table;
  counter-increment: item;
  /* margin-left: 0; */
  /* margin-bottom: 0.6em; */
}

ol>li:before {
  content: counters(item, ".") ". ";
  display: table-cell;
  padding-right: 0.6em;
  word-break: initial;
}

li ol li:last-child {
  margin-bottom: 0;
}

li ol>li:before {
  content: counters(item, ".") " ";
}

li ol li ol>li:before {
  content: counters(item, ".") " ";
}

/* Code blocks */
pre {
  overflow: auto;
}

code {
  background-color: #eee;
  display: block;
  padding: 1em;
  vertical-align: bottom;
}

/* Blockquotes */
blockquote {
  border-left: 4px solid;
  margin: 1rem 0;
  padding: 2rem;
  border-left-color: var(--secondary-color);
}

/* Horizontal rules */
hr {
  background-color: #CECECE;
  border: none;
  color: #CECECE;
  height: 1px;
  margin: 25px 0;
}

.s-text-color--white hr {
  background-color: var(--white-color);
  color: var(--white-color);
}

th, td {
  font-size: calc(var(--body-font-size) * .9);
}

/* Image alt text */
img {
  font-size: 1em;
  word-break: normal;
}

.hs-search-field {
  margin-bottom: 2em;
}

.hs-search-field__suggestions-container {
  padding: 1em 0;
  z-index: 10;
}

.hs-search-field--open .hs-search-field__suggestions, .inpage-editor-active-field .hs-search-field__suggestions {
  border: none;
}

/*********************
  RESPONSIVE STYLES
*********************/

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
  .hs-image-widget {
    margin-bottom: 0
  }

}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
  p {
    font-size: var(--paragraph-font-size);
  }

  li, th, td {
    font-size: var(--body-font-size);
  }

  h1 {
    font-size: var(--heading-1-font-size);
  }

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

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

  h4 {
    font-size: var(--heading-4-font-size);
  }

  h5 {
    font-size: var(--heading-5-font-size);
  }

  h6 {
    font-size: var(--heading-6-font-size);
  }
}

/* X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {}

/* XX-Large devices (larger desktops, 1400px and up)*/
@media (min-width: 1400px) {}

/*  Objects
    Non-cosmetic design patterns including grid and layout classes)
*/
#l-main-content {
  /* overflow: hidden; */
}

.content-wrapper {
  margin: 0 auto;
  padding: 0 20px;
  max-width: var(--container-width);
}
.dnd-section{
  overflow-x: clip;
}

.dnd-section,
.content-wrapper--vertical-spacing {
  padding: var(--dnd-section-padding-mobile);
}

.dnd-section.row-number-1 {
  padding: var(--hero-section-padding-mobile);
}

.dnd-section > .row-fluid {
  margin: 0 auto;
  max-width: var(--container-width);
}

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

@media (min-width: 768px) {
  .dnd-section,
  .content-wrapper--vertical-spacing {
    padding: var(--dnd-section-padding-tablet);
  }

  .dnd-section.row-number-1 {
    padding: var(--hero-section-padding-tablet);
  }
}

@media (min-width: 992px) {
  .dnd-section,
  .content-wrapper--vertical-spacing {
    padding: var(--dnd-section-padding);
  }

  .dnd-section.row-number-1 {
    padding: var(--hero-section-padding);
  }

}

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

@media (min-width: 1600px) {
  .content-wrapper {
    max-width: var(--container-width);
  }

  .dnd-section > .row-fluid {
    max-width: var(--container-width);
  }
}

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

.l-flex--inline {
  display: inline-flex;
}

/*******************************************
  Direction
*******************************************/
.l-flex--direction-row {
  flex-direction: row;
}

.l-flex--direction-row-reverse {
  flex-direction: row-reverse;
}

.l-flex--direction-column {
  flex-direction: column;
}

.l-flex--direction-column-reverse {
  flex-direction: column-reverse;
}

/*******************************************
  Wrap
*******************************************/
.l-flex--nowrap {
  flex-wrap: nowrap;
}

.l-flex--wrap {
  flex-wrap: wrap;
}

.l-flex--wrap-reverse {
  flex-wrap: wrap-reverse;
}

/*******************************************
  Justify Content
*******************************************/
.l-flex--justify-content-flex-start {
  justify-content: flex-start;
}

.l-flex--justify-content-flex-end {
  justify-content: flex-end;
}

.l-flex--justify-content-center {
  justify-content: center;
}

.l-flex--justify-content-space-between {
  justify-content: space-between;
}

.l-flex--justify-content-space-around {
  justify-content: space-around;
}

.l-flex--justify-content-space-evenly {
  justify-content: space-evenly;
}

.l-flex--justify-content-start {
  justify-content: start;
}

.l-flex--justify-content-end {
  justify-content: end;
}

.l-flex--justify-content-left {
  justify-content: left;
}

.l-flex--justify-content-right {
  justify-content: right;
}

/*******************************************
  Align Items
*******************************************/
.l-flex--align-items-stretch {
  align-items: stretch;
}

.l-flex--align-items-flex-start {
  align-items: flex-start;
}

.l-flex--align-items-flex-end {
  align-items: flex-end;
}

.l-flex--align-items-center {
  align-items: center;
}

.l-flex--align-items-baseline {
  align-items: baseline;
}

.l-flex--align-items-first-baseline {
  align-items: first baseline;
}

.l-flex--align-items-last-baseline {
  align-items: last baseline;
}

.l-flex--align-items-start {
  align-items: start;
}

.l-flex--align-items-end {
  align-items: end;
}

.l-flex--align-items-self-start {
  align-items: self-start;
}

.l-flex--align-items-self-end {
  align-items: self-end;
}

/*******************************************
  Align Content
*******************************************/
.l-flex--align-content-flex-start {
  align-content: flex-start;
}

.l-flex--align-content-flex-end {
  align-content: flex-end;
}

.l-flex--align-content-center {
  align-content: center;
}

.l-flex--align-content-space-between {
  align-content: space-between;
}

.l-flex--align-content-space-around {
  align-content: space-around;
}

.l-flex--align-content-space-evenly {
  align-content: space-evenly;
}

.l-flex--align-content-stretch {
  align-content: start;
}

.l-flex--align-content-start {
  align-content: start;
}

.l-flex--align-content-end {
  align-content: end;
}

.l-flex--align-content-baseline {
  align-content: baseline;
}

.l-flex--align-content-first-baseline {
  align-content: first baseline;
}

.l-flex--align-content-last-baseline {
  align-content: last baseline;
}

/*******************************************
  Align Self
*******************************************/
.l-flex--align-self-auto {
  align-self: auto;
}

.l-flex--align-self-flex-start {
  align-self: flex-start;
}

.l-flex--align-self-flex-end {
  align-self: flex-end;
}

.l-flex--align-self-center {
  align-self: center;
}

.l-flex--align-self-baseline {
  align-self: baseline;
}

.l-flex--align-self-stretch {
  align-self: stretch;
}


/*************************************************************
  RESPONSIVE STYLES
************************************************************/


/************************************************************
  Small devices (landscape phones, 576px and up)
  Class names should have --sm added to denote the media breakpoint
************************************************************/
@media (min-width: 576px) {
  /*******************************************
    Direction
  *******************************************/
  .l-flex--direction-row--sm {
    flex-direction: row;
  }

  .l-flex--direction-row-reverse--sm {
    flex-direction: row-reverse;
  }

  .l-flex--direction-column--sm {
    flex-direction: column;
  }

  .l-flex--direction-column-reverse--sm {
    flex-direction: column-reverse;
  }

  /*******************************************
    Wrap
  *******************************************/
  .l-flex--nowrap--sm {
    flex-wrap: nowrap;
  }

  .l-flex--wrap--sm {
    flex-wrap: wrap;
  }

  .l-flex--wrap-reverse--sm {
    flex-wrap: wrap-reverse;
  }

  /*******************************************
    Justify Content
  *******************************************/
  .l-flex--justify-content-flex-start--sm {
    justify-content: flex-start;
  }

  .l-flex--justify-content-flex-end--sm {
    justify-content: flex-end;
  }

  .l-flex--justify-content-center--sm {
    justify-content: center;
  }

  .l-flex--justify-content-space-between--sm {
    justify-content: space-between;
  }

  .l-flex--justify-content-space-around--sm {
    justify-content: space-around;
  }

  .l-flex--justify-content-space-evenly--sm {
    justify-content: space-evenly;
  }

  .l-flex--justify-content-start--sm {
    justify-content: start;
  }

  .l-flex--justify-content-end--sm {
    justify-content: end;
  }

  .l-flex--justify-content-left--sm {
    justify-content: left;
  }

  .l-flex--justify-content-right--sm {
    justify-content: right;
  }

  /*******************************************
    Align Items
  *******************************************/
  .l-flex--align-items-stretch--sm {
    align-items: stretch;
  }

  .l-flex--align-items-flex-start--sm {
    align-items: flex-start;
  }

  .l-flex--align-items-flex-end--sm {
    align-items: flex-end;
  }

  .l-flex--align-items-center--sm {
    align-items: center;
  }

  .l-flex--align-items-baseline--sm {
    align-items: baseline;
  }

  .l-flex--align-items-first-baseline--sm {
    align-items: first baseline;
  }

  .l-flex--align-items-last-baseline--sm {
    align-items: last baseline;
  }

  .l-flex--align-items-start--sm {
    align-items: start;
  }

  .l-flex--align-items-end--sm {
    align-items: end;
  }

  .l-flex--align-items-self-start--sm {
    align-items: self-start;
  }

  .l-flex--align-items-self-end--sm {
    align-items: self-end;
  }

  /*******************************************
    Align Content
  *******************************************/
  .l-flex--align-content-flex-start--sm {
    align-content: flex-start;
  }

  .l-flex--align-content-flex-end--sm {
    align-content: flex-end;
  }

  .l-flex--align-content-center--sm {
    align-content: center;
  }

  .l-flex--align-content-space-between--sm {
    align-content: space-between;
  }

  .l-flex--align-content-space-around--sm {
    align-content: space-around;
  }

  .l-flex--align-content-space-evenly--sm {
    align-content: space-evenly;
  }

  .l-flex--align-content-stretch--sm {
    align-content: start;
  }

  .l-flex--align-content-start--sm {
    align-content: start;
  }

  .l-flex--align-content-end--sm {
    align-content: end;
  }

  .l-flex--align-content-baseline--sm {
    align-content: baseline;
  }

  .l-flex--align-content-first-baseline--sm {
    align-content: first baseline;
  }

  .l-flex--align-content-last-baseline--sm {
    align-content: last baseline;
  }

  /*******************************************
    Align Self
  *******************************************/
  .l-flex--align-self-auto--sm {
    align-self: auto;
  }

  .l-flex--align-self-flex-start--sm {
    align-self: flex-start;
  }

  .l-flex--align-self-flex-end--sm {
    align-self: flex-end;
  }

  .l-flex--align-self-center--sm {
    align-self: center;
  }

  .l-flex--align-self-baseline--sm {
    align-self: baseline;
  }

  .l-flex--align-self-stretch--sm {
    align-self: stretch;
  }
}


/************************************************************
  Medium devices (tablets, 768px and up)
  Class names should have --md added to denote the media breakpoint
************************************************************/
@media (min-width: 768px) {
  /*******************************************
    Direction
  *******************************************/
  .l-flex--direction-row--md {
    flex-direction: row;
  }

  .l-flex--direction-row-reverse--md {
    flex-direction: row-reverse;
  }

  .l-flex--direction-column--md {
    flex-direction: column;
  }

  .l-flex--direction-column-reverse--md {
    flex-direction: column-reverse;
  }

  /*******************************************
    Wrap
  *******************************************/
  .l-flex--nowrap--md {
    flex-wrap: nowrap;
  }

  .l-flex--wrap--md {
    flex-wrap: wrap;
  }

  .l-flex--wrap-reverse--md {
    flex-wrap: wrap-reverse;
  }

  /*******************************************
    Justify Content
  *******************************************/
  .l-flex--justify-content-flex-start--md {
    justify-content: flex-start;
  }

  .l-flex--justify-content-flex-end--md {
    justify-content: flex-end;
  }

  .l-flex--justify-content-center--md {
    justify-content: center;
  }

  .l-flex--justify-content-space-between--md {
    justify-content: space-between;
  }

  .l-flex--justify-content-space-around--md {
    justify-content: space-around;
  }

  .l-flex--justify-content-space-evenly--md {
    justify-content: space-evenly;
  }

  .l-flex--justify-content-start--md {
    justify-content: start;
  }

  .l-flex--justify-content-end--md {
    justify-content: end;
  }

  .l-flex--justify-content-left--md {
    justify-content: left;
  }

  .l-flex--justify-content-right--md {
    justify-content: right;
  }

  /*******************************************
    Align Items
  *******************************************/
  .l-flex--align-items-stretch--md {
    align-items: stretch;
  }

  .l-flex--align-items-flex-start--md {
    align-items: flex-start;
  }

  .l-flex--align-items-flex-end--md {
    align-items: flex-end;
  }

  .l-flex--align-items-center--md {
    align-items: center;
  }

  .l-flex--align-items-baseline--md {
    align-items: baseline;
  }

  .l-flex--align-items-first-baseline--md {
    align-items: first baseline;
  }

  .l-flex--align-items-last-baseline--md {
    align-items: last baseline;
  }

  .l-flex--align-items-start--md {
    align-items: start;
  }

  .l-flex--align-items-end--md {
    align-items: end;
  }

  .l-flex--align-items-self-start--md {
    align-items: self-start;
  }

  .l-flex--align-items-self-end--md {
    align-items: self-end;
  }

  /*******************************************
    Align Content
  *******************************************/
  .l-flex--align-content-flex-start--md {
    align-content: flex-start;
  }

  .l-flex--align-content-flex-end--md {
    align-content: flex-end;
  }

  .l-flex--align-content-center--md {
    align-content: center;
  }

  .l-flex--align-content-space-between--md {
    align-content: space-between;
  }

  .l-flex--align-content-space-around--md {
    align-content: space-around;
  }

  .l-flex--align-content-space-evenly--md {
    align-content: space-evenly;
  }

  .l-flex--align-content-stretch--md {
    align-content: start;
  }

  .l-flex--align-content-start--md {
    align-content: start;
  }

  .l-flex--align-content-end--md {
    align-content: end;
  }

  .l-flex--align-content-baseline--md {
    align-content: baseline;
  }

  .l-flex--align-content-first-baseline--md {
    align-content: first baseline;
  }

  .l-flex--align-content-last-baseline--md {
    align-content: last baseline;
  }

  /*******************************************
    Align Self
  *******************************************/
  .l-flex--align-self-auto--md {
    align-self: auto;
  }

  .l-flex--align-self-flex-start--md {
    align-self: flex-start;
  }

  .l-flex--align-self-flex-end--md {
    align-self: flex-end;
  }

  .l-flex--align-self-center--md {
    align-self: center;
  }

  .l-flex--align-self-baseline--md {
    align-self: baseline;
  }

  .l-flex--align-self-stretch--md {
    align-self: stretch;
  }
}


/************************************************************
  Large devices (desktops, 992px and up)
  Class names should have --lg added to denote the media breakpoint
************************************************************/
@media (min-width: 992px) {
  /*******************************************
    Direction
  *******************************************/
  .l-flex--direction-row--lg {
    flex-direction: row;
  }

  .l-flex--direction-row-reverse--lg {
    flex-direction: row-reverse;
  }

  .l-flex--direction-column--lg {
    flex-direction: column;
  }

  .l-flex--direction-column-reverse--lg {
    flex-direction: column-reverse;
  }

  /*******************************************
    Wrap
  *******************************************/
  .l-flex--nowrap--lg {
    flex-wrap: nowrap;
  }

  .l-flex--wrap--lg {
    flex-wrap: wrap;
  }

  .l-flex--wrap-reverse--lg {
    flex-wrap: wrap-reverse;
  }

  /*******************************************
    Justify Content
  *******************************************/
  .l-flex--justify-content-flex-start--lg {
    justify-content: flex-start;
  }

  .l-flex--justify-content-flex-end--lg {
    justify-content: flex-end;
  }

  .l-flex--justify-content-center--lg {
    justify-content: center;
  }

  .l-flex--justify-content-space-between--lg {
    justify-content: space-between;
  }

  .l-flex--justify-content-space-around--lg {
    justify-content: space-around;
  }

  .l-flex--justify-content-space-evenly--lg {
    justify-content: space-evenly;
  }

  .l-flex--justify-content-start--lg {
    justify-content: start;
  }

  .l-flex--justify-content-end--lg {
    justify-content: end;
  }

  .l-flex--justify-content-left--lg {
    justify-content: left;
  }

  .l-flex--justify-content-right--lg {
    justify-content: right;
  }

  /*******************************************
    Align Items
  *******************************************/
  .l-flex--align-items-stretch--lg {
    align-items: stretch;
  }

  .l-flex--align-items-flex-start--lg {
    align-items: flex-start;
  }

  .l-flex--align-items-flex-end--lg {
    align-items: flex-end;
  }

  .l-flex--align-items-center--lg {
    align-items: center;
  }

  .l-flex--align-items-baseline--lg {
    align-items: baseline;
  }

  .l-flex--align-items-first-baseline--lg {
    align-items: first baseline;
  }

  .l-flex--align-items-last-baseline--lg {
    align-items: last baseline;
  }

  .l-flex--align-items-start--lg {
    align-items: start;
  }

  .l-flex--align-items-end--lg {
    align-items: end;
  }

  .l-flex--align-items-self-start--lg {
    align-items: self-start;
  }

  .l-flex--align-items-self-end--lg {
    align-items: self-end;
  }

  /*******************************************
    Align Content
  *******************************************/
  .l-flex--align-content-flex-start--lg {
    align-content: flex-start;
  }

  .l-flex--align-content-flex-end--lg {
    align-content: flex-end;
  }

  .l-flex--align-content-center--lg {
    align-content: center;
  }

  .l-flex--align-content-space-between--lg {
    align-content: space-between;
  }

  .l-flex--align-content-space-around--lg {
    align-content: space-around;
  }

  .l-flex--align-content-space-evenly--lg {
    align-content: space-evenly;
  }

  .l-flex--align-content-stretch--lg {
    align-content: start;
  }

  .l-flex--align-content-start--lg {
    align-content: start;
  }

  .l-flex--align-content-end--lg {
    align-content: end;
  }

  .l-flex--align-content-baseline--lg {
    align-content: baseline;
  }

  .l-flex--align-content-first-baseline--lg {
    align-content: first baseline;
  }

  .l-flex--align-content-last-baseline--lg {
    align-content: last baseline;
  }

  /*******************************************
    Align Self
  *******************************************/
  .l-flex--align-self-auto--lg {
    align-self: auto;
  }

  .l-flex--align-self-flex-start--lg {
    align-self: flex-start;
  }

  .l-flex--align-self-flex-end--lg {
    align-self: flex-end;
  }

  .l-flex--align-self-center--lg {
    align-self: center;
  }

  .l-flex--align-self-baseline--lg {
    align-self: baseline;
  }

  .l-flex--align-self-stretch--lg {
    align-self: stretch;
  }
}


/************************************************************
  X-Large devices (large desktops, 1200px and up)
  Class names should have --xl added to denote the media breakpoint
************************************************************/
@media (min-width: 1200px) {
  /*******************************************
    Direction
  *******************************************/
  .l-flex--direction-row--xl {
    flex-direction: row;
  }

  .l-flex--direction-row-reverse--xl {
    flex-direction: row-reverse;
  }

  .l-flex--direction-column--xl {
    flex-direction: column;
  }

  .l-flex--direction-column-reverse--xl {
    flex-direction: column-reverse;
  }

  /*******************************************
    Wrap
  *******************************************/
  .l-flex--nowrap--xl {
    flex-wrap: nowrap;
  }

  .l-flex--wrap--xl {
    flex-wrap: wrap;
  }

  .l-flex--wrap-reverse--xl {
    flex-wrap: wrap-reverse;
  }

  /*******************************************
    Justify Content
  *******************************************/
  .l-flex--justify-content-flex-start--xl {
    justify-content: flex-start;
  }

  .l-flex--justify-content-flex-end--xl {
    justify-content: flex-end;
  }

  .l-flex--justify-content-center--xl {
    justify-content: center;
  }

  .l-flex--justify-content-space-between--xl {
    justify-content: space-between;
  }

  .l-flex--justify-content-space-around--xl {
    justify-content: space-around;
  }

  .l-flex--justify-content-space-evenly--xl {
    justify-content: space-evenly;
  }

  .l-flex--justify-content-start--xl {
    justify-content: start;
  }

  .l-flex--justify-content-end--xl {
    justify-content: end;
  }

  .l-flex--justify-content-left--xl {
    justify-content: left;
  }

  .l-flex--justify-content-right--xl {
    justify-content: right;
  }

  /*******************************************
    Align Items
  *******************************************/
  .l-flex--align-items-stretch--xl {
    align-items: stretch;
  }

  .l-flex--align-items-flex-start--xl {
    align-items: flex-start;
  }

  .l-flex--align-items-flex-end--xl {
    align-items: flex-end;
  }

  .l-flex--align-items-center--xl {
    align-items: center;
  }

  .l-flex--align-items-baseline--xl {
    align-items: baseline;
  }

  .l-flex--align-items-first-baseline--xl {
    align-items: first baseline;
  }

  .l-flex--align-items-last-baseline--xl {
    align-items: last baseline;
  }

  .l-flex--align-items-start--xl {
    align-items: start;
  }

  .l-flex--align-items-end--xl {
    align-items: end;
  }

  .l-flex--align-items-self-start--xl {
    align-items: self-start;
  }

  .l-flex--align-items-self-end--xl {
    align-items: self-end;
  }

  /*******************************************
    Align Content
  *******************************************/
  .l-flex--align-content-flex-start--xl {
    align-content: flex-start;
  }

  .l-flex--align-content-flex-end--xl {
    align-content: flex-end;
  }

  .l-flex--align-content-center--xl {
    align-content: center;
  }

  .l-flex--align-content-space-between--xl {
    align-content: space-between;
  }

  .l-flex--align-content-space-around--xl {
    align-content: space-around;
  }

  .l-flex--align-content-space-evenly--xl {
    align-content: space-evenly;
  }

  .l-flex--align-content-stretch--xl {
    align-content: start;
  }

  .l-flex--align-content-start--xl {
    align-content: start;
  }

  .l-flex--align-content-end--xl {
    align-content: end;
  }

  .l-flex--align-content-baseline--xl {
    align-content: baseline;
  }

  .l-flex--align-content-first-baseline--xl {
    align-content: first baseline;
  }

  .l-flex--align-content-last-baseline--xl {
    align-content: last baseline;
  }

  /*******************************************
    Align Self
  *******************************************/
  .l-flex--align-self-auto--xl {
    align-self: auto;
  }

  .l-flex--align-self-flex-start--xl {
    align-self: flex-start;
  }

  .l-flex--align-self-flex-end--xl {
    align-self: flex-end;
  }

  .l-flex--align-self-center--xl {
    align-self: center;
  }

  .l-flex--align-self-baseline--xl {
    align-self: baseline;
  }

  .l-flex--align-self-stretch--xl {
    align-self: stretch;
  }
}


/************************************************************
  XX-Large devices (larger desktops, 1400px and up)
  Class names should have --xxl added to denote the media breakpoint
************************************************************/
@media (min-width: 1400px) {
  /*******************************************
    Direction
  *******************************************/
  .l-flex--direction-row--xxl {
    flex-direction: row;
  }

  .l-flex--direction-row-reverse--xxl {
    flex-direction: row-reverse;
  }

  .l-flex--direction-column--xxl {
    flex-direction: column;
  }

  .l-flex--direction-column-reverse--xxl {
    flex-direction: column-reverse;
  }

  /*******************************************
    Wrap
  *******************************************/
  .l-flex--nowrap--xxl {
    flex-wrap: nowrap;
  }

  .l-flex--wrap--xxl {
    flex-wrap: wrap;
  }

  .l-flex--wrap-reverse--xxl {
    flex-wrap: wrap-reverse;
  }

  /*******************************************
    Justify Content
  *******************************************/
  .l-flex--justify-content-flex-start--xxl {
    justify-content: flex-start;
  }

  .l-flex--justify-content-flex-end--xxl {
    justify-content: flex-end;
  }

  .l-flex--justify-content-center--xxl {
    justify-content: center;
  }

  .l-flex--justify-content-space-between--xxl {
    justify-content: space-between;
  }

  .l-flex--justify-content-space-around--xxl {
    justify-content: space-around;
  }

  .l-flex--justify-content-space-evenly--xxl {
    justify-content: space-evenly;
  }

  .l-flex--justify-content-start--xxl {
    justify-content: start;
  }

  .l-flex--justify-content-end--xxl {
    justify-content: end;
  }

  .l-flex--justify-content-left--xxl {
    justify-content: left;
  }

  .l-flex--justify-content-right--xxl {
    justify-content: right;
  }

  /*******************************************
    Align Items
  *******************************************/
  .l-flex--align-items-stretch--xxl {
    align-items: stretch;
  }

  .l-flex--align-items-flex-start--xxl {
    align-items: flex-start;
  }

  .l-flex--align-items-flex-end--xxl {
    align-items: flex-end;
  }

  .l-flex--align-items-center--xxl {
    align-items: center;
  }

  .l-flex--align-items-baseline--xxl {
    align-items: baseline;
  }

  .l-flex--align-items-first-baseline--xxl {
    align-items: first baseline;
  }

  .l-flex--align-items-last-baseline--xxl {
    align-items: last baseline;
  }

  .l-flex--align-items-start--xxl {
    align-items: start;
  }

  .l-flex--align-items-end--xxl {
    align-items: end;
  }

  .l-flex--align-items-self-start--xxl {
    align-items: self-start;
  }

  .l-flex--align-items-self-end--xxl {
    align-items: self-end;
  }

  /*******************************************
    Align Content
  *******************************************/
  .l-flex--align-content-flex-start--xxl {
    align-content: flex-start;
  }

  .l-flex--align-content-flex-end--xxl {
    align-content: flex-end;
  }

  .l-flex--align-content-center--xxl {
    align-content: center;
  }

  .l-flex--align-content-space-between--xxl {
    align-content: space-between;
  }

  .l-flex--align-content-space-around--xxl {
    align-content: space-around;
  }

  .l-flex--align-content-space-evenly--xxl {
    align-content: space-evenly;
  }

  .l-flex--align-content-stretch--xxl {
    align-content: start;
  }

  .l-flex--align-content-start--xxl {
    align-content: start;
  }

  .l-flex--align-content-end--xxl {
    align-content: end;
  }

  .l-flex--align-content-baseline--xxl {
    align-content: baseline;
  }

  .l-flex--align-content-first-baseline--xxl {
    align-content: first baseline;
  }

  .l-flex--align-content-last-baseline--xxl {
    align-content: last baseline;
  }

  /*******************************************
    Align Self
  *******************************************/
  .l-flex--align-self-auto--xxl {
    align-self: auto;
  }

  .l-flex--align-self-flex-start--xxl {
    align-self: flex-start;
  }

  .l-flex--align-self-flex-end--xxl {
    align-self: flex-end;
  }

  .l-flex--align-self-center--xxl {
    align-self: center;
  }

  .l-flex--align-self-baseline--xxl {
    align-self: baseline;
  }

  .l-flex--align-self-stretch--xxl {
    align-self: stretch;
  }
}

/*******************************************
  Wrap row: fixed column count (CSS vars on parent)
*******************************************/
/**
 * Use on each flex child when the parent is `l-flex l-flex--direction-row l-flex--wrap`
 * with `gap` equal to `--l-flex-wrap-col-gap`.
 *
 * Set these **unitless** counts and one **length** gap on the flex parent (inline style or CSS):
 * - `--l-flex-wrap-cols-mobile`, `--l-flex-wrap-cols-tablet`, `--l-flex-wrap-cols-desktop`
 * - `--l-flex-wrap-col-gap` (e.g. `60px`)
 *
 * `flex-basis` + `max-width` match so at most N items fit per row (small assets cannot pack extra columns).
 */
.l-flex__child--wrap-fixed-columns {
  flex-grow: 0;
  flex-shrink: 0;
  min-width: 0;
  box-sizing: border-box;
  flex-basis: calc(
    (
        100% -
          (
            var(--l-flex-wrap-cols-mobile, 1) - 1
          ) *
          var(--l-flex-wrap-col-gap, 0px)
      ) / var(--l-flex-wrap-cols-mobile, 1)
  );
  max-width: calc(
    (
        100% -
          (
            var(--l-flex-wrap-cols-mobile, 1) - 1
          ) *
          var(--l-flex-wrap-col-gap, 0px)
      ) / var(--l-flex-wrap-cols-mobile, 1)
  );
}

@media (min-width: 768px) {
  .l-flex__child--wrap-fixed-columns {
    flex-basis: calc(
      (
          100% -
            (
              var(--l-flex-wrap-cols-tablet, 1) - 1
            ) *
            var(--l-flex-wrap-col-gap, 0px)
        ) / var(--l-flex-wrap-cols-tablet, 1)
    );
    max-width: calc(
      (
          100% -
            (
              var(--l-flex-wrap-cols-tablet, 1) - 1
            ) *
            var(--l-flex-wrap-col-gap, 0px)
        ) / var(--l-flex-wrap-cols-tablet, 1)
    );
  }
}

@media (min-width: 992px) {
  .l-flex__child--wrap-fixed-columns {
    flex-basis: calc(
      (
          100% -
            (
              var(--l-flex-wrap-cols-desktop, 1) - 1
            ) *
            var(--l-flex-wrap-col-gap, 0px)
        ) / var(--l-flex-wrap-cols-desktop, 1)
    );
    max-width: calc(
      (
          100% -
            (
              var(--l-flex-wrap-cols-desktop, 1) - 1
            ) *
            var(--l-flex-wrap-col-gap, 0px)
        ) / var(--l-flex-wrap-cols-desktop, 1)
    );
  }
}
.body-wrapper {}

.row-fluid {
    width: 100%;
    *zoom: 1;
}

.row-fluid:before, .row-fluid:after {
    display: table;
    content: "";
}

.row-fluid:after {
    clear: both;
}

.row-fluid [class*="span"] {
    display: block;
    float: left;
    width: 100%;
    min-height: 1px;
    margin-left: 2.127659574%;
    *margin-left: 2.0744680846382977%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}

.row-fluid [class*="span"]:first-child {
    margin-left: 0;
}

.row-fluid .span12 {
    width: 99.99999998999999%;
    *width: 99.94680850063828%;
}

.row-fluid .span11 {
    width: 91.489361693%;
    *width: 91.4361702036383%;
}

.row-fluid .span10 {
    width: 82.97872339599999%;
    *width: 82.92553190663828%;
}

.row-fluid .span9 {
    width: 74.468085099%;
    *width: 74.4148936096383%;
}

.row-fluid .span8 {
    width: 65.95744680199999%;
    *width: 65.90425531263828%;
}

.row-fluid .span7 {
    width: 57.446808505%;
    *width: 57.3936170156383%;
}

.row-fluid .span6 {
    width: 48.93617020799999%;
    *width: 48.88297871863829%;
}

.row-fluid .span5 {
    width: 40.425531911%;
    *width: 40.3723404216383%;
}

.row-fluid .span4 {
    width: 31.914893614%;
    *width: 31.8617021246383%;
}

.row-fluid .span3 {
    width: 23.404255317%;
    *width: 23.3510638276383%;
}

.row-fluid .span2 {
    width: 14.89361702%;
    *width: 14.8404255306383%;
}

.row-fluid .span1 {
    width: 6.382978723%;
    *width: 6.329787233638298%;
}

.container-fluid {
    *zoom: 1;
}

.container-fluid:before, .container-fluid:after {
    display: table;
    content: "";
}

.container-fluid:after {
    clear: both;
}

@media (max-width: 767px) {
    .row-fluid {
        width: 100%;
    }

    .row-fluid [class*="span"] {
        display: block;
        float: none;
        width: auto;
        margin-left: 0;
    }
}

@media (min-width: 768px) and (max-width: 1139px) {
    .row-fluid {
        width: 100%;
        *zoom: 1;
    }

    .row-fluid:before, .row-fluid:after {
        display: table;
        content: "";
    }

    .row-fluid:after {
        clear: both;
    }

    .row-fluid [class*="span"] {
        display: block;
        float: left;
        width: 100%;
        min-height: 1px;
        margin-left: 2.762430939%;
        *margin-left: 2.709239449638298%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        -ms-box-sizing: border-box;
        box-sizing: border-box;
    }

    .row-fluid [class*="span"]:first-child {
        margin-left: 0;
    }

    .row-fluid .span12 {
        width: 99.999999993%;
        *width: 99.9468085036383%;
    }

    .row-fluid .span11 {
        width: 91.436464082%;
        *width: 91.38327259263829%;
    }

    .row-fluid .span10 {
        width: 82.87292817100001%;
        *width: 82.8197366816383%;
    }

    .row-fluid .span9 {
        width: 74.30939226%;
        *width: 74.25620077063829%;
    }

    .row-fluid .span8 {
        width: 65.74585634900001%;
        *width: 65.6926648596383%;
    }

    .row-fluid .span7 {
        width: 57.182320438000005%;
        *width: 57.129128948638304%;
    }

    .row-fluid .span6 {
        width: 48.618784527%;
        *width: 48.5655930376383%;
    }

    .row-fluid .span5 {
        width: 40.055248616%;
        *width: 40.0020571266383%;
    }

    .row-fluid .span4 {
        width: 31.491712705%;
        *width: 31.4385212156383%;
    }

    .row-fluid .span3 {
        width: 22.928176794%;
        *width: 22.874985304638297%;
    }

    .row-fluid .span2 {
        width: 14.364640883%;
        *width: 14.311449393638298%;
    }

    .row-fluid .span1 {
        width: 5.801104972%;
        *width: 5.747913482638298%;
    }
}

@media (min-width: 1200px) {
    .row-fluid {
        width: 100%;
        *zoom: 1;
    }

    .row-fluid:before, .row-fluid:after {
        display: table;
        content: "";
    }

    .row-fluid:after {
        clear: both;
    }

    .row-fluid [class*="span"] {
        display: block;
        float: left;
        width: 100%;
        min-height: 1px;
        margin-left: 2.564102564%;
        *margin-left: 2.510911074638298%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        -ms-box-sizing: border-box;
        box-sizing: border-box;
    }

    .row-fluid [class*="span"]:first-child {
        margin-left: 0;
    }

    .row-fluid .span12 {
        width: 100%;
        *width: 99.94680851063829%;
    }

    .row-fluid .span11 {
        width: 91.45299145300001%;
        *width: 91.3997999636383%;
    }

    .row-fluid .span10 {
        width: 82.905982906%;
        *width: 82.8527914166383%;
    }

    .row-fluid .span9 {
        width: 74.358974359%;
        *width: 74.30578286963829%;
    }

    .row-fluid .span8 {
        width: 65.81196581200001%;
        *width: 65.7587743226383%;
    }

    .row-fluid .span7 {
        width: 57.264957265%;
        *width: 57.2117657756383%;
    }

    .row-fluid .span6 {
        width: 48.717948718%;
        *width: 48.6647572286383%;
    }

    .row-fluid .span5 {
        width: 40.170940171000005%;
        *width: 40.117748681638304%;
    }

    .row-fluid .span4 {
        width: 31.623931624%;
        *width: 31.5707401346383%;
    }

    .row-fluid .span3 {
        width: 23.076923077%;
        *width: 23.0237315876383%;
    }

    .row-fluid .span2 {
        width: 14.529914530000001%;
        *width: 14.4767230406383%;
    }

    .row-fluid .span1 {
        width: 5.982905983%;
        *width: 5.929714493638298%;
    }
}

/* Clearfix */

.clearfix {
    *zoom: 1;
}

.clearfix:before, .clearfix:after {
    display: table;
    content: "";
}

.clearfix:after {
    clear: both;
}

/* Visibilty Classes */

.hide {
    display: none;
}

.show {
    display: block;
}

.invisible {
    visibility: hidden;
}

.hidden {
    display: none;
    visibility: hidden;
}

/* Responsive Visibilty Classes */

.visible-phone {
    display: none !important;
}

.visible-tablet {
    display: none !important;
}

.hidden-desktop {
    display: none !important;
}

@media (max-width: 767px) {
    .visible-phone {
        display: inherit !important;
    }

    .hidden-phone {
        display: none !important;
    }

    .hidden-desktop {
        display: inherit !important;
    }

    .visible-desktop {
        display: none !important;
    }
}

@media (min-width: 768px) and (max-width: 1180px) {
    .visible-tablet {
        display: inherit !important;
    }

    .hidden-tablet {
        display: none !important;
    }

    .hidden-desktop {
        display: inherit !important;
    }

    .visible-desktop {
        display: none !important ;
    }
}


/* NEW STYLES IN NEW FORMAT */
.l-position-relative {
    position: relative;
}

.l-full-height-section {
    min-height: calc(100vh - var(--header-height-mobile));
}

@media (min-width: 768px) {
    .l-full-height-section {
        min-height: calc(100vh - var(--header-height-tablet));
    }
}

@media (min-width: 1200px) {
    .l-full-height-section {
        min-height: calc(100vh - var(--header-height-desktop));
    }
}

@media (max-width: 767px) {
  .reverse-row-order > .row-fluid {
    display: flex;
    flex-direction: row-reverse !important;
  }
  
  .stack > .row-fluid {
    align-items: flex-start !important;
    flex-direction: column !important;
    flex-wrap: wrap; 
  }

  .stack > .row-fluid [class*="span"] {
    width: 100% !important;
  }

  .stack > .row-fluid .dnd-column {
    margin: 1em 0 !important;
    width: 100% !important;
  }

  .stack > .row-fluid .dnd-column:last-child {
    margin: 0 !important;
  }

  .no-stack .row-fluid {
    display: flex !important;
    align-items: center !important;
  }

  .reverse-row-order.stack > .row-fluid .dnd-column:first-child {
    margin: 0 !important;
  }
  
  .reverse-row-order.stack > .row-fluid {
    align-items: flex-start !important;
    display: flex;
    flex-direction: column-reverse !important;
  }

}

/* Section Responsive Direction Module Styles */
/* Mobile-first breakpoints:
   - mobile-* : default, up to 767px
   - tablet-* portrait : 768px–991px
   - tablet-landscape-* : 992px–1024px
   - desktop reset : 1025px+ (normal row-fluid)
   Island adds mobile-*, tablet-*, and tablet-landscape-* below 1025px; strips them at 1025px+. */

/* --- Mobile: column / column-reverse (stack all DnD columns at 100% width) --- */
.row-fluid.c-section-responsive-direction--mobile-column,
.row-fluid.c-section-responsive-direction--mobile-column-reverse {
  align-items: flex-start;
  display: flex;
  flex-wrap: wrap;
}

.row-fluid.c-section-responsive-direction--mobile-column {
  flex-direction: column;
}

.row-fluid.c-section-responsive-direction--mobile-column-reverse {
  flex-direction: column-reverse;
}

.row-fluid.c-section-responsive-direction--mobile-column [class*="span"],
.row-fluid.c-section-responsive-direction--mobile-column-reverse [class*="span"] {
  float: none;
  margin-left: 0 !important;
  width: 100% !important;
}

.row-fluid.c-section-responsive-direction--mobile-column .dnd-column,
.row-fluid.c-section-responsive-direction--mobile-column-reverse .dnd-column {
  margin: 1em 0;
  width: 100% !important;
}

.row-fluid.c-section-responsive-direction--mobile-column .dnd-column:last-child {
  margin-bottom: 0;
}

.row-fluid.c-section-responsive-direction--mobile-column-reverse .dnd-column:first-child {
  margin-top: 0;
}

/* --- Mobile: row / row-reverse (direction only; keep span widths) --- */
.row-fluid.c-section-responsive-direction--mobile-row-reverse {
  display: flex;
  flex-direction: row-reverse;
}

.row-fluid.c-section-responsive-direction--mobile-row {
  display: flex;
  flex-direction: row;
}

/* --- Tablet portrait (768px–991px) --- */
@media (min-width: 768px) {
  /* Clear mobile flex + column-stack; tablet portrait / landscape rules apply above 768 */
  .row-fluid.c-section-responsive-direction--mobile-column,
  .row-fluid.c-section-responsive-direction--mobile-column-reverse,
  .row-fluid.c-section-responsive-direction--mobile-row,
  .row-fluid.c-section-responsive-direction--mobile-row-reverse {
    align-items: initial;
    display: block;
    flex-direction: initial;
    flex-wrap: initial;
  }

  /* Clear mobile column-stack child overrides */
  .row-fluid.c-section-responsive-direction--mobile-column [class*="span"],
  .row-fluid.c-section-responsive-direction--mobile-column-reverse [class*="span"] {
    float: unset !important;
    margin-left: unset !important;
    width: unset !important;
  }

  .row-fluid.c-section-responsive-direction--mobile-column .dnd-column,
  .row-fluid.c-section-responsive-direction--mobile-column-reverse .dnd-column {
    margin: unset !important;
    width: unset !important;
  }

  /* Tablet: column / column-reverse — stack every column at 100% */
  .row-fluid.c-section-responsive-direction--tablet-column,
  .row-fluid.c-section-responsive-direction--tablet-column-reverse {
    align-items: flex-start;
    display: flex;
    flex-wrap: wrap;
  }

  .row-fluid.c-section-responsive-direction--tablet-column {
    flex-direction: column;
  }

  .row-fluid.c-section-responsive-direction--tablet-column-reverse {
    flex-direction: column-reverse;
  }

  .row-fluid.c-section-responsive-direction--tablet-column [class*="span"],
  .row-fluid.c-section-responsive-direction--tablet-column-reverse [class*="span"] {
    float: none;
    margin-left: 0 !important;
    width: 100% !important;
  }

  .row-fluid.c-section-responsive-direction--tablet-column .dnd-column,
  .row-fluid.c-section-responsive-direction--tablet-column-reverse .dnd-column {
    margin: 1em 0;
    width: 100% !important;
  }

  .row-fluid.c-section-responsive-direction--tablet-column .dnd-column:last-child {
    margin-bottom: 0;
  }

  .row-fluid.c-section-responsive-direction--tablet-column-reverse .dnd-column:first-child {
    margin-top: 0;
  }

  /* Tablet: row / row-reverse */
  .row-fluid.c-section-responsive-direction--tablet-row-reverse {
    display: flex;
    flex-direction: row-reverse;
  }

  .row-fluid.c-section-responsive-direction--tablet-row {
    display: flex;
    flex-direction: row;
  }
}

/* --- Tablet landscape (992px–1024px) --- */
@media (min-width: 992px) {
  /* Clear tablet portrait flex + column-stack; landscape rules apply below */
  .row-fluid.c-section-responsive-direction--tablet-column,
  .row-fluid.c-section-responsive-direction--tablet-column-reverse,
  .row-fluid.c-section-responsive-direction--tablet-row,
  .row-fluid.c-section-responsive-direction--tablet-row-reverse {
    align-items: initial;
    display: block;
    flex-direction: initial;
    flex-wrap: initial;
  }

  .row-fluid.c-section-responsive-direction--tablet-column [class*="span"],
  .row-fluid.c-section-responsive-direction--tablet-column-reverse [class*="span"] {
    float: unset !important;
    margin-left: unset !important;
    width: unset !important;
  }

  .row-fluid.c-section-responsive-direction--tablet-column .dnd-column,
  .row-fluid.c-section-responsive-direction--tablet-column-reverse .dnd-column {
    margin: unset !important;
    width: unset !important;
  }

  /* Tablet landscape: column / column-reverse — stack every column at 100% */
  .row-fluid.c-section-responsive-direction--tablet-landscape-column,
  .row-fluid.c-section-responsive-direction--tablet-landscape-column-reverse {
    align-items: flex-start;
    display: flex;
    flex-wrap: wrap;
  }

  .row-fluid.c-section-responsive-direction--tablet-landscape-column {
    flex-direction: column;
  }

  .row-fluid.c-section-responsive-direction--tablet-landscape-column-reverse {
    flex-direction: column-reverse;
  }

  .row-fluid.c-section-responsive-direction--tablet-landscape-column [class*="span"],
  .row-fluid.c-section-responsive-direction--tablet-landscape-column-reverse [class*="span"] {
    float: none;
    margin-left: 0 !important;
    width: 100% !important;
  }

  .row-fluid.c-section-responsive-direction--tablet-landscape-column .dnd-column,
  .row-fluid.c-section-responsive-direction--tablet-landscape-column-reverse .dnd-column {
    margin: 1em 0;
    width: 100% !important;
  }

  .row-fluid.c-section-responsive-direction--tablet-landscape-column .dnd-column:last-child {
    margin-bottom: 0;
  }

  .row-fluid.c-section-responsive-direction--tablet-landscape-column-reverse .dnd-column:first-child {
    margin-top: 0;
  }

  /* Tablet landscape: row / row-reverse */
  .row-fluid.c-section-responsive-direction--tablet-landscape-row-reverse {
    display: flex;
    flex-direction: row-reverse;
  }

  .row-fluid.c-section-responsive-direction--tablet-landscape-row {
    display: flex;
    flex-direction: row;
  }
}

/* --- Desktop (1025px+): restore default row-fluid layout (CSS fallback if classes remain) --- */
@media (min-width: 1025px) {
  .row-fluid[class*="c-section-responsive-direction--"] {
    align-items: revert !important;
    display: revert !important;
    flex-direction: revert !important;
    flex-wrap: revert !important;
  }

  .row-fluid[class*="c-section-responsive-direction--"] [class*="span"] {
    float: revert !important;
    margin-left: revert !important;
    width: revert !important;
  }

  .row-fluid[class*="c-section-responsive-direction--"] .dnd-column {
    margin: revert !important;
    width: revert !important;
  }
}

/* Section Responsive Direction Module Styles */
.hs-web-interactives-top-banner-open #hs-web-interactives-top-push-anchor {
  margin-bottom: -5px;
}

/*  Tools
    Any animations, or functions used throughout the theme
    Note: _macros.hubl.css needs to be imported into each stylesheet where macros are used and not included here
    Note: _variables.hubl.css can be ignored, it's already included at the top of this file
*/
/**
 * Accessibility Helper Classes
 * 
 * Reusable accessibility utility classes for use across the theme.
 * These classes follow the h- (helper) namespace convention.
 */

/* Visually hidden helper class for screen reader only text */
/* Hides content visually but keeps it accessible to screen readers */
.h-visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
/* 
  Animation Styles 
*/
.reveal {
  opacity: 0;
}

.reveal {
  animation-fill-mode: forwards !important;
  opacity: 0;
  visibility: hidden;
  -webkit-animation-fill-mode: forwards !important;
}

:-webkit-full-screen-ancestor .reveal {
  animation-fill-mode: none !important;
}

.fade-in {
  animation: 1s ease fadeIn;
}

.fade-up {
  animation: 1s ease fadeUp;
}

.fade-down {
  animation: 1s ease fadeDown;
}

.fade-right {
  animation: 1s ease fadeRight;
}

.fade-left {
  animation: 1s ease fadeLeft;
}

.expand-left {
  animation: 1s ease expandLeft;
}

.expand-right {
  animation: 1s ease expandRight;
}

.bubble-up {
  animation: 1s ease bubbleUp;
}

.bubble-down {
  animation: 1s ease bubbleDown;
}

.bubble-left {
  animation: 1s ease bubbleLeft;
}

.bubble-right {
  animation: 1s ease bubbleRight;
}

.zoom-in {
  animation: 1s ease zoomIn;
}

.zoom-out {
  animation: 1s ease zoomOut;
}

/* 
  Keyframes 
*/

/* Fade In */
@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* Fade Up */
@-webkit-keyframes fadeUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(50px);
    transform: translateY(50px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}
@keyframes fadeUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(50px);
    transform: translateY(50px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

/* Fade Down */
@-webkit-keyframes fadeDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-50px);
    transform: translateY(-50px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}
@keyframes fadeDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-50px);
    transform: translateY(-50px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

/* Fade Right */
@-webkit-keyframes fadeRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-50px);
    transform: translateX(-50px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}
@keyframes fadeRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-50px);
    transform: translateX(-50px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

/* Fade Left */
@-webkit-keyframes fadeLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(50px);
    transform: translateX(50px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}
@keyframes fadeLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(50px);
    transform: translateX(50px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

/* Expand Left */
@-webkit-keyframes expandLeft {
  0% {
    opacity: 0;
    -webkit-transform: scale(.2,1);
    transform: scale(.2,1);
    -webkit-transform-origin: right;
    transform-origin: right;
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(1,1);
    transform: scale(1,1);
    -webkit-transform-origin: right;
    transform-origin: right;
  }
}
@keyframes expandLeft {
  0% {
    opacity: 0;
    -webkit-transform: scale(.2,1);
    transform: scale(.2,1);
    -webkit-transform-origin: right;
    transform-origin: right;
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(1,1);
    transform: scale(1,1);
    -webkit-transform-origin: right;
    transform-origin: right;
  }
}

/* Expand Right */
@-webkit-keyframes expandRight {
  0% {
    opacity: 0;
    -webkit-transform: scale(.2,1);
    transform: scale(.2,1);
    -webkit-transform-origin: left;
    transform-origin: left;
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(1,1);
    transform: scale(1,1);
    -webkit-transform-origin: left;
    transform-origin: left;
  }
}
@keyframes expandRight {
  0% {
    opacity: 0;
    -webkit-transform: scale(.2,1);
    transform: scale(.2,1);
    -webkit-transform-origin: left;
    transform-origin: left;
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(1,1);
    transform: scale(1,1);
    -webkit-transform-origin: left;
    transform-origin: left;
  }
}

/* Bubble Up */
@-webkit-keyframes bubbleUp {
  0% {
    opacity: 0;
    -webkit-transform: scale(.2, .2) translateY(10px);
    transform: scale(.2, .2) translateY(10px);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
  }
  60% {
    -webkit-transform: scale(1.2, 1.2) translateY(-5px);
    transform: scale(1.2, 1.2) translateY(-5px);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(1,1) translateY(0);
    transform: scale(1,1) translateY(0);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
  }
}
@keyframes bubbleUp {
  0% {
    opacity: 0;
    -webkit-transform: scale(.2, .2) translateY(10px);
    transform: scale(.2, .2) translateY(10px);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
  }
  60% {
    -webkit-transform: scale(1.2, 1.2) translateY(-5px);
    transform: scale(1.2, 1.2) translateY(-5px);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(1,1) translateY(0);
    transform: scale(1,1) translateY(0);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
  }
}

/* Bubble Down */
@-webkit-keyframes bubbleDown {
  0% {
    opacity: 0;
    -webkit-transform: scale(.2, .2) translateY(-10px);
    transform: scale(.2, .2) translateY(-10px);
    -webkit-transform-origin: center top;
    transform-origin: center top;
  }
  60% {
    -webkit-transform: scale(1.2, 1.2) translateY(5px);
    transform: scale(1.2, 1.2) translateY(5px);
    -webkit-transform-origin: center top;
    transform-origin: center top;
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(1,1) translateY(0);
    transform: scale(1,1) translateY(0);
    -webkit-transform-origin: center top;
    transform-origin: center top;
  }
}
@keyframes bubbleDown {
  0% {
    opacity: 0;
    -webkit-transform: scale(.2, .2) translateY(-10px);
    transform: scale(.2, .2) translateY(-10px);
    -webkit-transform-origin: center top;
    transform-origin: center top;
  }
  60% {
    -webkit-transform: scale(1.2, 1.2) translateY(5px);
    transform: scale(1.2, 1.2) translateY(5px);
    -webkit-transform-origin: center top;
    transform-origin: center top;
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(1,1) translateY(0);
    transform: scale(1,1) translateY(0);
    -webkit-transform-origin: center top;
    transform-origin: center top;
  }
}

/* Bubble Left */
@-webkit-keyframes bubbleLeft {
  0% {
    opacity: 0;
    -webkit-transform: scale(.2, .2) translateX(10px);
    transform: scale(.2, .2) translateX(10px);
    -webkit-transform-origin: right center;
    transform-origin: right center;
  }
  60% {
    -webkit-transform: scale(1.2, 1.2) translateX(-5px);
    transform: scale(1.2, 1.2) translateX(-5px);
    -webkit-transform-origin: right center;
    transform-origin: right center;
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(1,1) translateY(0);
    transform: scale(1,1) translateY(0);
    -webkit-transform-origin: right center;
    transform-origin: right center;
  }
}
@keyframes bubbleLeft {
  0% {
    opacity: 0;
    -webkit-transform: scale(.2, .2) translateX(10px);
    transform: scale(.2, .2) translateX(10px);
    -webkit-transform-origin: right center;
    transform-origin: right center;
  }
  60% {
    -webkit-transform: scale(1.2, 1.2) translateX(-5px);
    transform: scale(1.2, 1.2) translateX(-5px);
    -webkit-transform-origin: right center;
    transform-origin: right center;
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(1,1) translateY(0);
    transform: scale(1,1) translateY(0);
    -webkit-transform-origin: right center;
    transform-origin: right center;
  }
}

/* Bubble Right */
@-webkit-keyframes bubbleRight {
  0% {
    opacity: 0;
    -webkit-transform: scale(.2, .2) translateX(-10px);
    transform: scale(.2, .2) translateX(-10px);
    -webkit-transform-origin: left center;
    transform-origin: left center;
  }
  60% {
    -webkit-transform: scale(1.2, 1.2) translateX(5px);
    transform: scale(1.2, 1.2) translateX(5px);
    -webkit-transform-origin: left center;
    transform-origin: left center;
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(1,1) translateY(0);
    transform: scale(1,1) translateY(0);
    -webkit-transform-origin: left center;
    transform-origin: left center;
  }
}
@keyframes bubbleRight {
  0% {
    opacity: 0;
    -webkit-transform: scale(.2, .2) translateX(-10px);
    transform: scale(.2, .2) translateX(-10px);
    -webkit-transform-origin: left center;
    transform-origin: left center;
  }
  60% {
    -webkit-transform: scale(1.2, 1.2) translateX(5px);
    transform: scale(1.2, 1.2) translateX(5px);
    -webkit-transform-origin: left center;
    transform-origin: left center;
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(1,1) translateY(0);
    transform: scale(1,1) translateY(0);
    -webkit-transform-origin: left center;
    transform-origin: left center;
  }
}

/* Zoom In */
@-webkit-keyframes zoomIn {
  0% {
    opacity: 0;
    -webkit-transform: scale(.5,.5);
    transform: scale(.5,.5);
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(1,1);
    transform: scale(1,1);
  }
}
@keyframes zoomIn {
  0% {
    opacity: 0;
    -webkit-transform: scale(.5,.5);
    transform: scale(.5,.5);
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(1,1);
    transform: scale(1,1);
  }
}

/* Zoom Out */
@-webkit-keyframes zoomOut {
  0% {
    opacity: 0;
    -webkit-transform: scale(1,1);
    transform: scale(1,1);
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(.5,.5);
    transform: scale(.5,.5);
  }
}
@keyframes zoomOut {
  0% {
    opacity: 0;
    -webkit-transform: scale(1,1);
    transform: scale(1,1);
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(.5,.5);
    transform: scale(.5,.5);
  }
}
.s-text-align--left {
  text-align: left;
}

.s-text-align--center {
  text-align: center;
}

.s-text-align--right {
  text-align: right;
}

.s-padding--bottom-0 {
  padding-bottom: 0;
}

.s-padding--top-0 {
  padding-top: 0;
}

.dnd-section:has(.s-remove-section-padding--top-bottom) {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}