@font-face {
  font-family: "Tiempos Headline";
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("../fonts/tiempos/tiempos-headline-light.woff2") format("woff2");
}

@font-face {
  font-family: "Tiempos Headline";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/tiempos/tiempos-headline-regular.woff2") format("woff2");
}

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

.font-tiempos {
  --display: "Tiempos Headline", "Source Serif 4", Georgia, "Times New Roman", serif;
  --text: "Tiempos Text", "Source Serif 4", Georgia, "Times New Roman", serif;
}

.font-tiempos body {
  font-family: var(--text);
  font-weight: 400;
  font-synthesis: none;
}

.font-tiempos :is(.hk-title, .hk-feature-name, .hk-num, .hk-row-name, .hk-row-num, .c4g-title, .c4g-num, .vita-title, .hello-title, .work-label, .sheet-title) {
  font-family: var(--display);
  font-weight: 400;
}

.font-tiempos :is(.work-count, .skip-link, .c4g-link) {
  font-family: var(--text);
  font-weight: 400;
}

.font-tiempos :is(.sheet-role, .sheet-desc, .sheet-link, .gal-count, .ph-text, .ph-name) {
  font-family: var(--display);
  font-weight: 300;
}

.font-tiempos .plus {
  font-size: 1em;
  margin-left: 0;
  vertical-align: baseline;
}

@media (min-width: 700px) {
  .font-tiempos :is(.hero-tagline, .intro-text, .hk-intro, .hk-role, .hk-unit, .hk-link, .hk-row-role, .hk-row-unit, .c4g-copy, .c4g-unit, .vita-lead, .vita-note, .vita-fig figcaption, .vita-link, .hello-copy, .hello-links, .back-to-top) {
    font-family: var(--display);
    font-weight: 300;
  }

  .font-tiempos :is(.hero-tagline, .intro-text, .hk-intro, .hk-role, .hk-unit, .hk-link, .hk-row-role, .hk-row-unit, .c4g-copy, .c4g-unit, .vita-lead, .vita-note, .vita-link, .hello-copy, .hello-links) {
    position: relative;
  }

  .font-tiempos :is(.hk-title, .hk-feature-name, .hk-num, .hk-row-name, .hk-row-num, .c4g-title, .c4g-num, .vita-title, .hello-title, .c4g-link) {
    position: relative;
  }

  .font-tiempos .hero-tagline {
    top: calc(0.41 * var(--u));
    font-size: calc(3.281 * var(--u));
    line-height: calc(3.782 * var(--u));
    letter-spacing: -0.009em;
  }

  .font-tiempos .intro-text {
    top: calc(0.38 * var(--u));
    font-size: calc(3.814 * var(--u));
    line-height: calc(4.768 * var(--u));
    letter-spacing: -0.004em;
  }

  .font-tiempos .hk-title {
    top: calc(0.85 * var(--u));
    font-size: calc(8.417 * var(--u));
    line-height: calc(8.645 * var(--u));
    letter-spacing: -0.05em;
  }

  .font-tiempos .hk-intro {
    top: calc(0.35 * var(--u));
    font-size: calc(3.475 * var(--u));
    line-height: calc(4.205 * var(--u));
    letter-spacing: -0.033em;
  }

  .font-tiempos .hk-feature-name {
    top: calc(0.62 * var(--u));
    font-size: calc(6.22 * var(--u));
    line-height: calc(6.102 * var(--u));
    letter-spacing: -0.006em;
  }

  .font-tiempos .hk-role {
    top: calc(0.27 * var(--u));
    font-size: max(15px, calc(2.162 * var(--u)));
    line-height: max(1.15em, calc(2.638 * var(--u)));
    letter-spacing: -0.019em;
  }

  .font-tiempos .hk-num {
    top: calc(1.04 * var(--u));
    font-size: calc(9.557 * var(--u));
    line-height: calc(8.32 * var(--u));
    letter-spacing: -0.025em;
  }

  .font-tiempos .hk-unit {
    top: calc(0.27 * var(--u));
    font-size: max(15px, calc(2.341 * var(--u)));
    line-height: max(1.15em, calc(2.965 * var(--u)));
    letter-spacing: -0.015em;
  }

  .font-tiempos .hk-link {
    top: calc(0.12 * var(--u));
    font-size: max(15px, calc(1.858 * var(--u)));
    line-height: max(1.15em, calc(2.305 * var(--u)));
    letter-spacing: 0.007em;
    background-position: 0 calc((max(1.15em, calc(2.305 * var(--u))) - 1em) / 2 + 0.783em + 0.166em);
  }

  .font-tiempos .hk-row-name {
    top: calc(0.42 * var(--u));
    font-size: calc(4.942 * var(--u));
    line-height: calc(5.2815 * var(--u));
    letter-spacing: -0.025em;
  }

  .font-tiempos .hk-row:nth-child(2) .hk-row-name {
    font-size: calc(4.865 * var(--u));
    letter-spacing: -0.039em;
  }

  .font-tiempos .hk-row-role {
    top: calc(0.27 * var(--u));
    font-size: max(15px, calc(2.088 * var(--u)));
    line-height: max(1.15em, calc(2.519 * var(--u)));
    letter-spacing: -0.023em;
  }

  .font-tiempos .hk-row-num {
    top: calc(0.87 * var(--u));
    font-size: calc(6.6 * var(--u));
    line-height: calc(6.232 * var(--u));
    letter-spacing: 0.01em;
  }

  .font-tiempos .hk-row:nth-child(2) .hk-row-num {
    letter-spacing: -0.035em;
  }

  .font-tiempos .hk-row-unit {
    top: calc(0.1 * var(--u));
    font-size: max(15px, calc(2.269 * var(--u)));
    line-height: max(1.15em, calc(2.863 * var(--u)));
    letter-spacing: -0.046em;
  }

  .font-tiempos .c4g-title {
    top: calc(0.86 * var(--u));
    font-size: calc(9.186 * var(--u));
    line-height: calc(9.491 * var(--u));
    letter-spacing: -0.044em;
  }

  .font-tiempos .c4g-copy {
    top: calc(0.24 * var(--u));
    font-size: calc(3.25 * var(--u));
    line-height: calc(3.868 * var(--u));
    letter-spacing: -0.004em;
  }

  .font-tiempos .c4g-num {
    top: calc(1.07 * var(--u));
    font-size: calc(8.595 * var(--u));
    line-height: calc(8.933 * var(--u));
    letter-spacing: -0.053em;
  }

  .font-tiempos .c4g-unit {
    top: calc(0.1 * var(--u));
    font-size: max(15px, calc(2.615 * var(--u)));
    line-height: max(1em, calc(2.555 * var(--u)));
    letter-spacing: -0.052em;
  }

  .font-tiempos .c4g-link {
    top: calc(0.17 * var(--u));
    font-size: max(15px, calc(1.798 * var(--u)));
    line-height: max(1.15em, calc(2.126 * var(--u)));
    letter-spacing: -0.005em;
    background-position: 0 calc((max(1.15em, calc(2.126 * var(--u))) - 1em) / 2 + 0.761em + 0.33em);
  }

  .font-tiempos .vita-title {
    top: calc(1.14 * var(--u));
    font-size: calc(9.751 * var(--u));
    line-height: calc(10.09 * var(--u));
    letter-spacing: -0.004em;
  }

  .font-tiempos .vita-title span {
    background-image: linear-gradient(180deg, #94052d 0%, #94052d 8.1%, #6a041a 37.6%, #92042a 66.5%, #890225 78.3%, #7a0320 100%);
  }

  .font-tiempos .vita-lead {
    top: calc(0.28 * var(--u));
    font-size: calc(2.73 * var(--u));
    line-height: calc(3.249 * var(--u));
    letter-spacing: -0.014em;
  }

  .font-tiempos .vita-note {
    top: calc(0.24 * var(--u));
    font-size: calc(2.279 * var(--u));
    line-height: calc(2.77 * var(--u));
    letter-spacing: -0.023em;
  }

  .font-tiempos .vita-fig figcaption {
    font-size: max(14px, calc(1.59 * var(--u)));
    line-height: max(1.15em, calc(1.92 * var(--u)));
    letter-spacing: -0.016em;
  }

  .font-tiempos .vita-link {
    top: calc(0.07 * var(--u));
    font-size: max(15px, calc(2.074 * var(--u)));
    line-height: max(1.15em, calc(2.432 * var(--u)));
    letter-spacing: -0.019em;
    background-position: 0 calc((max(1.15em, calc(2.432 * var(--u))) - 1em) / 2 + 0.783em + 0.32em);
  }

  .font-tiempos .hello-title {
    top: calc(1.49 * var(--u));
    font-size: calc(12.969 * var(--u));
    line-height: calc(13.36 * var(--u));
    letter-spacing: -0.045em;
  }

  .font-tiempos .hello-copy {
    top: calc(0.36 * var(--u));
    font-size: calc(3.213 * var(--u));
    line-height: calc(3.688 * var(--u));
    letter-spacing: -0.032em;
  }

  .font-tiempos .hello-links {
    top: calc(0.12 * var(--u));
    font-size: max(16px, calc(2.011 * var(--u)));
    line-height: max(1.15em, calc(2.491 * var(--u)));
  }

  .font-tiempos .hello-links li:nth-child(1) a {
    letter-spacing: -0.033em;
  }

  .font-tiempos .hello-links li:nth-child(2) a {
    letter-spacing: -0.045em;
  }

  .font-tiempos .hello-links li:nth-child(3) a {
    letter-spacing: -0.024em;
  }

  .font-tiempos .hello-links a {
    background-position: 0 calc((max(1.15em, calc(2.491 * var(--u))) - 1em) / 2 + 0.783em + 0.18em);
  }

  .font-tiempos .back-to-top {
    top: calc(49.74 * var(--u));
    font-size: max(15px, calc(1.666 * var(--u)));
    line-height: max(1.15em, calc(2.047 * var(--u)));
    letter-spacing: -0.036em;
  }
}

@media (max-width: 699px) {
  .font-tiempos .hero-tagline {
    font-size: 5.2vw;
    letter-spacing: -0.02em;
  }

  .font-tiempos .intro-text {
    font-size: max(19px, 5.25vw);
  }

  .font-tiempos .hk-intro {
    font-size: max(17px, 4.45vw);
  }

  .font-tiempos :is(.hk-role, .hk-unit) {
    font-size: 17px;
  }

  .font-tiempos :is(.hk-link, .c4g-link, .vita-link, .vita-note) {
    font-size: 16px;
  }

  .font-tiempos .hk-row-role {
    font-size: 15px;
  }

  .font-tiempos .hk-row-unit {
    font-size: 14px;
  }

  .font-tiempos :is(.c4g-copy, .vita-lead) {
    font-size: max(18px, 4.9vw);
  }

  .font-tiempos .c4g-unit {
    font-size: 16px;
  }

  .font-tiempos .vita-fig figcaption {
    font-size: 14px;
  }

  .font-tiempos .hello-copy {
    font-size: max(20px, 5.6vw);
  }

  .font-tiempos .hello-links {
    font-size: 19px;
  }

  .font-tiempos .back-to-top {
    font-size: 16px;
  }
}
