/* Visible navigation and article summaries; no content is hidden from readers. */
body :is(main, [role="main"]) .related-guides { margin-block: 32px 48px; padding: 24px; border: 1px solid #DCEDF2; border-radius: 16px; background: #F5FDFF; color: #172D33; }
body :is(main, [role="main"]) .related-guides h2 { margin: 0 0 12px; font-size: 20px; line-height: 1.4; text-align: left; }
body :is(main, [role="main"]) .related-guides ul { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px 24px; margin: 0; padding: 0; list-style: none; }
body :is(main, [role="main"]) .related-guides li { min-width: 0; text-align: left !important; }
body :is(main, [role="main"]) .related-guides a { display: flex; align-items: center; min-height: 44px; font-size: 14px; line-height: 1.6; color: #08728c; text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }
body :is(main, [role="main"]) .related-guides a:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
@media (max-width: 768px) {
  body :is(main, [role="main"]) .related-guides { width: calc(100% - 40px); padding: 20px; margin-block: 24px 36px; }
  body :is(main, [role="main"]) .related-guides ul { grid-template-columns: minmax(0, 1fr); gap: 8px; }
}
.site-breadcrumb { padding-block: 16px; color: #52525b; font-size: 13px; line-height: 1.6; }
.site-breadcrumb ol { display: flex; flex-wrap: wrap; gap: 6px 10px; margin: 0; padding: 0; list-style: none; }
.site-breadcrumb li { display: inline; overflow-wrap: anywhere; }
.site-breadcrumb li + li::before { content: "/"; margin-right: 10px; color: #71717a; }
.site-breadcrumb a { color: #0395BC; text-decoration: underline; text-underline-offset: 3px; }
.article-summary { margin: 24px 0 32px; padding: 24px; color: #172D33; background: #F5FDFF; border: 1px solid #DCEDF2; border-radius: 16px; }
.article-content .article-summary h2 { margin: 0 0 12px; font-size: 1.25rem; }
.article-summary ul { margin: 0; padding-left: 20px; }
.article-summary li + li { margin-top: 8px; }
.article-content .article-summary .article-source { margin: 20px 0 0; font-size: 13px; }
.article-source a { color: #0395BC; text-decoration: underline; }
@media (max-width: 768px) {
  .article-summary { padding: 20px 16px; }
  body main .article-summary :is(p, li),
  body main .site-breadcrumb li { text-align: left !important; text-align-last: auto; }
}