html {
  font-size: 16px;
}

body {
  font-family: var(--sg-font-body), sans-serif;
  line-height: 1.55;
}

h1,
h2,
h3,
h4,
h5,
h6,
.sg-title {
  margin: 0;
  font-family: var(--sg-font-title), sans-serif;
  font-weight: 700;
  line-height: 1.12;
  letter-spacing: -0.02em;
}

h1,
.sg-h1 { font-size: clamp(2.4rem, 5vw, 4.5rem); }
h2,
.sg-h2 { font-size: clamp(2rem, 4vw, 3.3rem); }
h3,
.sg-h3 { font-size: clamp(1.6rem, 3vw, 2.4rem); }
h4,
.sg-h4 { font-size: clamp(1.3rem, 2vw, 1.8rem); }
h5,
.sg-h5 { font-size: 1.125rem; }

p,
.sg-body {
  margin: 0;
  font-size: 1rem;
}

.sg-body-lg {
  font-size: 1.125rem;
}

.sg-meta {
  font-size: 0.875rem;
  color: var(--sg-color-text-soft);
}

a {
  color: inherit;
  text-decoration-color: rgba(233, 114, 7, 0.5);
  text-underline-offset: 0.14em;
}

a:hover {
  text-decoration-color: var(--sg-color-accent);
}