@import url(/fonts/TTHovesProAll/stylesheet.css);
@import "tailwindcss";

body {
  font-family: "TTHovesPro", sans-serif;
  background-color: #ffffff;
  color: #141414;
}

button:enabled {
  cursor: pointer;
}

button:disabled {
  cursor: default;
}

@layer utilities {
  .text-xs {
    font-size: 12px;
    line-height: 110%;
  }

  @media (min-width: 1536px) {
    .text-xs {
      font-size: 0.833vw;
    }
  }
}

@utility title-l {
  @apply 2xl:text-[1.667vw] text-[24px] leading-[120%];
}

@utility title-m {
  @apply 2xl:text-[1.389vw] text-[20px] leading-[110%];
}

@utility title-s {
  @apply 2xl:text-[1.111vw] text-[16px] leading-[110%];
}

@utility text-m {
  @apply 2xl:text-[1.111vw] text-[16px] leading-[120%];
}

@utility text-s {
  @apply 2xl:text-[0.972vw] text-[14px] leading-[110%];
}

@utility button-m {
  @apply 2xl:text-[0.972vw] text-[14px] leading-[110%];
}

@utility button-s {
  @apply 2xl:text-[0.833vw] text-[12px] leading-[110%];
}

@utility caption-m {
  @apply 2xl:text-[0.972vw] text-[14px] leading-[120%];
}

@utility caption-s {
  @apply 2xl:text-[0.833vw] text-[12px] leading-[120%];
}

@utility caption-xs {
  @apply 2xl:text-[0.694vw] text-[10px] leading-[120%];
}
