:root {
  --primary: #efb100;
  --on-primary: var(--black);
  --secondary: #704500;
  --on-secondary: var(--white);
  --white: #F0F0E8;
  --on-white: var(--black);
  --black: #000000;
  --on-black: var(--primary);
  --border-radius: 1em;
  --border-radius-button: 0px;
  --transition: all 0.3s ease-in-out;

  /* -------------------------------------------------------------------------- */
  /*                                 TIPOGRAFÍA                                 */
  /* -------------------------------------------------------------------------- */
  --base-line-height: 1.2em;
  --font-weight-title: 400;
  --letter-spacing: 0;
  --fs-xxl: clamp(48px, 2rem + 4vw, 80px);     /* h1 home */
  --fs-xl:  clamp(30px, 1.5rem + 2.8vw, 60px); /* h1/h2 */
  --fs-lg:  clamp(28px, 1.25rem + 1.8vw, 45px);/* h3 (45) */
  --fs-lg2: clamp(28px, 1.25rem + 1.4vw, 40px);/* h3 (40) */
  --fs-md:  clamp(20px, 1rem + 0.9vw, 28px);   /* h4 (28) */
  --fs-sm:  clamp(20px, 1rem + 0.65vw, 25px);  /* h4 (25) */
  --fs-xs:  clamp(16px, 0.9rem + 0.20vw, 18px);/* body/small */
  --fs-xxs: clamp(14px, 0.8rem + 0.15vw, 16px);/* labels */
}