/*
  Brand fonts — bonsai.io design system, self-hosted from /fonts (WOFF2).

  Whitney HTF is a licensed Hoefler&Co face; this repo is private. Confirm the
  web license covers docs/blog hosting before making the repo or fonts public.

  Families:
    "Merriweather"      — serif display: h1–h3, quotes (400 / 700 / 400 italic)
    "WhitneyHTF"        — UI: nav, buttons, h4–h6, eyebrows (400 / 500 / 600 / 700)
    "WhitneyHTF Book"   — body copy (400)
*/
@font-face {
  font-family: "Merriweather";
  src: url("../../fonts/Merriweather-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Merriweather";
  src: url("../../fonts/Merriweather-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Merriweather";
  src: url("../../fonts/Merriweather-Italic.woff2") format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "WhitneyHTF Book";
  src: url("../../fonts/WhitneyHTF-Book.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "WhitneyHTF";
  src: url("../../fonts/WhitneyHTF-Book.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "WhitneyHTF";
  src: url("../../fonts/WhitneyHTF-Medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "WhitneyHTF";
  src: url("../../fonts/WhitneyHTF-SemiBold.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "WhitneyHTF";
  src: url("../../fonts/WhitneyHTF-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* set a baseline for how some typography rules should work */
:root {
  line-height: var(--s0);
  font-size: var(--font-size);
  font-family: var(--font-body);
  color: var(--font-color);
  font-weight: var(--font-weight);
}

body {
  font-size: 1rem;
  line-height: 1.5;
}

a {
  color: var(--link-color);
  text-decoration: none;
  text-underline-position: under;
}

a:hover {
  color: var(--link-hover-color);
  text-decoration: underline;
}

article a {
  text-decoration: underline;
}

a.button {
  text-decoration: none;
}

p {
  line-height: 1.5;
  margin: unset;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  color: inherit;
  margin: unset;
}

/* Display headings: Merriweather, regular weight (bonsai.io) */
h1,
h2,
h3 {
  font-family: var(--font-header);
  font-weight: 400;
  font-style: normal;
}

h1 {
  font-size: 3rem;
  line-height: 3.5625rem;
}

h2 {
  font-size: 2.5rem;
  line-height: 3.25rem;
}

h3 {
  font-size: 1.5625rem;
  line-height: 2.375rem;
  font-weight: 700;
}

/* Interface headings: Whitney bold */
h4,
h5,
h6 {
  font-family: var(--font-ui);
  font-weight: 700;
}

h4 {
  font-size: 1.375rem;
  line-height: 2rem;
  letter-spacing: 0.03125rem;
}

h5 {
  font-size: 1.25rem;
  line-height: 1.5rem;
}

h6 {
  font-size: 1.125rem;
  line-height: 1.75rem;
}

@media (max-width: 991px) {
  h1 { font-size: 2.75rem; line-height: 3.25rem; }
  h2 { font-size: 2.25rem; line-height: 2.75rem; }
}

@media (max-width: 767px) {
  h1 { font-size: 2.5rem; line-height: 3rem; }
  h2 { font-size: 2.125rem; line-height: 2.625rem; }
}

/* Uppercase kicker above a heading (bonsai.io .text-eyebrow) */
.eyebrow {
  color: var(--link-color);
  font-family: var(--font-ui);
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 0.875rem;
  letter-spacing: 0.0125rem;
  text-transform: uppercase;
}

:focus-visible {
  outline: 2px solid var(--bz-focus-ring);
  outline-offset: 2px;
}

ul,
menu {
  padding: unset;
  margin: unset;
}

li>ul {
  padding-left: var(--s0);
}

ul.unstyled {
  list-style: none;
}

i {
  color: var(--color-muted);
}

hr {
  height: var(--border-thin);
  background: var(--color-lightish);
  border: none;
  margin: inherit;
}

dd {
  margin-inline-start: 0;
}

dt {
  text-transform: uppercase;
  font-weight: 600;
  color: var(--color-darkish);
  font-feature-settings: "c2sc";
  font-variant: small-caps;
  letter-spacing: calc(var(--s-7)/2);
  font-size: .74074rem;
}

pre {
  margin: 0;
  font-family: var(--font-mono);
}

/*code {*/
/*  font-family: var(--font-mono);*/
/*  font-size: 0.9em;*/
/*  background-color: var(--color-lightish);*/
/*  padding: 0.1em 0.3em;*/
/*  border-radius: var(--border-radius);*/
/*}*/

/* Prevent long words from causing horizontal overflow on mobile */
h1,
h2,
h3,
h4,
h5,
h6,
p {
  overflow-wrap: break-word;
  word-wrap: break-word;
}

/* Headings break between words, never mid-word */
h1,
h2,
h3,
h4,
h5,
h6 {
  hyphens: none;
  -webkit-hyphens: none;
}

/* Give a nice cursor for abbreviations */
abbr {
  cursor: help;
}