@import url("https://fonts.googleapis.com/css2?family=Manrope:wght@200;300;400;500;600;700;800");
@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700");

@font-face {
  font-family: "Tiempos Text";
  src: url("/_static/fonts/tiempos/tiempos-text-regular.woff2") format("woff2");
  font-weight: 400;
}

@font-face {
  font-family: "Founders Grotesk Mono";
  src: url("/_static/fonts/founders/founders-grotesk-mono-regular.woff2")
    format("woff2");
  font-weight: 400;
}

:root {
  --bs-font-manrope: "Manrope", sans-serif;
  --bs-font-founders: "Founders Grotesk Mono";

  --manrope-92: calc(3.2rem + 1vw);
  --manrope-60: calc(2.5rem + 0.8vw);
  --manrope-30: calc(1.2rem + 0.4vw);
  --manrope-23: 1.2rem;
  --manrope-18: 0.9rem;
  --manrope-16: 0.8rem;
  --manrope-12: 0.65rem;

  --tiempos-30: 1.5rem;
  --tiempos-18: 0.75rem;
  --tiempos-16: 0.7rem;

  --founders-16: 0.7rem;
  --founders-12: 0.6rem;
  --founders-11: 0.55rem;
}

/* Primary headline - display */
/* Secondary headline - secondary */
/* Subhead - subhead */
/* Caption - caption */
/* Body - body */

.display-1,
.display-2,
.display-3,
.display-4,
.display-5,
.display-6,
.tiempos-body,
.counter-wrapper .counter,
.post-title {
  font-family: "Tiempos Text";
  font-style: normal;
  font-weight: 300;
  word-spacing: normal !important;
  letter-spacing: normal !important;
}

.display-1 {
  font-size: calc(1.5rem + 1.62vw);
}

@media (min-width: 1200px) {
  .display-1 {
    font-size: calc(2.2rem + 1.62vw);
  }
}

.display-2 {
  font-size: calc(1.365rem + 1.38vw);
}

@media (min-width: 1200px) {
  .display-2 {
    font-size: 2.4rem;
  }
}

.display-3 {
  font-size: calc(1.345rem + 1.14vw);
}

@media (min-width: 1200px) {
  .display-3 {
    font-size: 2.2rem;
  }
}

.display-4 {
  font-size: calc(1.315rem + 0.66vw);
}

@media (min-width: 1200px) {
  .display-4 {
    font-size: 1.75rem;
  }
}

.display-5 {
  font-size: calc(1.305rem + 0.66vw);
}

@media (min-width: 1200px) {
  .display-5 {
    font-size: 1.3rem;
  }
}

@media (max-width: 500px) {
  .display-5 {
    font-size: 1rem;
  }
  .display-4 {
    font-size: 1.17rem;
  }
}

.display-6 {
  font-size: calc(1.2rem + 0.42vw);
}

@media (min-width: 1200px) {
  .display-6 {
    font-size: 1.2rem;
  }
}

.display-1 {
  line-height: 1.1;
}

.display-2,
.display-3 {
  line-height: 1.15;
}

.display-4,
.display-5 {
  line-height: 1.2;
}

.display-6 {
  line-height: 1.25;
}

.tiempos-body {
  font-size: 0.85rem;
  line-height: 1.5;
}

.secondary-1 .secondary-2 .secondary-3 {
  font-family: "Manrope";
  font-style: normal;
  font-weight: 400 !important;
  word-spacing: normal !important;
  letter-spacing: normal !important;
}

.secondary-1 {
  font-size: calc(1.285rem + 0.42vw);
  line-height: 1.25;
}

.secondary-2 {
  font-size: var(--manrope-30);
  line-height: 1.3;
}

@media (max-width: 500px) {
  .secondary-2 {
    font-size: 1.1rem;
  }
}

.secondary-3 {
  font-size: var(--manrope-23);
  line-height: 1.3;
}

.secondary-3half {
  font-size: var(--manrope-18);
  line-height: 1.3;
}

/* Custom font styles */

.tiempos-bold {
  font-family: "Test Tiempos Text";
  font-weight: 600 !important;
}

.manrope-small {
  font-family: "Manrope";
  font-weight: 400 !important;
  font-size: var(--manrope-12);
  line-height: 1.3;
}

.manrope-large {
  font-family: "Manrope";
  font-weight: 100 !important;
  font-size: var(--manrope-60);
}

.manrope-jumbo {
  font-family: "Manrope";
  font-weight: 100 !important;
  font-size: var(--manrope-92);
}

.caption-text {
  font-family: var(--bs-font-founders) !important;
  font-size: var(--founders-16) !important;
  letter-spacing: 0.04;
}

.caption-text-small {
  font-family: var(--bs-font-founders) !important;
  font-size: var(--founders-12) !important;
  letter-spacing: 0.04;
}

.caption-text-footnote {
  font-family: var(--bs-font-founders) !important;
  font-size: var(--founders-11) !important;
  letter-spacing: 0.04;
  line-height: 130%;
}
