:root {
  /* SCALES
     * Scales
        1.067 - Minor Second
        1.125 - Major Second
        1.200 - Minor Third
        1.250 - Major Third
        1.333 - Perfect Fourth
        1.414 - Augmented Fourth
        1.500 - Perfect Fifth
        1.618 - Golden Ratio

        Source: Typescale
     */
  --space-xs: clamp(0.8888888889rem, calc(0.4861111111vw + 0.7333333333rem), 1.5111111111rem);
  --space-s: clamp(1.3333333333rem, calc(0.7291666667vw + 1.1rem), 2.2666666667rem);
  --space-m: clamp(2rem, calc(1.09375vw + 1.65rem), 3.4rem);
  --space-l: clamp(2.666rem, calc(1.9015625vw + 2.0575rem), 5.1rem);
  --space-xl: clamp(3.553778rem, calc(3.2001734375vw + 2.5297225rem), 7.65rem);
  --space-xxl: clamp(4.737186074rem, calc(5.2639171297vw + 3.0527325925rem), 11.475rem);
  /* SECTION TOP and BOTTOM PADDING VALUES
     * https://www.fluid-type-scale.com/calculate?minFontSize=40&minWidth=320&minRatio=1.125&maxFontSize=80&maxWidth=1280&maxRatio=1.618&steps=xs%2Cs%2Cm%2Cl%2Cxl%2Cxxl&baseStep=m&prefix=section-space&useContainerWidth=false&includeFallbacks=false&useRems=true&remValue=16&decimals=2&previewFont=Inter&previewText=Preview&previewWidth=350
     */
  --section-space-xs: clamp(1.98rem, -0.11vi + 2rem, 1.91rem);
  --section-space-s: clamp(2.22rem, 1.45vi + 1.93rem, 3.09rem);
  --section-space-m: clamp(2.5rem, 4.17vi + 1.67rem, 5rem);
  --section-space-l: clamp(2.81rem, 8.8vi + 1.05rem, 8.09rem);
  --section-space-xl: clamp(3.16rem, 16.54vi + -0.14rem, 13.09rem);
  --section-space-xxl: clamp(3.56rem, 29.37vi + -2.31rem, 21.18rem);
  /* SECTION LEFT and RIGHT PADDING VALUES
     * https://www.fluid-type-scale.com/calculate?minFontSize=8&minWidth=320&minRatio=1.125&maxFontSize=40&maxWidth=1280&maxRatio=1.618&steps=a%2Cx%2Cc&baseStep=x&prefix=section-padding&useContainerWidth=false&includeFallbacks=false&useRems=true&remValue=16&decimals=2&previewFont=Inter&previewText=Preview&previewWidth=1280
     */
  /* --section-padding-x: clamp(1.6rem, calc(5vw + 0rem), 8rem); */
  --section-padding-x: clamp(0.5rem, 3.33vi + -0.17rem, 2.5rem);
  --gutter: clamp(1.6rem, calc(5vw + 0rem), 8rem);
  /* RADIUS & BORDER
     *
     */
  --radius: 4px;
  --radius-50: 50%;
  --radius-circle: 50vw;
  --radius-none: 0;
  --radius-xxs: 2px;
  --radius-xs: 4px;
  --radius-s: 8px;
  --radius-m: 10px;
  --radius-l: 12px;
  --radius-xl: 16px;
  --radius-xxl: 20px;
  --radius-xxxl: 28px;
  --border-size: 1px;
  --border-width: 1px;
  /* BUTTON
     * 
     */
  --button-top: 8px;
  --button-right: 16px;
  --button-bottom: 8px;
  --button-left: 16px;
  --button-m-top: 8px;
  --button-m-right: 24px;
  --button-m-bottom: 8px;
  --button-m-left: 24px;
}
/* END ROOT */
/* CONTAINER PADDING
 * These classes should be set on default containers (i.e. not <sections>),
 * and will set both top, right, bottom and left padding to the same value.
 */
.padding--xs {
  --container-default-padding-top: var(--space-xs);
  --container-default-padding-right: var(--space-xs);
  --container-default-padding-bottom: var(--space-xs);
  --container-default-padding-left: var(--space-xs);
}
.padding--s {
  --container-default-padding-top: var(--space-s);
  --container-default-padding-right: var(--space-s);
  --container-default-padding-bottom: var(--space-s);
  --container-default-padding-left: var(--space-s);
}
.padding--m {
  --container-default-padding-top: var(--space-m);
  --container-default-padding-right: var(--space-m);
  --container-default-padding-bottom: var(--space-m);
  --container-default-padding-left: var(--space-m);
}
.padding--l {
  --container-default-padding-top: var(--space-l);
  --container-default-padding-right: var(--space-l);
  --container-default-padding-bottom: var(--space-l);
  --container-default-padding-left: var(--space-l);
}
.padding--xl {
  --container-default-padding-top: var(--space-xl);
  --container-default-padding-right: var(--space-xl);
  --container-default-padding-bottom: var(--space-xl);
  --container-default-padding-left: var(--space-xl);
}
.padding--xxl {
  --container-default-padding-top: var(--space-xxl);
  --container-default-padding-right: var(--space-xxl);
  --container-default-padding-bottom: var(--space-xxl);
  --container-default-padding-left: var(--space-xxl);
}
.padding--none {
  --container-default-padding-top: 0;
  --container-default-padding-right: 0;
  --container-default-padding-bottom: 0;
  --container-default-padding-left: 0;
}
/* HEADER PADDING
 *
 */
.e-con.header {
  --container-default-padding-top: var(--section-space-m);
  --container-default-padding-right: var(--gutter);
  --container-default-padding-bottom: var(--section-space-m);
  --container-default-padding-left: var(--gutter);
}
.e-con.header--xxs {
  --container-default-padding-top: calc(var(--space-xs) * 0.5);
  --container-default-padding-bottom: calc(var(--space-xs) * 0.5);
}
.e-con.header--xs {
  --container-default-padding-top: var(--space-xs);
  --container-default-padding-bottom: var(--space-xs);
}
.e-con.header--s {
  --container-default-padding-top: var(--space-s);
  --container-default-padding-bottom: var(--space-s);
}
.e-con.header--m {
  --container-default-padding-top: var(--space-m);
  --container-default-padding-bottom: var(--space-m);
}
.e-con.header--l {
  --container-default-padding-top: var(--space-l);
  --container-default-padding-bottom: var(--space-l);
}
.e-con.header--xl {
  --container-default-padding-top: var(--space-xl);
  --container-default-padding-bottom: var(--space-xl);
}
.e-con.header--xxl {
  --container-default-padding-top: var(--space-xxl);
  --container-default-padding-bottom: var(--space-xxl);
}
.e-con.header--none {
  --container-default-padding-top: 0;
  --container-default-padding-bottom: 0;
  /* CLEAR TOP/BOTTOM PADDING ONLY
                * In some cases we want to not set any top/bottom padding.
                * For instance if we want to have minimal spacing between the current and next section.
                * In that case you can override this by adding the following classes.
                */
}
.e-con.header--none-top {
  --container-default-padding-top: 0;
}
.e-con.header--none-bottom {
  --container-default-padding-bottom: 0;
}
/* SECTION PADDING
 * You can still override the padding by setting it on the section element.
 * Note:
 * - Elementor sets the left/right padding on the section element.
 * - Elementor sets the top/bottom padding on the first child element: .econ > .e-con-inner
 */
/* :where(section:not(section section)) { */
/* Default padding on a container set to html tag 'section': 
 * no need to add any additional classes.
 * Because of specificity we need to:
 * 1. Override the e-con settings.
 * 2. Make sure we have not set a section class on the tag.
 */
/* section.e-con:not([class*="section--xs"]):not([class*="section--s"]):not([class*="section--m"]):not([class*="section--l"]):not([class*="section--xl"]):not([class*="section--xxl"]):not(.section--none):not([class*="header--"]) { */
section.e-con {
  --container-default-padding-top: var(--section-space-m);
  --container-default-padding-right: var(--gutter);
  --container-default-padding-bottom: var(--section-space-m);
  --container-default-padding-left: var(--gutter);
}
section.e-con.section--xs {
  --container-default-padding-top: var(--section-space-xs);
  --container-default-padding-bottom: var(--section-space-xs);
}
section.e-con.section--s {
  --container-default-padding-top: var(--section-space-xs);
  --container-default-padding-bottom: var(--section-space-xs);
}
section.e-con.section--m {
  --container-default-padding-top: var(--section-space-m);
  --container-default-padding-bottom: var(--section-space-m);
}
section.e-con.section--xl {
  --container-default-padding-top: var(--section-space-m);
  --container-default-padding-bottom: var(--section-space-m);
}
section.e-con.section--xxl {
  --container-default-padding-top: var(--section-space-xxl);
  --container-default-padding-bottom: var(--section-space-xxl);
}
section.e-con.section--none {
  --container-default-padding-top: 0;
  --container-default-padding-bottom: 0;
  /* CLEAR TOP/BOTTOM PADDING ONLY
                 * In some cases we want to not set any top/bottom padding.
                 * For instance if we want to have minimal spacing between the current and next section.
                 * In that case you can override this by adding the following classes.
                 */
}
section.e-con.section--none-top {
  --container-default-padding-top: 0;
}
section.e-con.section--none-bottom {
  --container-default-padding-bottom: 0;
}