/* New article content inherits the captured Astra typography and navigation. */
.article-guides { background: #f5f7f8; padding: 64px 24px; }
.article-guides-inner { max-width: 1200px; margin: 0 auto; }
.article-guides h2 { margin: 0 0 16px; }
.article-guides-intro { max-width: 720px; margin-bottom: 32px; }
.guide-card-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px; }
.guide-card { min-width: 0; }
.guide-card-image { display: block; margin-bottom: 20px; }
.guide-card img { display: block; width: 100%; height: auto; aspect-ratio: 19 / 26; object-fit: cover; }
.guide-card h3 { font-size: 21px; line-height: 1.35; margin: 0 0 12px; }
.guide-card p { font-size: 16px; line-height: 1.65; margin: 0; }
.new-article .entry-title { font-size: clamp(28px, 2.7vw, 40px); line-height: 1.2; overflow-wrap: break-word; }
.new-article .entry-content { font-size: 18px; line-height: 1.75; }
.new-article .entry-content::after { content: ""; display: block; clear: both; }
.new-article .article-cover { float: right; width: 190px; margin: 0 0 24px 28px; }
.new-article .article-cover img { display: block; width: 100%; height: auto; aspect-ratio: 19 / 26; }
.new-article .entry-content > h2 { clear: both; margin-top: 1.7em; font-size: 27px; line-height: 1.3; }
.new-article .entry-content ul, .new-article .entry-content ol { list-style-position: outside; margin-left: 1.5em; }
.article-table-scroll { max-width: 100%; overflow-x: auto; margin: 1.5em 0; border: 1px solid #dce2e7; }
.article-table-scroll table { width: 100%; min-width: 540px; margin: 0; border: 0; border-collapse: collapse; font-size: 16px; line-height: 1.6; }
.article-table-scroll th, .article-table-scroll td { padding: 13px 15px; vertical-align: top; text-align: left; }
.article-table-scroll th { background: #edf2f5; color: #182d3b; }
.new-article .entry-content pre { max-width: 100%; overflow-x: auto; padding: 20px; font-size: 14px; line-height: 1.6; white-space: pre; background: #f3f5f7; color: #213544; }
.article-related { clear: both; border-top: 1px solid #dce2e7; margin-top: 40px; padding-top: 26px; }
.article-related h2 { font-size: 25px; }
.article-related ul { list-style-position: outside; margin: 0 0 0 1.25em; }
.article-related li { margin: 10px 0; }
.guide-card a:focus-visible, .article-related a:focus-visible,
.new-article .entry-content a:focus-visible, .article-table-scroll:focus-visible { outline: 3px solid #176fa1; outline-offset: 4px; }
.new-guide-card .post-thumb img { aspect-ratio: 19 / 26; object-fit: cover; }
@media (max-width: 1024px) {
  .guide-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .guide-card-image { max-width: 280px; }
}
@media (max-width: 600px) {
  .article-guides { padding: 40px 24px; }
  .guide-card-grid { grid-template-columns: minmax(0, 1fr); gap: 36px; }
  .guide-card-image { max-width: 260px; margin-right: auto; margin-left: auto; }
  .new-article .article-cover { float: none; width: min(220px, 100%); margin: 0 auto 24px; }
  .new-article .entry-content { font-size: 17px; line-height: 1.75; }
  .new-article .entry-content > h2 { font-size: 24px; }
  .new-article .entry-content pre { font-size: 12px; padding: 14px; }
  .article-table-scroll th, .article-table-scroll td { padding: 10px 12px; }
}