/* Medical notes, contextual photography and accessible source disclosure. */
.hylase-article .service-content .article-assessment {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: center;
  gap: clamp(2rem, 3vw, 4rem);
  margin-block: 3.5rem;
}
.hylase-article .article-assessment .article-figure { min-width: 0; margin: 0; }
.hylase-article .article-assessment .article-figure img { aspect-ratio: 3 / 2; max-height: none; }
.blog-article .article-warning {
  margin-block: 2rem;
  padding: clamp(1.25rem, 3vw, 2rem);
  border: 1px solid #dfd5c6;
  border-left: 4px solid #aa2b1d;
  border-radius: 0 0.6rem 0.6rem 0;
  background: #fffdf8;
}
.blog-article .service-content a { text-underline-offset: 0.2em; }
.blog-article .article-citation { white-space: nowrap; color: #aa2b1d; }
.blog-article .article-citation:is(:hover, :focus-visible) { color: #702014; }
.blog-article main a:focus-visible,
.blog-article .article-sources li:focus {
  outline: 2px solid currentColor;
  outline-offset: 4px;
}
.blog-article .article-sources ol { padding-left: 1.8rem; margin: 2rem 0; }
.blog-article .article-sources li { padding-left: 0.35rem; overflow-wrap: anywhere; }
.blog-article .article-sources li + li { margin-top: 1.5rem; }
.blog-article .article-sources li p { margin-top: 0.4rem; }

.blog-article .service-content > .article-sources {
  margin-top: 3rem;
  padding: 0;
  border: 1px solid #dfd5c6;
  border-radius: 0.6rem;
  background: #fffdf8;
}
.blog-article .article-sources > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  padding: 1.5rem 2rem;
  list-style: none;
  cursor: pointer;
}
.blog-article .article-sources > summary h2 { margin: 0; }
.blog-article .article-sources > summary:is(:hover, :focus-visible) { color: #aa2b1d; }
.blog-article .article-sources > summary:focus-visible { outline: 2px solid #aa2b1d; outline-offset: 4px; border-radius: 0.6rem; }
.blog-article .article-sources-content { padding: 0 2rem 2rem; }
.blog-article .article-sources-content > ol { margin-top: 0.5rem; }
.blog-article .article-sources .article-source-list { padding-left: 0; list-style: none; }
.blog-article .article-sources .article-source-list > li { padding-left: 0; }

@media (max-width: 1024px) {
  .hylase-article .service-content .article-assessment { grid-template-columns: minmax(0, 1fr); gap: 1.5rem; margin-block: 2.5rem; }
}
@media (max-width: 768px) {
  .blog-article .article-sources > summary { padding: 1.25rem; gap: 1rem; }
  .blog-article .article-sources-content { padding: 0 1.25rem 1.5rem; }
}
