@font-face {   font-family: 'Verveine';   font-weight: 400;   font-style: normal;   font-display: swap;   src: url("//www.les2marmottes.com/cdn/shop/files/VerveineRegular.woff2?v=15191088029935684599") format("woff2");  }   @font-face {   font-family: 'Montserrat';   font-weight: 400 700;   font-style: normal;   font-display: swap;   src: url("//www.les2marmottes.com/cdn/shop/files/Montserrat.woff2?v=14546620988113616257") format("woff2-variations");  }   @font-face {   font-family: 'Montserrat';   font-weight: 400 700;   font-style: italic;   font-display: swap;   src: url("//www.les2marmottes.com/cdn/shop/files/Montserrat-Italic.woff2?v=17987897098655707750") format("woff2-variations");  }    :root {     /**      * ---------------------------------------------------------------------      * SPACING VARIABLES      *      * We are using a spacing inspired from frameworks like Tailwind CSS.      * ---------------------------------------------------------------------      */     --spacing-0-5: 0.125rem; /* 2px */     --spacing-1: 0.25rem; /* 4px */     --spacing-1-5: 0.375rem; /* 6px */     --spacing-2: 0.5rem; /* 8px */     --spacing-2-5: 0.625rem; /* 10px */     --spacing-3: 0.75rem; /* 12px */     --spacing-3-5: 0.875rem; /* 14px */     --spacing-4: 1rem; /* 16px */     --spacing-4-5: 1.125rem; /* 18px */     --spacing-5: 1.25rem; /* 20px */     --spacing-5-5: 1.375rem; /* 22px */     --spacing-6: 1.5rem; /* 24px */     --spacing-6-5: 1.625rem; /* 26px */     --spacing-7: 1.75rem; /* 28px */     --spacing-7-5: 1.875rem; /* 30px */     --spacing-8: 2rem; /* 32px */     --spacing-8-5: 2.125rem; /* 34px */     --spacing-9: 2.25rem; /* 36px */     --spacing-9-5: 2.375rem; /* 38px */     --spacing-10: 2.5rem; /* 40px */     --spacing-11: 2.75rem; /* 44px */     --spacing-12: 3rem; /* 48px */     --spacing-14: 3.5rem; /* 56px */     --spacing-16: 4rem; /* 64px */     --spacing-18: 4.5rem; /* 72px */     --spacing-20: 5rem; /* 80px */     --spacing-24: 6rem; /* 96px */     --spacing-28: 7rem; /* 112px */     --spacing-32: 8rem; /* 128px */     --spacing-36: 9rem; /* 144px */     --spacing-40: 10rem; /* 160px */     --spacing-44: 11rem; /* 176px */     --spacing-48: 12rem; /* 192px */     --spacing-52: 13rem; /* 208px */     --spacing-56: 14rem; /* 224px */     --spacing-60: 15rem; /* 240px */     --spacing-64: 16rem; /* 256px */     --spacing-72: 18rem; /* 288px */     --spacing-80: 20rem; /* 320px */     --spacing-96: 24rem; /* 384px */    --gradient-yellow: linear-gradient(90deg, #FFE267 0%, #FFA57B 100%);   --gradient-yellow-hover: linear-gradient(90deg, #FDDA46 0%, #FF996A 100%);      /* Container */     --container-max-width: 1600px;     --container-narrow-max-width: 1350px;     --container-gutter: var(--spacing-5);     --section-outer-spacing-block: var(--spacing-10);     --section-inner-max-spacing-block: var(--spacing-9);     --section-inner-spacing-inline: var(--container-gutter);     --section-stack-spacing-block: var(--spacing-8);      /* Grid gutter */     --grid-gutter: var(--spacing-5);      /* Product list settings */     --product-list-row-gap: var(--spacing-8);     --product-list-column-gap: var(--grid-gutter);      /* Form settings */     --input-gap: var(--spacing-2);     --input-height: 2.625rem;     --input-padding-inline: var(--spacing-4);      /* Other sizes */     --sticky-area-height: calc(var(--sticky-announcement-bar-enabled, 0) * var(--announcement-bar-height, 0px) + var(--sticky-header-enabled, 0) * var(--header-height, 0px));      /* RTL support */     --transform-logical-flip: 1;     --transform-origin-start: left;     --transform-origin-end: right;      /**      * ---------------------------------------------------------------------      * TYPOGRAPHY      * ---------------------------------------------------------------------      */      /* Font properties */     --heading-font-family: 'Montserrat', sans-serif;     --heading-font-weight: 700;     --heading-font-style: normal;     --heading-text-transform: normal;     --heading-letter-spacing: 0;     --text-font-family: 'Montserrat', sans-serif;     --text-font-weight: 400;     --text-font-style: normal;     --text-letter-spacing: 0;   --text-font-alternative: 'Verveine', sans-serif;      /* Font sizes */     --text-h0: 3rem;     --text-h1: 2.25rem;     --text-h2: 1.75rem;     --text-h3: 0.875rem;     --text-h4: 1rem;     --text-h5: 1.125rem;     --text-h6: 1rem;     --text-xs: 0.6875rem;     --text-sm: 0.75rem;     --text-base: 0.875rem;     --text-lg: 1.125rem;      /**      * ---------------------------------------------------------------------      * COLORS      * ---------------------------------------------------------------------      */      /* Color settings */--accent: 255 255 255;     --text-primary: 0 0 0;     --background-primary: 254 249 240;     --dialog-background: 254 249 240;     --border-color: var(--text-color, var(--text-primary)) / 0.12;      /* Button colors */     --button-background-primary: 255 255 255;     --button-text-primary: 0 0 0;     --button-background-secondary: 255 226 103;     --button-text-secondary: 0 0 0;      /* Status colors */     --success-background: 224 244 232;     --success-text: 0 163 65;     --warning-background: 255 246 233;     --warning-text: 255 183 74;     --error-background: 254 231 231;     --error-text: 248 58 58;      /* Product colors */     --on-sale-text: 209 116 46;     --on-sale-badge-background: 209 116 46;     --on-sale-badge-text: 255 255 255;     --sold-out-badge-background: 0 0 0;     --sold-out-badge-text: 255 255 255;     --primary-badge-background: 129 190 102;     --primary-badge-text: 0 0 0;     --star-color: 255 220 21;     --product-card-background: 255 255 255;     --product-card-text: 0 0 0;      /* Header colors */     --header-background: 254 249 240;     --header-text: 0 0 0;      /* Footer colors */     --footer-background: 255 226 103;     --footer-text: 0 0 0;      /* Rounded variables (used for border radius) */     --rounded-xs: 0.25rem;     --rounded-sm: 0.3125rem;     --rounded: 0.625rem;     --rounded-lg: 1.25rem;     --rounded-full: 9999px;      --rounded-button: 1.875rem;     --rounded-input: 0.625rem;      /* Box shadow */     --shadow-sm: 0 2px 8px rgb(var(--text-primary) / 0.0);     --shadow: 0 5px 15px rgb(var(--text-primary) / 0.0);     --shadow-md: 0 5px 30px rgb(var(--text-primary) / 0.0);     --shadow-block: 0px 18px 50px rgb(var(--text-primary) / 0.0);      /**      * ---------------------------------------------------------------------      * OTHER      * ---------------------------------------------------------------------      */      --stagger-products-reveal-opacity: 0;     --cursor-close-svg-url: url(//www.les2marmottes.com/cdn/shop/t/5/assets/cursor-close.svg?v=147174565022153725511751546574);     --cursor-zoom-in-svg-url: url(//www.les2marmottes.com/cdn/shop/t/5/assets/cursor-zoom-in.svg?v=154953035094101115921751546574);     --cursor-zoom-out-svg-url: url(//www.les2marmottes.com/cdn/shop/t/5/assets/cursor-zoom-out.svg?v=16155520337305705181751546574);     --checkmark-svg-url: url(//www.les2marmottes.com/cdn/shop/t/5/assets/checkmark.svg?v=5085511394707007931751546575);   }    [dir="rtl"]:root {     /* RTL support */     --transform-logical-flip: -1;     --transform-origin-start: right;     --transform-origin-end: left;   }    @media screen and (min-width: 700px) {     :root {       /* Typography (font size) */       --text-h0: 4rem;       --text-h1: 3.75rem;       --text-h2: 2.5rem;       --text-h3: 1rem;       --text-h4: 1.125rem;       --text-h5: 1.25rem;       --text-h6: 1.125rem;        --text-xs: 0.6875rem;       --text-sm: 0.75rem;       --text-base: 0.875rem;       --text-lg: 1.125rem;        /* Spacing */       --container-gutter: 2.813rem;       --section-outer-spacing-block: 2.813rem;       --section-inner-max-spacing-block: var(--spacing-10);       --section-inner-spacing-inline: var(--spacing-12);       --section-stack-spacing-block: var(--spacing-10);        /* Grid gutter */       --grid-gutter: var(--spacing-5);        /* Product list settings */       --product-list-row-gap: var(--spacing-5);        /* Form settings */       --input-gap: 1rem;       --input-height: 3.125rem;       --input-padding-inline: var(--spacing-5);     }   }    @media screen and (min-width: 1000px) {     :root {       /* Spacing settings */       --container-gutter: 2.813rem;       --section-outer-spacing-block: 2.813rem;       --section-inner-max-spacing-block: var(--spacing-14);       --section-inner-spacing-inline: var(--spacing-16);       --section-stack-spacing-block: var(--spacing-10);     }   }    @media screen and (min-width: 1150px) {     :root {       /* Spacing settings */       --container-gutter: 2.813rem;       --section-outer-spacing-block: 2.813rem;       --section-inner-max-spacing-block: var(--spacing-14);       --section-inner-spacing-inline: var(--spacing-16);       --section-stack-spacing-block: var(--spacing-10);     }   }    @media screen and (min-width: 1400px) {     :root {       /* Typography (font size) */       --text-h0: 4rem;       --text-h1: 3.75rem;       --text-h2: 2.5rem;       --text-h3: 1rem;       --text-h4: 1.125rem;       --text-h5: 1.25rem;       --text-h6: 1.125rem;           --section-inner-max-spacing-block: var(--spacing-16);       --section-inner-spacing-inline: var(--spacing-18);     }   }    @media screen and (min-width: 1600px) {     :root {       --section-inner-max-spacing-block: var(--spacing-18);       --section-inner-spacing-inline: var(--spacing-20);     }   }    /**    * ---------------------------------------------------------------------    * LIQUID DEPENDANT CSS    *    * Our main CSS is Liquid free, but some very specific features depend on    * theme settings, so we have them here    * ---------------------------------------------------------------------    */@media screen and (pointer: fine) {         /* The !important are for the Shopify Payment button to ensure we override the default from Shopify styles */         .button:not([disabled]):not(.button--outline):hover, .btn:not([disabled]):hover, .shopify-payment-button__button--unbranded:not([disabled]):hover {           background: var(--gradient-yellow-hover) !important;           color: rgb(var(--button-text-color)) !important;         }          .button--outline:not([disabled]):hover {           background: rgb(var(--button-background));           color: rgb(var(--button-text-color));           box-shadow: inset 0 0 0 2px rgb(var(--button-background));         }       }