.article-content {
  overflow-wrap: anywhere;
}

.article-content > :first-child { margin-top: 0; }
.article-content > :last-child { margin-bottom: 0; }

.article-content p,
.article-content ul,
.article-content ol,
.article-content blockquote,
.article-content pre {
  margin: 0 0 1.25em;
}

.article-content h1,
.article-content h2,
.article-content h3 {
  margin: 1.5em 0 .65em;
  line-height: 1.25;
}

.article-content ul,
.article-content ol { padding-left: 1.5em; }
.article-content ul { list-style: disc; }
.article-content ol { list-style: decimal; }

.article-content blockquote {
  padding: .25em 0 .25em 1.15em;
  border-left: 4px solid #615dfa;
  color: #52606d;
}

.article-content pre {
  overflow-x: auto;
  padding: 1em 1.2em;
  border-radius: 8px;
  background: #111827;
  color: #f8fafc;
  white-space: pre-wrap;
}

.article-content img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
}

.article-content iframe,
.article-content .ql-video {
  width: 100%;
  min-height: 420px;
  border: 0;
}

.article-content .ql-align-center { text-align: center; }
.article-content .ql-align-right { text-align: right; }
.article-content .ql-align-justify { text-align: justify; }
.article-content .ql-indent-1 { margin-left: 3em; }
.article-content .ql-indent-2 { margin-left: 6em; }
.article-content .ql-indent-3 { margin-left: 9em; }
.article-content .ql-size-small { font-size: .8em; }
.article-content .ql-size-large { font-size: 1.5em; }
.article-content .ql-size-huge { font-size: 2.5em; }

@media (max-width: 700px) {
  .article-content iframe,
  .article-content .ql-video { min-height: 230px; }
  .article-content .ql-indent-1,
  .article-content .ql-indent-2,
  .article-content .ql-indent-3 { margin-left: 1.25em; }
}