.tj-joy-article {
  --tj-joy-navy: #14213d;
  --tj-joy-gold: #d68b2c;
  --tj-joy-cream: #fff8eb;
  color: #252525;
  line-height: 1.75;
}

.tj-joy-article article {
  max-width: 860px;
  margin-inline: auto;
}

.tj-joy-article h1,
.tj-joy-article h2 {
  color: var(--tj-joy-navy);
}

.tj-joy-article h2 {
  margin-top: 2.5rem;
  margin-bottom: 1rem;
}

.tj-joy-article .tj-joy-hero img,
.tj-joy-article .tj-joy-supporting img {
  object-fit: cover;
}

.tj-joy-article .tj-joy-infographic {
  max-width: 720px;
  margin-inline: auto;
  padding: 1rem;
  background: var(--tj-joy-cream);
  border-left: 5px solid var(--tj-joy-gold);
}

.tj-joy-article a:focus-visible {
  outline: 3px solid var(--tj-joy-gold);
  outline-offset: 3px;
}

@media (max-width: 767.98px) {
  .tj-joy-article {
    line-height: 1.65;
  }

  .tj-joy-article h1 {
    font-size: clamp(2rem, 10vw, 3rem);
  }
}

@media (prefers-reduced-motion: reduce) {
  .tj-joy-article *,
  .tj-joy-article *::before,
  .tj-joy-article *::after {
    scroll-behavior: auto !important;
    transition: none !important;
  }
}