/* Extra helpers for the React build (Tailwind CDN provides the utility classes). */

/* Basic text selection smoothness */
html, body { height: 100%; }

/* Line clamp without Tailwind plugins */
.line-clamp-3{
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Simple "prose" styling for long-form content */
.prose, .article-prose{
  color: #1c1917;
  line-height: 1.8;
  font-size: 1rem;
}
.prose h1, .article-prose h1{
  font-size: 2rem;
  line-height: 1.2;
  margin: 1.2em 0 0.6em;
  font-weight: 800;
}
.prose h2, .article-prose h2{
  font-size: 1.5rem;
  line-height: 1.25;
  margin: 1.2em 0 0.6em;
  font-weight: 800;
}
.prose h3, .article-prose h3{
  font-size: 1.25rem;
  line-height: 1.3;
  margin: 1.1em 0 0.5em;
  font-weight: 800;
}
.prose p, .article-prose p{
  margin: 0.8em 0;
}
.prose ul, .article-prose ul{
  margin: 0.8em 0;
  padding-left: 1.25rem;
  list-style: disc;
}
.prose ol, .article-prose ol{
  margin: 0.8em 0;
  padding-left: 1.25rem;
  list-style: decimal;
}
.prose li, .article-prose li{
  margin: 0.3em 0;
}
.prose a, .article-prose a{
  color: #059669;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.prose blockquote, .article-prose blockquote{
  border-left: 4px solid #d6d3d1;
  padding-left: 1rem;
  margin: 1rem 0;
  color: #57534e;
}
.prose hr, .article-prose hr{
  border: none;
  border-top: 1px solid #e7e5e4;
  margin: 2rem 0;
}
.prose img, .article-prose img{
  max-width: 100%;
  height: auto;
  border-radius: 1rem;
}