@font-face {
    font-family: "Clarins Unlimited Regular";
    src: local("ClarinsUnlimited-Regular"), url("../fonts/ClarinsUnlimited-Regular.woff2");
  }
  
  @font-face {
    font-family: "Gotham Light";
    src: local("GothamLight"), url("../fonts/GothamLight.eot"), url("../fonts/GothamLight.eot") format("embedded-opentype"), url("../fonts/GothamLight.woff2") format("woff2"), url("../fonts/GothamLight.woff") format("woff"), url("../fonts/GothamLight.ttf") format("truetype"), url("../fonts/GothamLight.svg#GothamLight") format("svg");
    font-weight: 100;
  }
  
  :root {
    ---RED-CLARINS: #b40024;
    ---DARK-RED: #8c0c26;
    ---ROSEWOOD: #63021a;
    ---CLARINS-CHARCOAL: #333;
    ---RANDOM-COLOR-A: #ded0e9;
    ---RANDOM-COLOR-B: #dbb8ca;
    ---RANDOM-COLOR-C: #f64d10;
    ---RANDOM-COLOR-D: #99004f;
    ---RANDOM-COLOR-E: #817fcb;
    ---RANDOM-COLOR-F: #ffe4c6;
    ---RANDOM-COLOR-G: #e35b00;
    ---COLOR-PINK: #f44ba0;
    ---COLOR-CREAM: #fdfdfd;
    ---COLOR-GREY: #cfcac9;
    ---COLOR-LIGHT-PINK: #fcf1f6;
    ---CLARINS-FONT: "ClarinsRegular", "Clarins";
    ---GOTHAM-BOOK: "Gotham SSm book A", "Gotham SSm book B", Helvetica, Arial, sans-serif;
    ---GOTHAM-MEDIUM: "Gotham SSm medium A", "Gotham SSm medium B", Helvetica, Arial, sans-serif;
    ---UNLIMITED: "Clarins Unlimited Regular";
    ---GOTHAM-LIGHT: "Gotham Light";
    ---HEADER-HEIGHT: 48px;
    ---MARGIN-SECTION: 64px;
    ---MARGIN-CLASSIC: 24px;
    ---CLARINS-CONTAINER: 1250px;
  }
  
  @media screen and (min-width: 1024px) {
    :root {
      ---HEADER-HEIGHT: 113px;
    }
  }
  

html {
    scroll-behavior: smooth;
  }