/* Scoped article components; the original landing stylesheet stays unchanged. */
.guide-preview { margin-top: 48px; }
.guide-preview > h3 { font-size: 1.4rem; margin-bottom: 20px; }
.guide-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.guide-preview .guide-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.guide-card {
  display: flex; flex-direction: column; gap: 14px; padding: 24px;
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius); box-shadow: var(--shadow-sm);
  text-decoration: none !important; color: var(--text) !important;
}
.guide-card:hover { border-color: var(--accent); }
.guide-card:focus-visible, .guide-all:focus-visible { outline: 3px solid var(--accent); outline-offset: 4px; }
.guide-card__category { color: var(--accent-strong); font-size: .78rem; font-weight: 650; }
.guide-card h3 { font-size: 1.12rem; line-height: 1.35; }
.guide-card p { color: var(--text-soft); font-size: .92rem !important; line-height: 1.6; }
.guide-card__action { margin-top: auto; color: var(--accent-strong); font-size: .88rem; font-weight: 600; }
.guide-all { display: inline-block; margin-top: 22px; color: var(--accent-strong); text-decoration: underline; text-underline-offset: 4px; }
.faq details p a { color: var(--accent-strong); text-decoration: underline; text-underline-offset: 3px; }
.blog-index { padding-top: 100px; padding-bottom: 100px; min-height: 70vh; }
.blog-index h1 { font-size: clamp(2.4rem, 5vw, 4rem); max-width: 850px; }
.blog-index__lead { color: var(--text-soft); font-size: 1.15rem; margin: 24px 0 44px; max-width: 640px; }
.legal-page .guide-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 20px; }
.legal-page article > section > p + p { margin-top: 16px; }
.legal-page article > section > p strong,
.legal-page__lead strong { color: var(--text); font-weight: 650; }
.article-figure { margin: 28px 0; }
.article-byline { font-size: .85rem !important; color: var(--text-soft); }
.article-cta { margin-block: 32px; }
.article-comparison { max-width: 100%; overflow-x: auto; margin-block: 32px; border: 1px solid #dedbd7; border-radius: 16px; }
.article-comparison:focus-visible { outline: 3px solid #7059e8; outline-offset: 4px; }
.article-comparison table { width: 100%; border-collapse: collapse; font-size: 0.95rem; line-height: 1.6; }
.article-comparison caption { text-align: left; padding: 18px; font-weight: 700; }
.article-comparison th, .article-comparison td { padding: 16px 18px; text-align: left; vertical-align: top; border-top: 1px solid #dedbd7; }
.article-comparison thead th { background: #f0ecff; }
.article-comparison th[scope="row"] { min-width: 110px; }
.article-comparison td { min-width: 170px; }
.legal-page section[id] { scroll-margin-top: var(--outline-anchor, 200px); }
.article-outline { position: sticky; top: var(--outline-top, 132px); z-index: 10; align-self: start; margin: 0 24px 24px; }
.article-outline details { background: var(--bg, #faf8f5); border: 1px solid var(--border); border-radius: 14px; padding: 12px 16px; }
.article-outline summary { cursor: pointer; font-weight: 650; }
.article-outline nav { display: grid; gap: 4px; max-height: min(55vh, 560px); overflow-y: auto; margin-top: 12px; }
.article-outline nav a { display: block; padding: 8px 10px; border-left: 3px solid transparent; font-size: .88rem; line-height: 1.4; color: var(--text-soft) !important; text-decoration: none !important; }
.article-outline nav a[aria-current] { border-left-color: var(--accent); background: var(--surface); color: var(--accent-strong) !important; font-weight: 650; }
.article-outline a:focus-visible, .article-outline summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
@media (min-width: 1180px) {
  .article-layout { display: grid; grid-template-columns: minmax(0, 760px) 240px; gap: 36px; max-width: 1084px; margin-inline: auto; padding-inline: 24px; }
  .article-layout > article { grid-column: 1; grid-row: 1; padding-inline: 0; }
  .article-outline { grid-column: 2; grid-row: 1; margin: 0; }
  .article-outline nav { max-height: calc(100dvh - 200px); }
}
.article-figure img { width: 100%; height: auto; border-radius: var(--radius); border: 1px solid var(--border); }
.article-figure--compact { max-width: 340px; margin-inline: auto; }
.article-figure figcaption { margin-top: 12px; color: var(--text-soft); font-size: .88rem; line-height: 1.6; }
@media (max-width: 680px) {
  .guide-grid, .guide-preview .guide-grid, .legal-page .guide-grid { grid-template-columns: 1fr; }
  .guide-card { padding: 22px; }
  .blog-index { padding-top: 64px; padding-bottom: 64px; }
}