:root {
  --c-black: #000000;
  --c-moss: #192e1d;
  --c-light-stone: #fff8e4;
  --c-stone: #f5e5b9;
  --c-paper: rgba(245, 229, 185, 0.5);
  --c-outline: rgba(112, 78, 45, 0.3);
  --c-grass: #5e6d3f;
  --c-dark-brown: #1b0a02;
  --c-oak-text: #704e2d;
  --c-light-oak-text: #c9bba9;
  --c-copy: #ab9172;
  --c-oak: #b48a61;
  --c-terracotta: #d36d40;
  --c-brick: #8a291b;
  --c-indigo: #380ca1;
  --c-steel: #7e9ecb;
  --c-input-field-hover: #ede6d0;

  --color-primary: var(--c-copy);
  --color-secondary: var(--c-moss);

  --color-text: var(--c-oak-text);
  --color-text-light: var(--c-copy);
  --color-text-white: var(--c-stone);

  --color-bg: var(--c-stone);
  --color-bg-light: var(--c-light-stone);
  --color-bg-dark: var(--c-moss);

  --color-border: var(--c-copy);
  --color-border-light: var(--c-copy);

  --font-size: clamp(16px, 1.05vw, 3vw);
  --fs-small: var(--fs-12);
  --fs-medium: var(--fs-20);
  --fs-large: var(--fs-25);
  --fs-xlarge: var(--fs-40);
  --fs-xxlarge: var(--fs-50);
  --small-spacing: var(--fluid-5);
  --half-spacing: var(--fluid-10);
  --normal-spacing: var(--fluid-20);
  --normal-gap: var(--fluid-20);
  --medium-spacing: var(--fluid-40);
  --big-spacing: var(--fluid-120);
  --paragraph-spacing-bottom: var(--fluid-20);
  --loader-width: 10rem;
  --button-padding-horizontal: 2rem;
  --button-padding-vertical: 0.75vw;

  --fluid-3: 0.1875rem;
  --fluid-5: 0.31rem;
  --fluid-7: 0.4375rem;
  --fluid-8: 0.5rem;
  --fluid-10: 0.625rem;
  --fluid-12: 0.75rem;
  --fluid-15: 0.9375rem;
  --fluid-16: 1rem;
  --fluid-18: 1.125rem;
  --fluid-19: 1.1875rem;
  --fluid-20: 1.25rem;
  --fluid-25: 1.5625rem;
  --fluid-30: 1.875rem;
  --fluid-32: 2rem;
  --fluid-35: 2.1875rem;
  --fluid-36: 2.25rem;
  --fluid-40: 2.5rem;
  --fluid-45: 2.8125rem;
  --fluid-50: 3.125rem;
  --fluid-60: 3.75rem;
  --fluid-75: 4.6875rem;
  --fluid-80: 5rem;
  --fluid-90: 5.625rem;
  --fluid-100: 6.25rem;
  --fluid-120: 7.5rem;
  --fluid-150: 9.375rem;

  /* Text-size styles */
  --fs-10: max(16px, 0.625rem);
  --fs-12: max(16px, 0.75rem);
  --fs-13: clamp(13px, 0.852vw, 2.4375vw);
  --fs-14: clamp(14px, 0.91875vw, 2.625vw);
  --fs-15: clamp(15px, 0.984375vw, 2.8125vw);
  --fs-16: clamp(16px, 1.05vw, 3vw);
  --fs-18: clamp(18px, 1.181vw, 3.375vw);
  --fs-20: clamp(20px, 1.3125vw, 3.75vw);
  --fs-24: clamp(24px, 1.575vw, 4.5vw);
  --fs-25: 1.5625rem;
  --fs-26: clamp(26px, 1.7vw, 4.875vw);
  --fs-28: clamp(28px, 1.8375vw, 5.25vw);
  --fs-32: clamp(32px, 2.1vw, 6vw);
  --fs-36: clamp(36px, 2.3625vw, 6.75vw);
  --fs-40: clamp(40px, 2.625vw, 7.5vw);
  --fs-44: clamp(44px, 2.8875vw, 8.25vw);
  --fs-48: clamp(48px, 3.15vw, 9vw);
  --fs-50: 3.125rem;
  --fs-52: clamp(52px, 3.4125vw, 9.75vw);
  --fs-55: 3.4375rem;
  --fs-58: clamp(58px, 3.806vw, 10.875vw);
  --fs-60: clamp(60px, 3.9375vw, 11.25vw);
  --fs-62: clamp(62px, 4.0725vw, 11.625vw);
  --fs-66: clamp(66px, 4.33125vw, 12.375vw);
  --fs-70: clamp(70px, 4.6875vw, 13.125vw);
  --fs-80: 5rem;
  --fs-90: clamp(90px, 5.906vw, 16.875vw);
  --fs-100: clamp(100px, 6.5625vw, 18.75vw);

  /* Font-size styles */
  --fs-button-text: var(--font-size);
  --fs-link-text: var(--fs-26);
  --fs-name-title: var(--fs-20);

  /* Large styles */
  --fs-L-quote-text: var(--fs-18);
  --fs-L-small-caption: var(--fs-20);

  --fs-L-display-1: var(--fs-60);
  --fs-L-display-2: var(--fs-66);

  --fs-L-H1-M: var(--fs-62);
  --fs-L-H2-XL: var(--fs-100);
  --fs-L-H2-M: var(--fs-90);
  --fs-L-H2-S: var(--fs-60);
  --fs-L-H2-XS: var(--fs-40);
  --fs-L-H2-XXS: var(--fs-32);
  --fs-L-H3-L: var(--fs-58);
  --fs-L-H3-M: var(--fs-44);
  --fs-L-H4-XL: var(--fs-52);
  --fs-L-H4-L: var(--fs-32);
  --fs-L-H4-SM: var(--fs-20);

  --fs-L-body-XL: var(--fs-48);
  --fs-L-body-M: var(--fs-24);
  --fs-L-body-Regular: var(--fs-18);
  --fs-L-body-SM: var(--fs-15);
  --fs-L-body-XS: var(--fs-13);

  --fs-L-Overline-L: var(--fs-32);
  --fs-L-Overline-SM: var(--fs-14);

  /* Small styles */
  --fs-S-small-caption: var(--fs-16);

  --fs-S-H1-L: var(--fs-60);
  --fs-h1-other: clamp(60px, 5.3125vw, 12.5vw);
  --fs-S-H1-M: var(--fs-44);
  --fs-S-H1-SM: var(--fs-40);
  --fs-S-H2-L: var(--fs-62);
  --fs-S-H2-M: var(--fs-40);
  --fs-S-H2-SM: var(--fs-24);
  --fs-S-H3-XL: var(--fs-40);
  --fs-S-H3-L: var(--fs-32);
  --fs-S-H3-SM: var(--fs-28);
  --fs-S-H4-L: var(--fs-28);
  --fs-S-H4-SM: var(--fs-18);
  --fs-S-body-XL: var(--fs-36);
  --fs-S-body-M: var(--fs-16);
  --fs-S-body-SM: var(--fs-13);

  --fs-flyout-navigation-text : 6.625rem;

  /* Spacing styles */
  --spacing-big-section-block: 6rem;
  --spacing-small-section-block: 3.75rem;
  --spacing-xs-section-block: 1.3rem;

  --mobile-max-width: calc(100% - 32px);

  /* ------------------------------------------------------------ */
  /*                        RESPONSIVE                            */
  /* ------------------------------------------------------------ */
  @media (max-width: 768px) {
    /* Spacing styles */
    --spacing-big-section-block: 2.5rem;
  }
}