/* Nuestra Visión is the typography reference for every page and preview. */
:root {
  --font-title: "Tenor Sans", Arial, sans-serif;
  --font-description: "Alice", Georgia, serif;
  --size-title: 20px;
  --size-description: 14px;
  --leading-title: 1.8;
  --leading-description: 1.7;
}
@font-face {
  font-family: "Alice";
  src: url("/fonts/alice-regular.woff") format("woff");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Tenor Sans";
  src: url("/fonts/tenor-sans-regular.woff") format("woff");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

html body {
  line-height: 1.75;
}

/* Keep the same fonts and sizes as Nuestra Visión on every page. */
html body,
html body * {
  font-family: var(--font-description) !important;
  font-size: var(--size-description) !important;
}

html body :is(h1, h2, h3, h4, h5, h6, .eyebrow),
html body :is(h1, h2, h3, h4, h5, h6, .eyebrow) * {
  font-family: var(--font-title) !important;
  font-size: var(--size-title) !important;
  font-style: normal !important;
  font-weight: 400 !important;
  letter-spacing: 0.015em !important;
  line-height: var(--leading-title) !important;
}

/* Give the larger navigation labels room to wrap on narrow screens. */
.client-tabs {
  flex-wrap: wrap;
}

.client-tabs button {
  flex: 1 1 auto;
}

#main-nav {
  flex-wrap: wrap;
  justify-content: flex-end;
  row-gap: 6px;
}

.footer-bottom {
  flex-wrap: wrap;
  gap: 12px 28px;
}

.figure-note {
  flex-wrap: wrap;
}

.hero-figure figcaption {
  flex-wrap: wrap;
  gap: 8px;
}

.preview-devices {
  flex-wrap: wrap;
}

/* These characters are interface icons rather than written content. */
html body .text-link > span,
html body .back-top > span,
html body .faq-list summary > span,
html body .dialog-heading > button {
  font-size: 22px !important;
}

/* Match the regular description style used in Nuestra Visión. */
html body [data-site-page] p:not(.eyebrow) {
  font-family: var(--font-description) !important;
  font-size: var(--size-description) !important;
  font-style: normal !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  line-height: var(--leading-description) !important;
}
