:root, body{

    /* Layout variables */
    --content-width: 1440px;

    /*
     * Font variables
     * We are mapping the generic variable names from Elementor 
     * to our own custom variables that are reusable in our standard CSS
    */

    /* Color variables */
    --primary-color: var(--e-global-color-primary);
    --accent-color: var(--e-global-color-accent);
    --text-color: var(--e-global-color-text);

    --forest-green: var(--e-global-color-267780b);
    --light-green: var(--e-global-color-1e5e6a4);
    --dark-green: var(--e-global-color-71d7a8c);
    --green: var(--e-global-color-683322e);
    --warm-white: var(--e-global-color-9d98961);
    --pale-green: var(--e-global-color-6483187);
    --lime-green: var(--e-global-color-f6ee713);
    --beige: var( --e-global-color-3e7f732);


    /* Font variables */
    --h1-font-size: var(--e-global-typography-9a347e6-font-size);
    --h1-line-height: var(--e-global-typography-9a347e6-line-height);
    --h1-font-family: var(--e-global-typography-9a347e6-font-family), Sans-serif;
    --h1-default-color: var(--primary-color);
    --h1-font-weight: var(--e-global-typography-9a347e6-font-weight);

    --h2-font-size: var(--e-global-typography-2026e5f-font-size);
    --h2-line-height: var(--e-global-typography-2026e5f-line-height);
    --h2-font-family: var(--e-global-typography-2026e5f-font-family), Sans-serif;
    --h2-default-color: var(--primary-color);
    --h2-font-weight: var(--e-global-typography-2026e5f-font-weight);

    --h3-font-size: var(--e-global-typography-8008c0d-font-size);
    --h3-line-height: var(--e-global-typography-8008c0d-line-height);
    --h3-font-family: var(--e-global-typography-8008c0d-font-family), Sans-serif;
    --h3-default-color: var(--primary-color);
    --h3-font-weight: var(--e-global-typography-8008c0d-font-weight);

    /* --h4-font-size: var(--e-global-typography-eb707fb-font-size);
    --h4-line-height: var(--e-global-typography-eb707fb-line-height);
    --h4-font-family: var(--e-global-typography-eb707fb-font-family), Sans-serif;
    --h4-default-color: var(--primary-color);
    --h4-font-weight: var(--e-global-typography-eb707fb-font-weight); */

    /*
     * Outer Elementor container paddings 
     * Using clamp() to set a minimum and maximum padding value
     * the clamp calculator can be found here: https://www.marcbacon.com/tools/clamp-calculator/
    */
    --content-padding: clamp(20px, calc(1.25rem + ((1vw - 4.8px) * 0.6061)), 24px);

    /* Deafault section paddings */
    --section-padding-top: 80px;
    --section-padding-bottom: 80px;
    --section-padding-top-tablet: 50px;
    --section-padding-bottom-tablet: 50px;
    --section-padding-top-mobile: 30px;
    --section-padding-bottom-mobile: 30px;

    /* Additional variables */
    
    /* Boxes */
    --default-border-radius: clamp(25px, calc(1.5625rem + ((1vw - 4.8px) * 0.5208)), 30px);
    
}