/* ============================================
   AVANTCHA THEME 3.0
   Component: Avantcha Custom Vars
============================================ */
/* ORIGINAL — commented out
:root {
    --font-family-sans: "Gotham SSm A", "Gotham SSm B", "Montserrat", sans-serif;
    --font-family-serif: "Swift", Georgia, serif;

    --color-body: #323338;
    --color-darkbody: #1A1A1A;
    --color-subheadings: #2F2F2F;
    --color-price: #808284;
    --color-captions: #6E6E6E;
    --color-link: #808284;
    --color-link-hover: #323338;

    --color-darkgrey: #717173;
    --color-mediumgrey: #B8B8B8;
    --color-grey: #E5E5E5;
    --color-lightgrey: #F0F0F0;
    --color-lightergrey: #F4F4F4;
    --color-offwhite: #FAFAFA;
    --color-success-bg: #B8DA87;
    --color-success-fg: #323338;
    --color-error-bg: #E64040;
    --color-error-fg: #FFF;

    --color-button-dark-bg: var(--color-darkbody);
    --color-button-dark-fg: #e8e8e8;
    --color-button-light-bg: white;
    --color-button-light-fg: var(--color-darkbody);
    --color-button-light-bg: white;
    --color-button-light-bg-2: var(--color-body);
    --color-button-light-fg-2: var(--color-grey);

    --color-border-dark: var(--color-darkbody);
    --color-border-grey: var(--color-grey);
    --color-border-light: var(--color-lightgrey);
    --color-border-white: white;

    --color-icons-header: var(--color-link);
    --color-icons-dark: var(--color-darkbody);
    --color-icons-grey: var(--color-grey);
    --color-icons-light: var(--color-offwhite);
    --color-icons-white: white;

    --base-font-size: clamp(0.938rem, 0.915rem + 0.114vw, 1rem);
    --font-size-xxs: clamp(0.71875rem, 0.7009rem + 0.0893vw, 0.78125rem);
    --font-size-xs: clamp(0.75rem, 0.732rem + 0.0893vw, 0.8125rem);
    --font-size-s: clamp(0.844rem, 0.813rem + 0.15vw, 0.938rem);
    --font-size-r: clamp(0.938rem, 0.915rem + 0.114vw, 1rem);
    --font-size-h1: clamp(2.125rem, 1.557rem + 2.84vw, 3.125rem);
    --font-size-h2: clamp(1.75rem, 1.432rem + 1.591vw, 2.375rem);
    --font-size-h3: clamp(1.375rem, 1.239rem + 0.682vw, 1.625rem);
    --font-size-h4: clamp(1.25rem, 1.182rem + 0.341vw, 1.375rem);
    --font-size-h5: clamp(1.125rem, 1.057rem + 0.341vw, 1.25rem);
    --font-size-h6: clamp(1rem, 0.932rem + 0.341vw, 1.125rem);
    --font-size-product-title: clamp(1.75rem, 1.364rem + 1.932vw, 2.5rem);
    --line-height-default: 1.4em;
    --line-height-small: 1.2em;
    --font-size-caption: var(--font-size-xs);
    --minimum-font-size: var(--font-size-xxs);

    --body1-font-size: var(--font-size-h4);
    --body2-font-size: var(--font-size-h5);
    --body3-font-size: var(--font-size-h6);
    --body4-font-size: var(--base-font-size);
    --body5-font-size: clamp(0.8125rem, 0.795rem + 0.0893vw, 0.875rem);
    --body6-font-size: var(--minimum-font-size);

    --h1-font-size: var(--font-size-h1);
    --h2-font-size: var(--font-size-h2);
    --h3-font-size: var(--font-size-h3);
    --h4-font-size: var(--font-size-h4);
    --h5-font-size: var(--font-size-h5);
    --h6-font-size: var(--font-size-h6);

    --title1-font-size: var(--h1-font-size);
    --title2-font-size: var(--h2-font-size);
    --title3-font-size: var(--h3-font-size);
    --title4-font-size: var(--h4-font-size);
    --title5-font-size: var(--h5-font-size);
    --title6-font-size: var(--h6-font-size);

    --title0-font-size: var(--h1-font-size);

    --letter-spacing-small: 0.1em;
    --letter-spacing-big: 0.2em;

    --shadow-s: 0px 0px 10px 2px rgba(0, 0, 0, 0.09);
    --shadow-m: 0px 0px 30px rgba(0, 0, 0, 0.13);
    --shadow-l: 0 10px 50px 10px rgba(0, 0, 0, 0.1);
    --shadow-product-item: 0px 0px 30px 0px rgba(0, 0, 0, 0.1);

    --size-default: 12px;
    --size-4: 4px;
    --size-8: 8px;
    --size-12: 12px;
    --size-16: 16px;
    --size-20: 20px;
    --size-24: 24px;
    --size-28: 28px;
    --size-32: 32px;
    --size-36: 36px;
    --size-40: 40px;
    --size-44: 40px;
    --size-48: 48px;
    --size-52: 52px;
    --size-56: 56px;
    --size-60: 60px;
    --size-64: 64px;
    --size-68: 68px;
    --size-72: 72px;
    --size-76: 76px;
    --size-80: 80px;
    --size-84: 84px;
    --size-88: 78px;
    --size-92: 92px;

    --button-padding: var(--size-12) var(--size-20);
    --padding-xy-xs: var(--size-12) var(--size-20);
    --padding-xy-s: var(--size-20) var(--size-32);
    --padding-xy-m: var(--size-28) var(--size-40);
    --padding-xy-l: var(--size-36) var(--size-48);
    --padding-xy-xl: var(--size-40) var(--size-52);

    --zindex-s: 100;
    --zindex-m: 400;
    --zindex-l: 800;
    --zindex-xl: 2000;
    --zindex-xxl: 5000;

    --radius-1: 2px;
    --radius-2: 6px;

    --font-weight-light: 300;
    --font-weight-regular: 400;
    --font-weight-medium: 500;
    --font-weight-bold: 700;

    --speed-fast: 150ms;
    --speed-slow: 250ms;
    --speed-slower: 400ms;
    --animation-rotate-degree: -270deg;

    --motion-ease: cubic-bezier(0.22, 1, 0.36, 1);
    --motion-ease-in: cubic-bezier(0.4, 0, 0.6, 1);

    --popup-size-desktop-max: 85%;
    --popup-size-desktop-min: 800px;
    --popup-size-desktop-default: 800px;
    --popup-size-mobile-max: 90%;
    --popup-size-mobile-min: 85%;

    --width-max: 1500px;
    --width-max-plp: 1600px;
    --width-semilarge: 94%;
    --width-large: 90%;
    --width-medium: 80%;
    --width-small: 76%;
    --width-mini: 40%;
}
*/

/* UPDATED — base-font-size, h1, h2, h3 shifted smaller, then bumped back up about halfway toward original */
:root {
    --font-family-sans: "Gotham SSm A", "Gotham SSm B", "Montserrat", sans-serif;
    --font-family-serif: "Swift", Georgia, serif;

    --color-body: #323338;
    --color-darkbody: #1A1A1A;
    --color-subheadings: #2F2F2F;
    --color-price: #808284;
    --color-captions: #6E6E6E;
    --color-link: #808284;
    --color-link-hover: #323338;

    --color-darkgrey: #717173;
    --color-mediumgrey: #B8B8B8;
    --color-grey: #E5E5E5;
    --color-lightgrey: #F0F0F0;
    --color-lightergrey: #F4F4F4;
    --color-offwhite: #FAFAFA;
    --color-success-bg: #B8DA87;
    --color-success-fg: #323338;
    --color-error-bg: #E64040;
    --color-error-fg: #FFF;

    --color-button-dark-bg: var(--color-darkbody);
    --color-button-dark-fg: #e8e8e8;
    --color-button-light-bg: white;
    --color-button-light-fg: var(--color-darkbody);
    --color-button-light-bg: white;
    --color-button-light-bg-2: var(--color-body);
    --color-button-light-fg-2: var(--color-grey);

    --color-border-dark: var(--color-darkbody);
    --color-border-grey: var(--color-grey);
    --color-border-light: var(--color-lightgrey);
    --color-border-white: white;

    --color-icons-header: var(--color-link);
    --color-icons-dark: var(--color-darkbody);
    --color-icons-grey: var(--color-grey);
    --color-icons-light: var(--color-offwhite);
    --color-icons-white: white;

    --base-font-size: clamp(0.891rem, 0.864rem + 0.132vw, 0.969rem);
    --font-size-xxs: clamp(0.71875rem, 0.7009rem + 0.0893vw, 0.78125rem);
    --font-size-xs: clamp(0.75rem, 0.732rem + 0.0893vw, 0.8125rem);
    --font-size-s: clamp(0.844rem, 0.813rem + 0.15vw, 0.938rem);
    --font-size-r: clamp(0.891rem, 0.864rem + 0.132vw, 0.969rem);
    --font-size-h1: clamp(1.938rem, 1.495rem + 2.216vw, 2.75rem);
    --font-size-h2: clamp(1.563rem, 1.336rem + 1.137vw, 2rem);
    --font-size-h3: clamp(1.313rem, 1.211rem + 0.512vw, 1.5rem);
    --font-size-h4: clamp(1.25rem, 1.182rem + 0.341vw, 1.375rem);
    --font-size-h5: clamp(1.125rem, 1.057rem + 0.341vw, 1.25rem);
    --font-size-h6: clamp(1rem, 0.932rem + 0.341vw, 1.125rem);
    --font-size-product-title: clamp(1.75rem, 1.364rem + 1.932vw, 2.5rem);
    --line-height-default: 1.4em;
    --line-height-small: 1.2em;
    --font-size-caption: var(--font-size-xs);
    --minimum-font-size: var(--font-size-xxs);

    --body1-font-size: var(--font-size-h4);
    --body2-font-size: var(--font-size-h5);
    --body3-font-size: var(--font-size-h6);
    --body4-font-size: var(--base-font-size);
    --body5-font-size: clamp(0.8125rem, 0.795rem + 0.0893vw, 0.875rem);
    --body6-font-size: var(--minimum-font-size);

    --h1-font-size: var(--font-size-h1);
    --h2-font-size: var(--font-size-h2);
    --h3-font-size: var(--font-size-h3);
    --h4-font-size: var(--font-size-h4);
    --h5-font-size: var(--font-size-h5);
    --h6-font-size: var(--font-size-h6);

    --title1-font-size: var(--h1-font-size);
    --title2-font-size: var(--h2-font-size);
    --title3-font-size: var(--h3-font-size);
    --title4-font-size: var(--h4-font-size);
    --title5-font-size: var(--h5-font-size);
    --title6-font-size: var(--h6-font-size);

    --title0-font-size: var(--h1-font-size);

    --letter-spacing-small: 0.1em;
    --letter-spacing-big: 0.2em;

    --shadow-s: 0px 0px 10px 2px rgba(0, 0, 0, 0.09);
    --shadow-m: 0px 0px 30px rgba(0, 0, 0, 0.13);
    --shadow-l: 0 10px 50px 10px rgba(0, 0, 0, 0.1);
    --shadow-product-item: 0px 0px 40px 0px rgba(0, 0, 0, 0.05);

    --size-default: 12px;
    --size-4: 4px;
    --size-8: 8px;
    --size-12: 12px;
    --size-16: 16px;
    --size-20: 20px;
    --size-24: 24px;
    --size-28: 28px;
    --size-32: 32px;
    --size-36: 36px;
    --size-40: 40px;
    --size-44: 40px;
    --size-48: 48px;
    --size-52: 52px;
    --size-56: 56px;
    --size-60: 60px;
    --size-64: 64px;
    --size-68: 68px;
    --size-72: 72px;
    --size-76: 76px;
    --size-80: 80px;
    --size-84: 84px;
    --size-88: 78px;
    --size-92: 92px;

    --button-padding: var(--size-12) var(--size-20);
    --padding-xy-xs: var(--size-12) var(--size-20);
    --padding-xy-s: var(--size-20) var(--size-32);
    --padding-xy-m: var(--size-28) var(--size-40);
    --padding-xy-l: var(--size-36) var(--size-48);
    --padding-xy-xl: var(--size-40) var(--size-52);

    --zindex-s: 100;
    --zindex-m: 400;
    --zindex-l: 800;
    --zindex-xl: 2000;
    --zindex-xxl: 5000;

    --radius-1: 2px;
    --radius-2: 6px;

    --font-weight-light: 300;
    --font-weight-regular: 400;
    --font-weight-medium: 500;
    --font-weight-bold: 700;

    --speed-fast: 150ms;
    --speed-slow: 250ms;
    --speed-slower: 400ms;
    --animation-rotate-degree: -270deg;

    --motion-ease: cubic-bezier(0.22, 1, 0.36, 1);
    --motion-ease-in: cubic-bezier(0.4, 0, 0.6, 1);

    --popup-size-desktop-max: 85%;
    --popup-size-desktop-min: 800px;
    --popup-size-desktop-default: 800px;
    --popup-size-mobile-max: 90%;
    --popup-size-mobile-min: 85%;

    --width-max: 1500px;
    --width-max-plp: 1600px;
    --width-semilarge: 94%;
    --width-large: 90%;
    --width-medium: 80%;
    --width-small: 76%;
    --width-mini: 40%;
}


@media (max-width: 767px) {
    :root {
        --base-font-size: 14px;

        --h1-font-size: 3rem;
        --h2-font-size: 2.5rem;
        --h3-font-size: 2rem;
        --h4-font-size: 1.5rem;
        --h5-font-size: 1.5rem;
        --h6-font-size: 1.2rem;
        --width-semilarge: 95%;
        --width-large: 95%;
        --width-medium: 95%;        
        --width-mini: 95%;
    }
}