:root {
  /* 1.1 COLOR CONTENT */
  --c-color-content-primary: var(--dxp-g-root-contrast, #020F22);
  --c-color-content-primary-inverse: var(--dxp-g-brand-contrast, #FFFFFF);
  --c-color-content-secondary: #353F4E;
  --c-color-content-disabled: #4E5764;
  /* 1.2 COLOR SURFACE */
  --c-color-surface-light: #F3F3F4;
  --c-color-surface-base: #E8EDF4;
  --c-color-surface-mid: #DBE2E9;
  --c-color-surface-dim: #CBD5DF;
  --c-color-surface-accentPrimary: var(--dxp-g-brand, #A850F4);
  --c-color-surface-accentSecondary: #FBDB65;
  --c-color-surface-accentTertiary: #84329B;
  --c-color-surface-light-transparent: rgba(243, 243, 244, 0);
  --c-color-surface-base-transparent: rgba(232, 237, 244, 0);
  --c-color-surface-mid-transparent: rgba(219, 226, 233, 0);
  --c-color-surface-dim-transparent: rgba(203, 213, 223, 0);
  /* 1.3 COLOR SURFACE HOVER */
  --c-color-surface-hover-light: #E6E7E9;
  --c-color-surface-hover-base: #DBE2E9;
  --c-color-surface-hover-mid: #CBD5DF;
  --c-color-surface-hover-dim: #BBC7D6;
  --c-color-surface-hover-accentPrimary: #9D26D9;
  --c-color-surface-hover-accentSecondary: #FAD138;
  --c-color-surface-hover-accentTertiary: #632574;
  /** 1.4 COLOR BORDER */
  --c-color-border-light: #FFFFFF;
  --c-color-border-base: #BBC7D6;
  --c-color-border-mid: #7D9CC0;
  --c-color-border-dim: #020F22;
  --c-color-border-inverse: #676F7A;
  --c-color-border-accentPrimary: var(--dxp-g-brand, #A850F4);
  --c-color-border-accentSecondary: #FBDB65;
  --c-color-border-accentTertiary: #84329B;
  /** 1.5 COLOR BOX SHADOW */
  --c-color-box-shadow-shade: rgba(2, 15, 34, 0.15);
  --c-color-box-shadow-base: rgba(2, 15, 34, 0.05);
  /* 1.6 COLOR ACTION PRIMARY - FILLED INTERACTION */
  --c-color-action-primary-surface-base: var(--dxp-s-button-color, #020F22);
  --c-color-action-primary-surface-hover: var(--dxp-s-button-color-hover, #4E5764);
  --c-color-action-primary-surface-active: var(--dxp-s-button-color-active, #353F4E);
  --c-color-action-primary-surface-focus: var(--dxp-s-button-color-hover, #4E5764);
  --c-color-action-primary-surface-disabled: #B3B7BD;
  --c-color-action-primary-surface-visited: #632574;
  --c-color-action-primary-content-base: var(--dxp-s-button-color-contrast, #FFFFFF);
  --c-color-action-primary-content-hover: var(--dxp-s-button-color-contrast, #FFFFFF);
  --c-color-action-primary-content-active: var(--dxp-s-button-color-contrast, #FFFFFF);
  --c-color-action-primary-content-focus: var(--dxp-s-button-color-contrast, #FFFFFF);
  --c-color-action-primary-content-disabled: #4E5764;
  --c-color-action-primary-content-visited: #FFFFFF;
  --c-color-action-primary-border-base: var(--dxp-s-button-border-color, #020F22);
  --c-color-action-primary-border-hover: var(--dxp-s-button-border-color-hover, #4E5764);
  --c-color-action-primary-border-active: var(--dxp-s-button-border-color-active, #353F4E);
  --c-color-action-primary-border-focus: var(--dxp-s-button-border-color-hover, #4E5764);
  --c-color-action-primary-border-disabled: #B3B7BD;
  --c-color-action-primary-border-visited: #632574;
  /* 1.7 COLOR ACTION SECONDARY - OUTLINE INTERACTION */
  --c-color-action-secondary-surface-base: var(--dxp-s-secondary-button-color, rgba(255, 255, 255, 0));
  --c-color-action-secondary-surface-hover: var(--dxp-s-secondary-button-color-hover, rgba(255, 255, 255, 0));
  --c-color-action-secondary-surface-active: var(--dxp-s-secondary-button-color-focus, rgba(255, 255, 255, 0));
  --c-color-action-secondary-surface-focus: var(--dxp-s-secondary-button-color-focus, rgba(255, 255, 255, 0));
  --c-color-action-secondary-surface-disabled: rgba(255, 255, 255, 0);
  --c-color-action-secondary-surface-visited: rgba(255, 255, 255, 0);
  --c-color-action-secondary-content-base: var(--dxp-s-secondary-button-text-color, #020F22);
  --c-color-action-secondary-content-hover: var(--dxp-s-secondary-button-text-color-hover, #4E5764);
  --c-color-action-secondary-content-active: #353F4E;
  --c-color-action-secondary-content-focus: var(--dxp-s-secondary-button-text-color-hover, #4E5764);
  --c-color-action-secondary-content-disabled: #808790;
  --c-color-action-secondary-content-visited: #632574;
  --c-color-action-secondary-border-base: var(--dxp-s-secondary-button-border-color, #020F22);
  --c-color-action-secondary-border-hover: var(--dxp-s-secondary-button-border-color-hover, #4E5764);
  --c-color-action-secondary-border-active: #353F4E;
  --c-color-action-secondary-border-focus: var(--dxp-s-secondary-button-border-color-focus, #4E5764);
  --c-color-action-secondary-border-disabled: #B3B7BD;
  --c-color-action-secondary-border-visited: #632574;
  --c-color-action-secondary-border-focus-ring: #7D9CC0;
  /* 1.8 COLOR ACTION TERTIARY - ACCORDIONS & TABS INTERACTION */
  --c-color-action-tertiary-surface-base: var(--dxp-s-tertiary-button-color, rgba(255, 255, 255, 0));
  --c-color-action-tertiary-surface-hover: var(--dxp-s-tertiary-button-color-hover, rgba(255, 255, 255, 0));
  --c-color-action-tertiary-surface-active: var(--dxp-s-tertiary-button-color-focus, rgba(255, 255, 255, 0));
  --c-color-action-tertiary-surface-focus: var(--dxp-s-tertiary-button-color-focus, rgba(255, 255, 255, 0));
  --c-color-action-tertiary-surface-disabled: rgba(255, 255, 255, 0);
  --c-color-action-tertiary-surface-visited: rgba(255, 255, 255, 0);
  --c-color-action-tertiary-content-base: var(--dxp-s-tertiary-button-text-color, #020F22);
  --c-color-action-tertiary-content-hover: var(--dxp-s-tertiary-button-text-color-hover, #9D26D9);
  --c-color-action-tertiary-content-active: #9D26D9;
  --c-color-action-tertiary-content-focus: var(--dxp-s-tertiary-button-text-color, #020F22);
  --c-color-action-tertiary-content-disabled: #808790;
  --c-color-action-tertiary-content-visited: #632574;
  --c-color-action-tertiary-border-base: var(--dxp-s-tertiary-button-border-color, #020F22);
  --c-color-action-tertiary-border-hover: var(--dxp-s-tertiary-button-border-color-hover, #9D26D9);
  --c-color-action-tertiary-border-active: #9D26D9;
  --c-color-action-tertiary-border-focus: var(--dxp-s-tertiary-button-border-color-focus, #020F22);
  --c-color-action-tertiary-border-disabled: #808790;
  --c-color-action-tertiary-border-visited: #632574;
  --c-color-action-tertiary-border-focus-ring: #7D9CC0;
  /* 1.9 FORM COLORS */
  --c-color-form-surface-base: var(--dxp-s-form-element-color-background, #FFFFFF);
  --c-color-form-surface-disabled: #CCCFD3;
  --c-color-form-surface-accent: var(--dxp-g-brand, #A850F4);
  --c-color-form-content-label: var(--dxp-s-form-element-label-color, #020F22);
  --c-color-form-content-placeholder: var(--dxp-s-form-element-placeholder-text-color, #4E5764);
  --c-color-form-content-filled: var(--dxp-s-form-element-text-color, #020F22);
  --c-color-form-content-disabled: #808790;
  --c-color-form-helper-error: #BB2A0E;
  --c-color-form-helper-warning: #9B5A00;
  --c-color-form-helper-success: #007B00;
  --c-color-form-helper-highlight: #9724D1;
  --c-color-form-helper-neutral: #405671;
  --c-color-form-helper-neutral-opaque: rgba(94, 121, 152, 0.2);
  --c-color-form-border-default: var(--dxp-s-form-element-color-border, #BBC7D6);
  --c-color-form-border-error: #BD2C0F;
  --c-color-form-border-warning: #F89407;
  --c-color-form-border-success: #339933;
  --c-color-form-border-highlight: #9724D1;
  --c-color-form-border-neutral: #405671;
  --c-color-form-border-neutral-opaque: rgba(94, 121, 152, 0.2);
  --c-color-form-border-focus-ring: var(--dxp-s-form-element-color-border-focus, #7D9CC0);
  --c-color-form-border-active: #676F7A;
  --c-color-form-border-accent: var(--dxp-g-brand, #A850F4);
  /* 1.10 GRADIENTS COLORS */
  --c-color-gradient-light-base: linear-gradient(-90deg, #F3F3F4 0%, #E8EDF4 100%);
  --c-color-gradient-light-mid: linear-gradient(-90deg, #F3F3F4 0%, #DBE2E9 100%);
  --c-color-gradient-light-dim: linear-gradient(-90deg, #F3F3F4 0%, #CBD5DF 100%);
  --c-color-gradient-base-mid: linear-gradient(-90deg, #E8EDF4 0%, #DBE2E9 100%);
  --c-color-gradient-base-dim: linear-gradient(-90deg, #E8EDF4 0%, #CBD5DF 100%);
  --c-color-gradient-mid-dim: linear-gradient(-90deg, #DBE2E9 0%, #CBD5DF 100%);
  --c-color-gradient-light-base-vertical: linear-gradient(180deg, #F3F3F4 0%, #E8EDF4 100%);
  --c-color-gradient-light-mid-vertical: linear-gradient(180deg, #F3F3F4 0%, #DBE2E9 100%);
  --c-color-gradient-light-dim-vertical: linear-gradient(180deg, #F3F3F4 0%, #CBD5DF 100%);
  --c-color-gradient-base-mid-vertical: linear-gradient(180deg, #E8EDF4 0%, #DBE2E9 100%);
  --c-color-gradient-base-dim-vertical: linear-gradient(180deg, #E8EDF4 0%, #CBD5DF 100%);
  --c-color-gradient-mid-dim-vertical: linear-gradient(180deg, #DBE2E9 0%, #CBD5DF 100%);
  --c-color-gradient-base-dim-diagonal: linear-gradient(214.1deg, #E8EDF4 18.31%, #CBD5DF 87.21%);
  --c-color-gradient-inverse-diagonal: linear-gradient(214.1deg, #1B2738 18.31%, #010813 87.21%);
  --c-color-gradient-light-transparent: linear-gradient(180deg, rgba(243, 243, 244, 0) 0%, #F3F3F4 100%);
  --c-color-gradient-base-transparent: linear-gradient(180deg, rgba(232, 237, 244, 0) 0%, #E8EDF4 100%);
  --c-color-gradient-mid-transparent: linear-gradient(180deg, rgba(219, 226, 233, 0) 0%, #DBE2E9 100%);
  --c-color-gradient-dim-transparent: linear-gradient(180deg, rgba(203, 213, 223, 0) 0%, #CBD5DF 100%);
  /* 1.11 TABLE COLORS */
  --c-color-table-border-shade-1: rgba(2, 15, 34, 0.1);
  --c-color-table-border-shade-2: rgba(2, 15, 34, 0.15);
  --c-color-table-border-shade-3: rgba(2, 15, 34, 0.2);
  --c-color-table-surface-odd-row: rgba(2, 15, 34, 0.05);
  /* 1.12 FORM HELPER COLORS */
  --c-color-form-helper-warning: #9B5A00;
  --c-color-form-helper-error: #BB2A0E;
  --c-color-form-helper-success: #007B00;
  --c-color-form-helper-accent: #A850F4;
  /* 1.13 STATUS COLORS */
  --c-color-status-surface-neutral: #405671;
  /* 1.14 BACKDROP COLORS */
  --c-color-backdrop-modal: rgba(2, 15, 34, 0.6);
  --c-color-backdrop-section: rgba(232, 237, 244, 0.72);
  /* 2. TYPOGRAPHY */
  --c-font-base-size: var(--dxp-, 16px);
  /** 2.1 FONT FAMILY **/
  --c-font-fontFamily-primary: At Hauss;
  --c-font-fontFamily-mono: At Hauss Mono;
  /** 2.2 FONT WEIGHT **/
  --c-font-fontWeight-light: 300;
  --c-font-fontWeight-book: 350;
  --c-font-fontWeight-retina: 400;
  --c-font-fontWeight-medium: 500;
  /** 2.3 LINE HEIGHT **/
  --c-font-lineHeight-95: 95%;
  --c-font-lineHeight-100: 100%;
  --c-font-lineHeight-110: 110%;
  --c-font-lineHeight-120: 120%;
  --c-font-lineHeight-125: 125%;
  --c-font-lineHeight-130: 130%;
  --c-font-lineHeight-135: 135%;
  --c-font-lineHeight-145: 145%;
  /** 2.4 FONT SIZE **/
  --c-font-fontSize-14: 0.875rem;
  --c-font-fontSize-16: 1rem;
  --c-font-fontSize-18: 1.125rem;
  --c-font-fontSize-19: 1.1875rem;
  --c-font-fontSize-20: 1.25rem;
  --c-font-fontSize-22: 1.375rem;
  --c-font-fontSize-24: 1.5rem;
  --c-font-fontSize-26: 1.625rem;
  --c-font-fontSize-28: 1.75rem;
  --c-font-fontSize-30: 1.875rem;
  --c-font-fontSize-32: 2rem;
  --c-font-fontSize-34: 2.125rem;
  --c-font-fontSize-36: 2.25rem;
  --c-font-fontSize-38: 2.375rem;
  --c-font-fontSize-42: 2.625rem;
  --c-font-fontSize-48: 3rem;
  --c-font-fontSize-54: 3.375rem;
  --c-font-fontSize-58: 3.625rem;
  --c-font-fontSize-64: 4rem;
  --c-font-fontSize-68: 4.25rem;
  /** 2.5 LETTER SPACING **/
  --c-font-letterSpacing-neg2: -0.02em;
  --c-font-letterSpacing-0: 0;
  --c-font-letterSpacing-5: 0.05em;
  /** 2.6 PARAGRAPH SPACING **/
  --c-font-paragraphSpacing-0: 0;
  --c-font-paragraphSpacing-14: 14px;
  --c-font-paragraphSpacing-16: 16px;
  --c-font-paragraphSpacing-18: 18px;
  --c-font-paragraphSpacing-19: 19px;
  --c-font-paragraphSpacing-20: 20px;
  --c-font-paragraphSpacing-22: 22px;
  --c-font-paragraphSpacing-24: 24px;
  --c-font-paragraphSpacing-26: 26px;
  --c-font-paragraphSpacing-34: 34px;
  /** 2.7 TEXT CASE **/
  --c-font-textCase-none: none;
  --c-font-textCase-uppercase: uppercase;
  --c-font-textCase-lowercase: lowercase;
  --c-font-textCase-capitalize: capitalize;
  /** 2.8 TEXT DECORATION **/
  --c-font-textDecoration-none: none;
  --c-font-textDecoration-underline: underline;
  --c-font-textDecoration-line-through: line-through;
  /* 3. BORDERS */
  /** 3.1 BORDER RADIUS */
  --c-border-radius-none: 0px;
  --c-border-radius-xsm: 1px;
  --c-border-radius-sm: 2px;
  --c-border-radius-md: 4px;
  --c-border-radius-lg: 8px;
  --c-border-radius-full: 9999999px;
  /** 3.2 BORDER WIDTH */
  --c-border-width-31: 0.5px;
  --c-border-width-63: 1px;
  --c-border-width-94: 1.5px;
  --c-border-width-125: 2px;
  --c-border-width-188: 3px;
  --c-border-width-250: 4px;
  --c-border-width-313: 5px;
  --c-border-width-375: 6px;
  --c-border-width-500: 8px;
  /* 5. Size Scale*/
  --c-sizeScale-0: 0px;
  --c-sizeScale-31: 0.5px;
  --c-sizeScale-63: 1px;
  --c-sizeScale-94: 1.5px;
  --c-sizeScale-125: 2px;
  --c-sizeScale-188: 3px;
  --c-sizeScale-250: 4px;
  --c-sizeScale-375: 6px;
  --c-sizeScale-500: 8px;
  --c-sizeScale-625: 10px;
  --c-sizeScale-750: 12px;
  --c-sizeScale-875: 14px;
  --c-sizeScale-1000: 16px;
  --c-sizeScale-1250: 20px;
  --c-sizeScale-1500: 24px;
  --c-sizeScale-2000: 32px;
  --c-sizeScale-2500: 40px;
  --c-sizeScale-3000: 48px;
  --c-sizeScale-3500: 56px;
  --c-sizeScale-4000: 64px;
  --c-sizeScale-4500: 72px;
  --c-sizeScale-5000: 80px;
  --c-sizeScale-6000: 96px;
  --c-sizeScale-7000: 112px;
  --c-sizeScale-8000: 128px;
  --c-sizeScale-9000: 144px;
  --c-sizeScale-10000: 160px;
  --c-sizeScale-11000: 176px;
  --c-sizeScale-12000: 192px;
  --c-sizeScale-13000: 208px;
  --c-sizeScale-14000: 224px;
  --c-sizeScale-15000: 240px;
  --c-sizeScale-16000: 256px;
  --c-sizeScale-18000: 288px;
  --c-sizeScale-20000: 320px;
  --c-sizeScale-24000: 384px;
  /* 5.1 Icon Sizes */
  --c-icon-xsm: 14px;
  --c-icon-sm: 16px;
  --c-icon-md: 20px;
  --c-icon-lg: 24px;
  --c-icon-xlg: 32px;
  --c-icon-xxlg: 48px;
  /* 5.2 Logo Sizes */
  --c-logo-sm: 32px;
  --c-logo-md: 48px;
  --c-logo-lg: 64px;
  /* 5.10 Component Sizes */
  --c-dialog-width-sm: 400px;
  --c-dialog-width-md: 560px;
  --c-dialog-width-lg: 800px;
  --c-dialog-max-viewport-width: 90vw;
  --c-dialog-margin-tablet: 72px;
  --c-dialog-margin-mobile: 24px;
  /* 5.3 Space Scale */
  --c-spaceScale-0: 0px;
  --c-spaceScale-63: 1px;
  --c-spaceScale-125: 2px;
  --c-spaceScale-250: 4px;
  --c-spaceScale-375: 6px;
  --c-spaceScale-500: 8px;
  --c-spaceScale-625: 10px;
  --c-spaceScale-750: 12px;
  --c-spaceScale-875: 14px;
  --c-spaceScale-1000: 16px;
  --c-spaceScale-1250: 20px;
  --c-spaceScale-1500: 24px;
  --c-spaceScale-1750: 28px;
  --c-spaceScale-2000: 32px;
  --c-spaceScale-2250: 36px;
  --c-spaceScale-2500: 40px;
  --c-spaceScale-2750: 44px;
  --c-spaceScale-3000: 48px;
  --c-spaceScale-3500: 56px;
  --c-spaceScale-4000: 64px;
  --c-spaceScale-4500: 72px;
  --c-spaceScale-5000: 80px;
  --c-spaceScale-6000: 96px;
  --c-spaceScale-7000: 112px;
  --c-spaceScale-8000: 128px;
  --c-spaceScale-9000: 144px;
  --c-spaceScale-10000: 160px;
  --c-spaceScale-11000: 176px;
  --c-spaceScale-12000: 192px;
  --c-spaceScale-13000: 208px;
  --c-spaceScale-14000: 224px;
  --c-spaceScale-15000: 240px;
  --c-spaceScale-16000: 256px;
  --c-spaceScale-18000: 288px;
  --c-spaceScale-20000: 320px;
  --c-spaceScale-24000: 384px;
  /* 5.4 Layout */
  --c-layout-0: 0px;
  --c-layout-8: 8px;
  --c-layout-16: 16px;
  --c-layout-24: 24px;
  --c-layout-32: 32px;
  --c-layout-40: 40px;
  --c-layout-48: 48px;
  --c-layout-56: 56px;
  --c-layout-64: 64px;
  --c-layout-80: 80px;
  --c-layout-96: 96px;
  --c-layout-112: 112px;
  --c-layout-128: 128px;
  /* 5.5 Gutter */
  --c-gutter-mobile: 16px;
  --c-gutter-tablet: 24px;
  --c-gutter-desktop: 32px;
  /* 5.6 Component Spacing */
  --c-space-stack-sm: var(--dxp-s-section-content-spacing-block-end, 24px);
  --c-space-stack-md: 32px;
  --c-space-stack-lg: 32px;
  /* 5.7 Device Margins */
  --c-margin-mobile: 8px;
  --c-margin-tablet: 24px;
  --c-margin-desktop: 64px;
  /* 5.8 Resposive Layouts - Page Vertical */
  --c-page-vertical-sm-mobile: 16px;
  --c-page-vertical-sm-tablet: 16px;
  --c-page-vertical-sm-desktop: 8px;
  --c-page-vertical-md-mobile: 32px;
  --c-page-vertical-md-tablet: 32px;
  --c-page-vertical-md-desktop: 24px;
  --c-page-vertical-lg-mobile: 32px;
  --c-page-vertical-lg-tablet: 48px;
  --c-page-vertical-lg-desktop: 64px;
  --c-page-vertical-xl-mobile: 64px;
  --c-page-vertical-xl-tablet: 80px;
  --c-page-vertical-xl-desktop: 128px;
  /* 5.9 Resposive Layouts - Space Padding */
  --c-padding-sm-mobile: 16px;
  --c-padding-sm-tablet: 16px;
  --c-padding-sm-desktop: 24px;
  --c-padding-md-mobile: 24px;
  --c-padding-md-tablet: 24px;
  --c-padding-md-desktop: 32px;
  --c-padding-lg-mobile: 32px;
  --c-padding-lg-tablet: 32px;
  --c-padding-lg-desktop: 48px;
  --c-padding-xl-mobile: 32px;
  --c-padding-xl-tablet: 48px;
  --c-padding-xl-desktop: 64px;
  /* 6.1 Grid Desktop */
  --c-grid-desktop-gutter: 32px;
  --c-grid-desktop-margin: 64px;
  --c-grid-desktop-page-margin: 64px;
  --c-grid-desktop-page: 1440px;
  --c-grid-desktop-extended: 1312px;
  --c-grid-desktop-content: 1184px;
  --c-col-desktop-1: 69.3333333333px;
  --c-col-desktop-2: 170.6666666667px;
  --c-col-desktop-3: 272px;
  --c-col-desktop-4: 373.3333333333px;
  --c-col-desktop-5: 474.6666666667px;
  --c-col-desktop-6: 576px;
  --c-col-desktop-7: 677.3333333333px;
  --c-col-desktop-8: 778.6666666667px;
  --c-col-desktop-9: 880px;
  --c-col-desktop-10: 981.3333333333px;
  --c-col-desktop-11: 1082.6666666667px;
  --c-col-desktop-12: 1184px;
  --c-col-desktop-1-gutter: 101.3333333333px;
  --c-grid-5-in-row: 211.2px;
  --c-grid-desktop-half-content: 592px;
  /* 6.2 Grid Tablet */
  --c-grid-tablet-gutter: 24px;
  --c-grid-tablet-margin: 48px;
  --c-grid-tablet-page-margin: 24px;
  --c-grid-tablet-page: 834px;
  --c-grid-tablet-extended: 786px;
  --c-grid-tablet-content: 690px;
  --c-tablet-col-1: 55.3333333333px;
  --c-tablet-col-2: 134.6666666667px;
  --c-tablet-col-3: 214px;
  --c-tablet-col-4: 293.3333333333px;
  --c-tablet-col-5: 372.6666666667px;
  --c-tablet-col-6: 452px;
  --c-tablet-col-7: 531.3333333333px;
  --c-tablet-col-8: 610.6666666667px;
  --c-tablet-col-9: 690px;
  --c-col-tablet-1-gutter: 79.3333333333px;
  /* 6.3 Grid Mobile */
  --c-grid-mobile-gutter: 16px;
  --c-grid-mobile-margin: 16px;
  --c-grid-mobile-page-margin: 8px;
  --c-grid-mobile-page: 430px;
  --c-grid-mobile-extended: 414px;
  --c-grid-mobile-content: 382px;
  --c-mobile-col-1: 50.3333333333px;
  --c-mobile-col-2: 116.6666666667px;
  --c-mobile-col-3: 183px;
  --c-mobile-col-4: 249.3333333333px;
  --c-mobile-col-5: 315.6666666667px;
  --c-mobile-col-6: 382px;
  /* 6.4 Grid Tokens */
  --c-grid-columns: 6;
  --c-grid-gutter: var(--c-grid-mobile-gutter);
  --c-grid-margin: var(--c-grid-mobile-margin);
  --c-grid-page-margin: var(--c-grid-mobile-page-margin);
}
@media (min-width: 431px) {
  :root {
    --c-grid-columns: 9;
    --c-grid-gutter: var(--c-grid-tablet-gutter);
    --c-grid-margin: var(--c-grid-tablet-margin);
    --c-grid-page-margin: var(--c-grid-tablet-page-margin);
  }
}
@media (min-width: 835px) {
  :root {
    --c-grid-columns: 12;
    --c-grid-gutter: var(--c-grid-desktop-gutter);
    --c-grid-margin: var(--c-grid-desktop-margin);
    --c-grid-page-margin: var(--c-grid-desktop-page-margin);
  }
}
:root {
  /* 7. BOX SHADOW SIZE */
  --c-size-box-shadow-base: 1px;
  --c-size-box-shadow-2xs: 2px;
  --c-size-box-shadow-xs: 4px;
  --c-size-box-shadow-sm: 8px;
  --c-size-box-shadow-md: 16px;
  --c-size-box-shadow-lg: 24px;
  --c-size-box-shadow-2xl: 32px;
  --c-size-box-shadow-3xl: 40px;
  --c-size-box-shadow-4xl: 56px;
  /* 8. MOTION */
  /* 8.1 Easing */
  --c-motion-easing-emphasized-default: cubic-bezier(0.2, 0, 0, 1);
  --c-motion-easing-emphasized-accelerate: cubic-bezier(0.3, 0, 0.8, 0.15);
  --c-motion-easing-emphasized-decelerate: cubic-bezier(0.05, 0.7, 0.1, 1);
  --c-motion-easing-standard-default: cubic-bezier(0.2, 0, 0, 1);
  --c-motion-easing-standard-accelerate: cubic-bezier(0.3, 0, 1, 1);
  --c-motion-easing-standard-decelerate: cubic-bezier(0, 0, 0, 1);
  --c-motion-easing-linear-default: cubic-bezier(0, 0, 1, 1);
  /* 8.2 duration */
  --c-motion-duration-instant: 0ms;
  --c-motion-duration-short1: 50ms;
  --c-motion-duration-short2: 100ms;
  --c-motion-duration-short3: 150ms;
  --c-motion-duration-short4: 200ms;
  --c-motion-duration-medium1: 250ms;
  --c-motion-duration-medium2: 300ms;
  --c-motion-duration-medium3: 350ms;
  --c-motion-duration-medium4: 400ms;
  --c-motion-duration-long1: 450ms;
  --c-motion-duration-long2: 500ms;
  --c-motion-duration-long3: 550ms;
  --c-motion-duration-long4: 600ms;
  --c-motion-duration-extra-long1: 700ms;
  --c-motion-duration-extra-long2: 800ms;
  --c-motion-duration-extra-long3: 900ms;
  --c-motion-duration-extra-long4: 1000ms;
  /* 9.0 Default Browser Colors */
  --c-default-browser-selection-background: #3366cc;
  --c-default-browser-selection-color: #ffffff;
}

::selection {
  background-color: var(--c-default-browser-selection-background);
  color: var(--c-default-browser-selection-color);
}

::-moz-selection {
  background-color: var(--c-default-browser-selection-background);
  color: var(--c-default-browser-selection-color);
}

body {
  font-size: var(--dxp-s-body-font-size, 16px);
  font-family: var(--dxp-s-html-font-family);
  height: auto;
}
body p {
  font-family: var(--c-font-fontFamily-primary);
  font-weight: var(--c-font-fontWeight-retina);
  line-height: var(--c-font-lineHeight-145);
  font-size: var(--c-font-fontSize-16);
  letter-spacing: var(--c-font-letterSpacing-0);
  margin: var(--c-font-paragraphSpacing-16) var(--c-font-paragraphSpacing-0);
  text-transform: var(--c-font-textCase-none);
  text-decoration: var(--c-font-textDecoration-none);
}
body small {
  font-family: var(--c-font-fontFamily-primary);
  font-weight: var(--c-font-fontWeight-retina);
  line-height: var(--c-font-lineHeight-145);
  font-size: var(--c-font-fontSize-14);
  letter-spacing: var(--c-font-letterSpacing-0);
  margin: var(--c-font-paragraphSpacing-14) var(--c-font-paragraphSpacing-0);
  text-transform: var(--c-font-textCase-none);
  text-decoration: var(--c-font-textDecoration-none);
}
body strong {
  font-weight: var(--c-font-fontWeight-medium);
}

/* h1 - h6  */
h1 {
  font-family: var(--c-font-fontFamily-primary);
  font-weight: var(--c-font-fontWeight-retina);
  line-height: var(--c-font-lineHeight-120);
  font-size: var(--c-font-fontSize-34);
  letter-spacing: var(--c-font-letterSpacing-0);
  margin-bottom: var(--c-font-paragraphSpacing-0);
  text-transform: var(--c-font-textCase-none);
  text-decoration: var(--c-font-textDecoration-none);
}
@media (min-width: 431px) {
  h1 {
    font-size: var(--c-font-fontSize-38);
  }
}
@media (min-width: 835px) {
  h1 {
    font-size: var(--c-font-fontSize-48);
  }
}
.slds-rich-text-editor__output h1 {
  font-family: var(--c-font-fontFamily-primary);
  font-weight: var(--c-font-fontWeight-retina);
  line-height: var(--c-font-lineHeight-120);
  font-size: var(--c-font-fontSize-34);
  letter-spacing: var(--c-font-letterSpacing-0);
  margin-bottom: var(--c-font-paragraphSpacing-0);
  text-transform: var(--c-font-textCase-none);
  text-decoration: var(--c-font-textDecoration-none);
}
@media (min-width: 431px) {
  .slds-rich-text-editor__output h1 {
    font-size: var(--c-font-fontSize-38);
  }
}
@media (min-width: 835px) {
  .slds-rich-text-editor__output h1 {
    font-size: var(--c-font-fontSize-48);
  }
}

h2 {
  font-family: var(--c-font-fontFamily-primary);
  font-weight: var(--c-font-fontWeight-retina);
  line-height: var(--c-font-lineHeight-100);
  font-size: var(--c-font-fontSize-32);
  letter-spacing: var(--c-font-letterSpacing-0);
  margin-bottom: var(--c-font-paragraphSpacing-0);
  text-transform: var(--c-font-textCase-none);
  text-decoration: var(--c-font-textDecoration-none);
}
@media (min-width: 431px) {
  h2 {
    font-size: var(--c-font-fontSize-34);
  }
}
@media (min-width: 835px) {
  h2 {
    font-size: var(--c-font-fontSize-42);
  }
}
.slds-rich-text-editor__output h2 {
  font-family: var(--c-font-fontFamily-primary);
  font-weight: var(--c-font-fontWeight-retina);
  line-height: var(--c-font-lineHeight-100);
  font-size: var(--c-font-fontSize-32);
  letter-spacing: var(--c-font-letterSpacing-0);
  margin-bottom: var(--c-font-paragraphSpacing-0);
  text-transform: var(--c-font-textCase-none);
  text-decoration: var(--c-font-textDecoration-none);
}
@media (min-width: 431px) {
  .slds-rich-text-editor__output h2 {
    font-size: var(--c-font-fontSize-34);
  }
}
@media (min-width: 835px) {
  .slds-rich-text-editor__output h2 {
    font-size: var(--c-font-fontSize-42);
  }
}

h3 {
  font-family: var(--c-font-fontFamily-primary);
  font-weight: var(--c-font-fontWeight-retina);
  line-height: var(--c-font-lineHeight-130);
  font-size: var(--c-font-fontSize-28);
  letter-spacing: var(--c-font-letterSpacing-0);
  margin-bottom: var(--c-font-paragraphSpacing-0);
  text-transform: var(--c-font-textCase-none);
  text-decoration: var(--c-font-textDecoration-none);
}
@media (min-width: 431px) {
  h3 {
    font-size: var(--c-font-fontSize-32);
  }
}
@media (min-width: 835px) {
  h3 {
    font-size: var(--c-font-fontSize-34);
  }
}
.slds-rich-text-editor__output h3 {
  font-family: var(--c-font-fontFamily-primary);
  font-weight: var(--c-font-fontWeight-retina);
  line-height: var(--c-font-lineHeight-130);
  font-size: var(--c-font-fontSize-28);
  letter-spacing: var(--c-font-letterSpacing-0);
  margin-bottom: var(--c-font-paragraphSpacing-0);
  text-transform: var(--c-font-textCase-none);
  text-decoration: var(--c-font-textDecoration-none);
}
@media (min-width: 431px) {
  .slds-rich-text-editor__output h3 {
    font-size: var(--c-font-fontSize-32);
  }
}
@media (min-width: 835px) {
  .slds-rich-text-editor__output h3 {
    font-size: var(--c-font-fontSize-34);
  }
}

h4 {
  font-family: var(--c-font-fontFamily-primary);
  font-weight: var(--c-font-fontWeight-retina);
  line-height: var(--c-font-lineHeight-130);
  font-size: var(--c-font-fontSize-26);
  letter-spacing: var(--c-font-letterSpacing-0);
  margin-bottom: var(--c-font-paragraphSpacing-0);
  text-transform: var(--c-font-textCase-none);
  text-decoration: var(--c-font-textDecoration-none);
}
@media (min-width: 835px) {
  h4 {
    font-size: var(--c-font-fontSize-30);
  }
}
.slds-rich-text-editor__output h4 {
  font-family: var(--c-font-fontFamily-primary);
  font-weight: var(--c-font-fontWeight-retina);
  line-height: var(--c-font-lineHeight-130);
  font-size: var(--c-font-fontSize-26);
  letter-spacing: var(--c-font-letterSpacing-0);
  margin-bottom: var(--c-font-paragraphSpacing-0);
  text-transform: var(--c-font-textCase-none);
  text-decoration: var(--c-font-textDecoration-none);
}
@media (min-width: 835px) {
  .slds-rich-text-editor__output h4 {
    font-size: var(--c-font-fontSize-30);
  }
}

h5 {
  font-family: var(--c-font-fontFamily-primary);
  font-weight: var(--c-font-fontWeight-retina);
  line-height: var(--c-font-lineHeight-130);
  font-size: var(--c-font-fontSize-24);
  letter-spacing: var(--c-font-letterSpacing-0);
  margin-bottom: var(--c-font-paragraphSpacing-0);
  text-transform: var(--c-font-textCase-none);
  text-decoration: var(--c-font-textDecoration-none);
}
@media (min-width: 835px) {
  h5 {
    font-size: var(--c-font-fontSize-26);
  }
}
.slds-rich-text-editor__output h5 {
  font-family: var(--c-font-fontFamily-primary);
  font-weight: var(--c-font-fontWeight-retina);
  line-height: var(--c-font-lineHeight-130);
  font-size: var(--c-font-fontSize-24);
  letter-spacing: var(--c-font-letterSpacing-0);
  margin-bottom: var(--c-font-paragraphSpacing-0);
  text-transform: var(--c-font-textCase-none);
  text-decoration: var(--c-font-textDecoration-none);
}
@media (min-width: 835px) {
  .slds-rich-text-editor__output h5 {
    font-size: var(--c-font-fontSize-26);
  }
}

h6 {
  font-family: var(--c-font-fontFamily-primary);
  font-weight: var(--c-font-fontWeight-retina);
  line-height: var(--c-font-lineHeight-130);
  font-size: var(--c-font-fontSize-22);
  letter-spacing: var(--c-font-letterSpacing-0);
  margin-bottom: var(--c-font-paragraphSpacing-0);
  text-transform: var(--c-font-textCase-none);
  text-decoration: var(--c-font-textDecoration-none);
}
.slds-rich-text-editor__output h6 {
  font-family: var(--c-font-fontFamily-primary);
  font-weight: var(--c-font-fontWeight-retina);
  line-height: var(--c-font-lineHeight-130);
  font-size: var(--c-font-fontSize-22);
  letter-spacing: var(--c-font-letterSpacing-0);
  margin-bottom: var(--c-font-paragraphSpacing-0);
  text-transform: var(--c-font-textCase-none);
  text-decoration: var(--c-font-textDecoration-none);
}

/* display-1 - display-3 */
.display-1 {
  font-family: var(--c-font-fontFamily-primary);
  font-weight: var(--c-font-fontWeight-retina);
  line-height: var(--c-font-lineHeight-95);
  font-size: var(--c-font-fontSize-38);
  letter-spacing: var(--c-font-letterSpacing-neg2);
  margin-bottom: var(--c-font-paragraphSpacing-0);
  text-transform: var(--c-font-textCase-none);
  text-decoration: var(--c-font-textDecoration-none);
}
@media (min-width: 431px) {
  .display-1 {
    font-size: var(--c-font-fontSize-54);
  }
}
@media (min-width: 835px) {
  .display-1 {
    font-size: var(--c-font-fontSize-68);
  }
}
.slds-rich-text-editor__output .display-1 {
  font-family: var(--c-font-fontFamily-primary);
  font-weight: var(--c-font-fontWeight-retina);
  line-height: var(--c-font-lineHeight-95);
  font-size: var(--c-font-fontSize-38);
  letter-spacing: var(--c-font-letterSpacing-neg2);
  margin-bottom: var(--c-font-paragraphSpacing-0);
  text-transform: var(--c-font-textCase-none);
  text-decoration: var(--c-font-textDecoration-none);
}
@media (min-width: 431px) {
  .slds-rich-text-editor__output .display-1 {
    font-size: var(--c-font-fontSize-54);
  }
}
@media (min-width: 835px) {
  .slds-rich-text-editor__output .display-1 {
    font-size: var(--c-font-fontSize-68);
  }
}

.display-2 {
  font-family: var(--c-font-fontFamily-primary);
  font-weight: var(--c-font-fontWeight-retina);
  line-height: var(--c-font-lineHeight-100);
  font-size: var(--c-font-fontSize-36);
  letter-spacing: var(--c-font-letterSpacing-neg2);
  margin-bottom: var(--c-font-paragraphSpacing-0);
  text-transform: var(--c-font-textCase-none);
  text-decoration: var(--c-font-textDecoration-none);
}
@media (min-width: 431px) {
  .display-2 {
    font-size: var(--c-font-fontSize-48);
  }
}
@media (min-width: 835px) {
  .display-2 {
    font-size: var(--c-font-fontSize-64);
  }
}
.slds-rich-text-editor__output .display-2 {
  font-family: var(--c-font-fontFamily-primary);
  font-weight: var(--c-font-fontWeight-retina);
  line-height: var(--c-font-lineHeight-100);
  font-size: var(--c-font-fontSize-36);
  letter-spacing: var(--c-font-letterSpacing-neg2);
  margin-bottom: var(--c-font-paragraphSpacing-0);
  text-transform: var(--c-font-textCase-none);
  text-decoration: var(--c-font-textDecoration-none);
}
@media (min-width: 431px) {
  .slds-rich-text-editor__output .display-2 {
    font-size: var(--c-font-fontSize-48);
  }
}
@media (min-width: 835px) {
  .slds-rich-text-editor__output .display-2 {
    font-size: var(--c-font-fontSize-64);
  }
}

.display-3 {
  font-family: var(--c-font-fontFamily-primary);
  font-weight: var(--c-font-fontWeight-retina);
  line-height: var(--c-font-lineHeight-100);
  font-size: var(--c-font-fontSize-34);
  letter-spacing: var(--c-font-letterSpacing-neg2);
  margin-bottom: var(--c-font-paragraphSpacing-0);
  text-transform: var(--c-font-textCase-none);
  text-decoration: var(--c-font-textDecoration-none);
}
@media (min-width: 431px) {
  .display-3 {
    font-size: var(--c-font-fontSize-42);
  }
}
@media (min-width: 835px) {
  .display-3 {
    font-size: var(--c-font-fontSize-58);
  }
}
.slds-rich-text-editor__output .display-3 {
  font-family: var(--c-font-fontFamily-primary);
  font-weight: var(--c-font-fontWeight-retina);
  line-height: var(--c-font-lineHeight-100);
  font-size: var(--c-font-fontSize-34);
  letter-spacing: var(--c-font-letterSpacing-neg2);
  margin-bottom: var(--c-font-paragraphSpacing-0);
  text-transform: var(--c-font-textCase-none);
  text-decoration: var(--c-font-textDecoration-none);
}
@media (min-width: 431px) {
  .slds-rich-text-editor__output .display-3 {
    font-size: var(--c-font-fontSize-42);
  }
}
@media (min-width: 835px) {
  .slds-rich-text-editor__output .display-3 {
    font-size: var(--c-font-fontSize-58);
  }
}

/* title-1 - title-3 */
.title-1 {
  font-family: var(--c-font-fontFamily-primary);
  font-weight: var(--c-font-fontWeight-medium);
  line-height: var(--c-font-lineHeight-120);
  font-size: var(--c-font-fontSize-28);
  letter-spacing: var(--c-font-letterSpacing-0);
  margin-bottom: var(--c-font-paragraphSpacing-0);
  text-transform: var(--c-font-textCase-none);
  text-decoration: var(--c-font-textDecoration-none);
}
.slds-rich-text-editor__output .title-1 {
  font-family: var(--c-font-fontFamily-primary);
  font-weight: var(--c-font-fontWeight-medium);
  line-height: var(--c-font-lineHeight-120);
  font-size: var(--c-font-fontSize-28);
  letter-spacing: var(--c-font-letterSpacing-0);
  margin-bottom: var(--c-font-paragraphSpacing-0);
  text-transform: var(--c-font-textCase-none);
  text-decoration: var(--c-font-textDecoration-none);
}

.title-2 {
  font-family: var(--c-font-fontFamily-primary);
  font-weight: var(--c-font-fontWeight-medium);
  line-height: var(--c-font-lineHeight-120);
  font-size: var(--c-font-fontSize-24);
  letter-spacing: var(--c-font-letterSpacing-0);
  margin-bottom: var(--c-font-paragraphSpacing-0);
  text-transform: var(--c-font-textCase-none);
  text-decoration: var(--c-font-textDecoration-none);
}
.slds-rich-text-editor__output .title-2 {
  font-family: var(--c-font-fontFamily-primary);
  font-weight: var(--c-font-fontWeight-medium);
  line-height: var(--c-font-lineHeight-120);
  font-size: var(--c-font-fontSize-24);
  letter-spacing: var(--c-font-letterSpacing-0);
  margin-bottom: var(--c-font-paragraphSpacing-0);
  text-transform: var(--c-font-textCase-none);
  text-decoration: var(--c-font-textDecoration-none);
}

.title-3 {
  font-family: var(--c-font-fontFamily-primary);
  font-weight: var(--c-font-fontWeight-medium);
  line-height: var(--c-font-lineHeight-120);
  font-size: var(--c-font-fontSize-20);
  letter-spacing: var(--c-font-letterSpacing-0);
  margin-bottom: var(--c-font-paragraphSpacing-0);
  text-transform: var(--c-font-textCase-none);
  text-decoration: var(--c-font-textDecoration-none);
}
.slds-rich-text-editor__output .title-3 {
  font-family: var(--c-font-fontFamily-primary);
  font-weight: var(--c-font-fontWeight-medium);
  line-height: var(--c-font-lineHeight-120);
  font-size: var(--c-font-fontSize-20);
  letter-spacing: var(--c-font-letterSpacing-0);
  margin-bottom: var(--c-font-paragraphSpacing-0);
  text-transform: var(--c-font-textCase-none);
  text-decoration: var(--c-font-textDecoration-none);
}

.body-large {
  font-family: var(--c-font-fontFamily-primary);
  font-weight: var(--c-font-fontWeight-retina);
  line-height: var(--c-font-lineHeight-145);
  font-size: var(--c-font-fontSize-18);
  letter-spacing: var(--c-font-letterSpacing-0);
  margin: var(--c-font-paragraphSpacing-18) var(--c-font-paragraphSpacing-0);
  text-transform: var(--c-font-textCase-none);
  text-decoration: var(--c-font-textDecoration-none);
}
@media (min-width: 431px) {
  .body-large {
    font-size: var(--c-font-fontSize-19);
    margin: var(--c-font-paragraphSpacing-19) var(--c-font-paragraphSpacing-0);
  }
}
@media (min-width: 835px) {
  .body-large {
    font-size: var(--c-font-fontSize-20);
    margin: var(--c-font-paragraphSpacing-20) var(--c-font-paragraphSpacing-0);
  }
}
.slds-rich-text-editor__output .body-large {
  font-family: var(--c-font-fontFamily-primary);
  font-weight: var(--c-font-fontWeight-retina);
  line-height: var(--c-font-lineHeight-145);
  font-size: var(--c-font-fontSize-18);
  letter-spacing: var(--c-font-letterSpacing-0);
  margin: var(--c-font-paragraphSpacing-18) var(--c-font-paragraphSpacing-0);
  text-transform: var(--c-font-textCase-none);
  text-decoration: var(--c-font-textDecoration-none);
}
@media (min-width: 431px) {
  .slds-rich-text-editor__output .body-large {
    font-size: var(--c-font-fontSize-19);
    margin: var(--c-font-paragraphSpacing-19) var(--c-font-paragraphSpacing-0);
  }
}
@media (min-width: 835px) {
  .slds-rich-text-editor__output .body-large {
    font-size: var(--c-font-fontSize-20);
    margin: var(--c-font-paragraphSpacing-20) var(--c-font-paragraphSpacing-0);
  }
}

blockquote {
  font-family: var(--c-font-fontFamily-primary);
  font-weight: var(--c-font-fontWeight-retina);
  line-height: var(--c-font-lineHeight-135);
  font-size: var(--c-font-fontSize-24);
  letter-spacing: var(--c-font-letterSpacing-0);
  padding: var(--c-font-paragraphSpacing-0) var(--c-font-paragraphSpacing-24);
  text-transform: var(--c-font-textCase-none);
  text-decoration: var(--c-font-textDecoration-none);
}

/* GRID CONTENT AND DISTRIBUTION CLASSES*/
.layout-wrapper {
  margin: 0 auto;
  position: relative;
  max-width: var(--c-grid-desktop-page);
  padding-inline: var(--c-grid-page-margin);
}

/* GRID */
.layout-grid {
  display: grid;
  grid-template-columns: repeat(var(--c-grid-columns), minmax(0, 1fr));
  gap: var(--c-grid-gutter);
  padding-inline: var(--c-grid-margin);
}
.layout-grid--full-bleed {
  padding-inline: 0;
}

/* CARDS */
.col-span-1 {
  --span: 1;
}

@media (min-width: 431px) {
  .col-tablet-span-1 {
    --span-tablet: 1;
  }
}
@media (min-width: 835px) {
  .col-desktop-span-1 {
    --span-desktop: 1;
  }
}
.col-span-2 {
  --span: 2;
}

@media (min-width: 431px) {
  .col-tablet-span-2 {
    --span-tablet: 2;
  }
}
@media (min-width: 835px) {
  .col-desktop-span-2 {
    --span-desktop: 2;
  }
}
.col-span-3 {
  --span: 3;
}

@media (min-width: 431px) {
  .col-tablet-span-3 {
    --span-tablet: 3;
  }
}
@media (min-width: 835px) {
  .col-desktop-span-3 {
    --span-desktop: 3;
  }
}
.col-span-4 {
  --span: 4;
}

@media (min-width: 431px) {
  .col-tablet-span-4 {
    --span-tablet: 4;
  }
}
@media (min-width: 835px) {
  .col-desktop-span-4 {
    --span-desktop: 4;
  }
}
.col-span-5 {
  --span: 5;
}

@media (min-width: 431px) {
  .col-tablet-span-5 {
    --span-tablet: 5;
  }
}
@media (min-width: 835px) {
  .col-desktop-span-5 {
    --span-desktop: 5;
  }
}
.col-span-6 {
  --span: 6;
}

@media (min-width: 431px) {
  .col-tablet-span-6 {
    --span-tablet: 6;
  }
}
@media (min-width: 835px) {
  .col-desktop-span-6 {
    --span-desktop: 6;
  }
}
.col-span-7 {
  --span: 7;
}

@media (min-width: 431px) {
  .col-tablet-span-7 {
    --span-tablet: 7;
  }
}
@media (min-width: 835px) {
  .col-desktop-span-7 {
    --span-desktop: 7;
  }
}
.col-span-8 {
  --span: 8;
}

@media (min-width: 431px) {
  .col-tablet-span-8 {
    --span-tablet: 8;
  }
}
@media (min-width: 835px) {
  .col-desktop-span-8 {
    --span-desktop: 8;
  }
}
.col-span-9 {
  --span: 9;
}

@media (min-width: 431px) {
  .col-tablet-span-9 {
    --span-tablet: 9;
  }
}
@media (min-width: 835px) {
  .col-desktop-span-9 {
    --span-desktop: 9;
  }
}
.col-span-10 {
  --span: 10;
}

@media (min-width: 431px) {
  .col-tablet-span-10 {
    --span-tablet: 10;
  }
}
@media (min-width: 835px) {
  .col-desktop-span-10 {
    --span-desktop: 10;
  }
}
.col-span-11 {
  --span: 11;
}

@media (min-width: 431px) {
  .col-tablet-span-11 {
    --span-tablet: 11;
  }
}
@media (min-width: 835px) {
  .col-desktop-span-11 {
    --span-desktop: 11;
  }
}
.col-span-12 {
  --span: 12;
}

@media (min-width: 431px) {
  .col-tablet-span-12 {
    --span-tablet: 12;
  }
}
@media (min-width: 835px) {
  .col-desktop-span-12 {
    --span-desktop: 12;
  }
}
.layout-col {
  --current-span: var(--span, 1);
}
@media (min-width: 431px) {
  .layout-col {
    --current-span: var(--span-tablet, var(--span, 1));
  }
}
@media (min-width: 835px) {
  .layout-col {
    --current-span: var(--span-desktop, var(--span-tablet, var(--span, 1)));
  }
}
.layout-col {
  grid-column: span min(var(--current-span), var(--c-grid-columns));
  display: block;
}

.js-try-again-btn {
  transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease !important;
}

.js-try-again-btn:hover,
.js-try-again-btn:focus {
  background-color: var(--c-color-action-primary-surface-hover) !important;
  color: var(--c-color-action-primary-content-hover) !important;
  border-color: var(--c-color-action-primary-border-hover) !important;
}

@media (prefers-color-scheme: dark) {
  :root {
    /* 1.1 COLOR CONTENT */
    --c-color-content-primary: var(--dxp-g-root-contrast, #020F22);
    --c-color-content-primary-inverse: var(--dxp-g-brand-contrast, #FFFFFF);
    --c-color-content-secondary: #353F4E;
    --c-color-content-disabled: #4E5764;
    /* 1.2 COLOR SURFACE */
    --c-color-surface-light: #F3F3F4;
    --c-color-surface-base: #E8EDF4;
    --c-color-surface-mid: #DBE2E9;
    --c-color-surface-dim: #CBD5DF;
    --c-color-surface-accentPrimary: var(--dxp-g-brand, #A850F4);
    --c-color-surface-accentSecondary: #FBDB65;
    --c-color-surface-accentTertiary: #84329B;
    --c-color-surface-light-transparent: rgba(243, 243, 244, 0);
    --c-color-surface-base-transparent: rgba(232, 237, 244, 0);
    --c-color-surface-mid-transparent: rgba(219, 226, 233, 0);
    --c-color-surface-dim-transparent: rgba(203, 213, 223, 0);
    /* 1.3 COLOR SURFACE HOVER */
    --c-color-surface-hover-light: #E6E7E9;
    --c-color-surface-hover-base: #DBE2E9;
    --c-color-surface-hover-mid: #CBD5DF;
    --c-color-surface-hover-dim: #BBC7D6;
    --c-color-surface-hover-accentPrimary: #9D26D9;
    --c-color-surface-hover-accentSecondary: #FAD138;
    --c-color-surface-hover-accentTertiary: #632574;
    /** 1.4 COLOR BORDER */
    --c-color-border-light: #FFFFFF;
    --c-color-border-base: #BBC7D6;
    --c-color-border-mid: #7D9CC0;
    --c-color-border-dim: #020F22;
    --c-color-border-inverse: #676F7A;
    --c-color-border-accentPrimary: var(--dxp-g-brand, #A850F4);
    --c-color-border-accentSecondary: #FBDB65;
    --c-color-border-accentTertiary: #84329B;
    /** 1.5 COLOR BOX SHADOW */
    --c-color-box-shadow-shade: rgba(2, 15, 34, 0.15);
    --c-color-box-shadow-base: rgba(2, 15, 34, 0.05);
    /* 1.6 COLOR ACTION PRIMARY - FILLED INTERACTION */
    --c-color-action-primary-surface-base: var(--dxp-s-button-color, #020F22);
    --c-color-action-primary-surface-hover: var(--dxp-s-button-color-hover, #4E5764);
    --c-color-action-primary-surface-active: var(--dxp-s-button-color-active, #353F4E);
    --c-color-action-primary-surface-focus: var(--dxp-s-button-color-hover, #4E5764);
    --c-color-action-primary-surface-disabled: #B3B7BD;
    --c-color-action-primary-surface-visited: #632574;
    --c-color-action-primary-content-base: var(--dxp-s-button-color-contrast, #FFFFFF);
    --c-color-action-primary-content-hover: var(--dxp-s-button-color-contrast, #FFFFFF);
    --c-color-action-primary-content-active: var(--dxp-s-button-color-contrast, #FFFFFF);
    --c-color-action-primary-content-focus: var(--dxp-s-button-color-contrast, #FFFFFF);
    --c-color-action-primary-content-disabled: #4E5764;
    --c-color-action-primary-content-visited: #FFFFFF;
    --c-color-action-primary-border-base: var(--dxp-s-button-border-color, #020F22);
    --c-color-action-primary-border-hover: var(--dxp-s-button-border-color-hover, #4E5764);
    --c-color-action-primary-border-active: var(--dxp-s-button-border-color-active, #353F4E);
    --c-color-action-primary-border-focus: var(--dxp-s-button-border-color-hover, #4E5764);
    --c-color-action-primary-border-disabled: #B3B7BD;
    --c-color-action-primary-border-visited: #632574;
    /* 1.7 COLOR ACTION SECONDARY - OUTLINE INTERACTION */
    --c-color-action-secondary-surface-base: var(--dxp-s-secondary-button-color, rgba(255, 255, 255, 0));
    --c-color-action-secondary-surface-hover: var(--dxp-s-secondary-button-color-hover, rgba(255, 255, 255, 0));
    --c-color-action-secondary-surface-active: var(--dxp-s-secondary-button-color-focus, rgba(255, 255, 255, 0));
    --c-color-action-secondary-surface-focus: var(--dxp-s-secondary-button-color-focus, rgba(255, 255, 255, 0));
    --c-color-action-secondary-surface-disabled: rgba(255, 255, 255, 0);
    --c-color-action-secondary-surface-visited: rgba(255, 255, 255, 0);
    --c-color-action-secondary-content-base: var(--dxp-s-secondary-button-text-color, #020F22);
    --c-color-action-secondary-content-hover: var(--dxp-s-secondary-button-text-color-hover, #4E5764);
    --c-color-action-secondary-content-active: #353F4E;
    --c-color-action-secondary-content-focus: var(--dxp-s-secondary-button-text-color-hover, #4E5764);
    --c-color-action-secondary-content-disabled: #808790;
    --c-color-action-secondary-content-visited: #632574;
    --c-color-action-secondary-border-base: var(--dxp-s-secondary-button-border-color, #020F22);
    --c-color-action-secondary-border-hover: var(--dxp-s-secondary-button-border-color-hover, #4E5764);
    --c-color-action-secondary-border-active: #353F4E;
    --c-color-action-secondary-border-focus: var(--dxp-s-secondary-button-border-color-focus, #4E5764);
    --c-color-action-secondary-border-disabled: #B3B7BD;
    --c-color-action-secondary-border-visited: #632574;
    --c-color-action-secondary-border-focus-ring: #7D9CC0;
    /* 1.8 COLOR ACTION TERTIARY - ACCORDIONS & TABS INTERACTION */
    --c-color-action-tertiary-surface-base: var(--dxp-s-tertiary-button-color, rgba(255, 255, 255, 0));
    --c-color-action-tertiary-surface-hover: var(--dxp-s-tertiary-button-color-hover, rgba(255, 255, 255, 0));
    --c-color-action-tertiary-surface-active: var(--dxp-s-tertiary-button-color-focus, rgba(255, 255, 255, 0));
    --c-color-action-tertiary-surface-focus: var(--dxp-s-tertiary-button-color-focus, rgba(255, 255, 255, 0));
    --c-color-action-tertiary-surface-disabled: rgba(255, 255, 255, 0);
    --c-color-action-tertiary-surface-visited: rgba(255, 255, 255, 0);
    --c-color-action-tertiary-content-base: var(--dxp-s-tertiary-button-text-color, #020F22);
    --c-color-action-tertiary-content-hover: var(--dxp-s-tertiary-button-text-color-hover, #9D26D9);
    --c-color-action-tertiary-content-active: #9D26D9;
    --c-color-action-tertiary-content-focus: var(--dxp-s-tertiary-button-text-color, #020F22);
    --c-color-action-tertiary-content-disabled: #808790;
    --c-color-action-tertiary-content-visited: #632574;
    --c-color-action-tertiary-border-base: var(--dxp-s-tertiary-button-border-color, #020F22);
    --c-color-action-tertiary-border-hover: var(--dxp-s-tertiary-button-border-color-hover, #9D26D9);
    --c-color-action-tertiary-border-active: #9D26D9;
    --c-color-action-tertiary-border-focus: var(--dxp-s-tertiary-button-border-color-focus, #020F22);
    --c-color-action-tertiary-border-disabled: #808790;
    --c-color-action-tertiary-border-visited: #632574;
    --c-color-action-tertiary-border-focus-ring: #7D9CC0;
    /* 1.9 FORM COLORS */
    --c-color-form-surface-base: var(--dxp-s-form-element-color-background, #FFFFFF);
    --c-color-form-surface-disabled: #CCCFD3;
    --c-color-form-surface-accent: var(--dxp-g-brand, #A850F4);
    --c-color-form-content-label: var(--dxp-s-form-element-label-color, #020F22);
    --c-color-form-content-placeholder: var(--dxp-s-form-element-placeholder-text-color, #4E5764);
    --c-color-form-content-filled: var(--dxp-s-form-element-text-color, #020F22);
    --c-color-form-content-disabled: #808790;
    --c-color-form-helper-error: #BB2A0E;
    --c-color-form-helper-warning: #9B5A00;
    --c-color-form-helper-success: #007B00;
    --c-color-form-helper-highlight: #9724D1;
    --c-color-form-helper-neutral: #405671;
    --c-color-form-helper-neutral-opaque: rgba(94, 121, 152, 0.2);
    --c-color-form-border-default: var(--dxp-s-form-element-color-border, #BBC7D6);
    --c-color-form-border-error: #BD2C0F;
    --c-color-form-border-warning: #F89407;
    --c-color-form-border-success: #339933;
    --c-color-form-border-highlight: #9724D1;
    --c-color-form-border-neutral: #405671;
    --c-color-form-border-neutral-opaque: rgba(94, 121, 152, 0.2);
    --c-color-form-border-focus-ring: var(--dxp-s-form-element-color-border-focus, #7D9CC0);
    --c-color-form-border-active: #676F7A;
    --c-color-form-border-accent: var(--dxp-g-brand, #A850F4);
    /* 1.10 GRADIENTS COLORS */
    --c-color-gradient-light-base: linear-gradient(-90deg, #F3F3F4 0%, #E8EDF4 100%);
    --c-color-gradient-light-mid: linear-gradient(-90deg, #F3F3F4 0%, #DBE2E9 100%);
    --c-color-gradient-light-dim: linear-gradient(-90deg, #F3F3F4 0%, #CBD5DF 100%);
    --c-color-gradient-base-mid: linear-gradient(-90deg, #E8EDF4 0%, #DBE2E9 100%);
    --c-color-gradient-base-dim: linear-gradient(-90deg, #E8EDF4 0%, #CBD5DF 100%);
    --c-color-gradient-mid-dim: linear-gradient(-90deg, #DBE2E9 0%, #CBD5DF 100%);
    --c-color-gradient-light-base-vertical: linear-gradient(180deg, #F3F3F4 0%, #E8EDF4 100%);
    --c-color-gradient-light-mid-vertical: linear-gradient(180deg, #F3F3F4 0%, #DBE2E9 100%);
    --c-color-gradient-light-dim-vertical: linear-gradient(180deg, #F3F3F4 0%, #CBD5DF 100%);
    --c-color-gradient-base-mid-vertical: linear-gradient(180deg, #E8EDF4 0%, #DBE2E9 100%);
    --c-color-gradient-base-dim-vertical: linear-gradient(180deg, #E8EDF4 0%, #CBD5DF 100%);
    --c-color-gradient-mid-dim-vertical: linear-gradient(180deg, #DBE2E9 0%, #CBD5DF 100%);
    --c-color-gradient-base-dim-diagonal: linear-gradient(214.1deg, #E8EDF4 18.31%, #CBD5DF 87.21%);
    --c-color-gradient-inverse-diagonal: linear-gradient(214.1deg, #1B2738 18.31%, #010813 87.21%);
    --c-color-gradient-light-transparent: linear-gradient(180deg, rgba(243, 243, 244, 0) 0%, #F3F3F4 100%);
    --c-color-gradient-base-transparent: linear-gradient(180deg, rgba(232, 237, 244, 0) 0%, #E8EDF4 100%);
    --c-color-gradient-mid-transparent: linear-gradient(180deg, rgba(219, 226, 233, 0) 0%, #DBE2E9 100%);
    --c-color-gradient-dim-transparent: linear-gradient(180deg, rgba(203, 213, 223, 0) 0%, #CBD5DF 100%);
    /* 1.11 TABLE COLORS */
    --c-color-table-border-shade-1: rgba(2, 15, 34, 0.1);
    --c-color-table-border-shade-2: rgba(2, 15, 34, 0.15);
    --c-color-table-border-shade-3: rgba(2, 15, 34, 0.2);
    --c-color-table-surface-odd-row: rgba(2, 15, 34, 0.05);
    /* 1.13 STATUS COLORS */
    --c-color-status-surface-neutral: #405671;
  }
}
