/* All article modules share one reading column; only the hero text is centered. */
.guide-article { min-width: 0; max-width: var(--guide-measure); margin-inline: auto; }
.guide-article__header { max-width: var(--guide-measure); margin-inline: auto; text-align: center; }
/* Resolve the breadcrumb's reading measure at article size; keep its text small. */
.blog-main > .guide-breadcrumb { max-width: 72ch; margin-inline: auto; font-size: var(--text-lg); }
.blog-main > .guide-breadcrumb ol { font-size: var(--text-sm); }
.guide-back { display: inline-block; color: var(--color-cyan); font-size: var(--text-sm); margin-block-end: var(--space-6); }
.guide-article__header .guide-category { display: table; margin-inline: auto; padding: var(--space-1) var(--space-3); border: 1px solid var(--color-border); border-radius: var(--radius-pill); background: var(--color-surface); }
.guide-article__header h1 { max-width: 27ch; margin-block: var(--space-4); margin-inline: auto; text-wrap: balance; }
.guide-summary { max-width: 64ch; margin-inline: auto; }
.guide-byline { margin-block: var(--space-6) var(--space-8); justify-content: center; }
.guide-answer { margin-block: 0 var(--space-8); padding: var(--card-padding); }
.guide-answer h2 { color: var(--color-mint); font-size: var(--text-xl); margin-block-end: var(--space-3); }
.guide-answer__direct { max-width: 72ch; font-size: var(--text-xl); line-height: var(--leading-normal); }
.guide-answer__facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); gap: var(--space-6); margin-block: var(--space-6) 0; padding-block-start: var(--space-6); border-block-start: 1px solid var(--color-border); }
.guide-answer__facts dt { color: var(--color-text-secondary); font-size: var(--text-sm); margin-block-end: var(--space-2); }
.guide-answer__facts dd { margin: 0; font-weight: var(--font-weight-medium); }
.guide-answer .guide-answer__context { font-size: var(--text-base); margin-block-start: var(--space-4); }
.guide-answer__context strong { color: var(--color-mint); }
.guide-module { margin-block: var(--space-8); }
.guide-module h2, .guide-sources h2, .guide-safety h2, .guide-faq h2 { font-size: var(--text-2xl); margin-block: 0 var(--space-4); text-wrap: balance; }
.guide-module__heading > p { color: var(--color-text-secondary); }
.guide-relative { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: var(--card-padding); }
.guide-relative__levels { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-2); margin-block: var(--space-6); }
.guide-relative__levels button { display: flex; flex-direction: column; align-items: start; gap: var(--space-2); min-width: 0; min-height: 8rem; padding: var(--space-4); text-align: start; font: inherit; color: var(--color-text); background: var(--color-background); border: 1px solid var(--color-border); border-radius: var(--radius-md); cursor: pointer; transition: background var(--duration-fast), border-color var(--duration-fast); }
.guide-relative__levels button:hover { border-color: var(--color-cyan); }
.guide-relative__levels button[aria-pressed="true"] { border-color: var(--color-mint); background: color-mix(in srgb, var(--color-mint) 7%, var(--color-background)); }
.guide-relative__levels strong { font-family: var(--font-measurement); font-size: var(--text-2xl); font-variant-numeric: tabular-nums; }
.guide-relative__levels strong span { font-size: var(--text-sm); color: var(--color-text-secondary); }
.guide-relative__levels button > span { color: var(--color-text-secondary); font-size: var(--text-sm); }
.guide-relative__levels small { color: var(--color-mint); margin-block-start: auto; font-size: var(--text-xs); }
.guide-relative__transport { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3); }
.guide-relative__transport p { flex: 1 1 18rem; color: var(--color-text-secondary); font-size: var(--text-sm); }
.guide-article button.guide-button { cursor: pointer; font: inherit; font-size: var(--text-base); }
.guide-article button:disabled { cursor: not-allowed; opacity: .6; }
.guide-relative__note { margin-block-start: var(--space-6); padding-block-start: var(--space-4); border-block-start: 1px solid var(--color-border); color: var(--color-text-secondary); font-size: var(--text-sm); max-width: 110ch; }
.guide-levels { padding-block: var(--space-6); }
.guide-levels__strip { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); list-style: none; padding: 0; margin-block: var(--space-6); border: 1px solid var(--color-border); border-radius: var(--radius-lg); overflow: hidden; }
.guide-levels__strip li { display: flex; flex-direction: column; gap: var(--space-3); padding: var(--space-4); min-width: 0; background: var(--color-surface); }
.guide-levels__strip li + li { border-inline-start: 1px solid var(--color-border); }
.guide-levels__strip .is-current { background: color-mix(in srgb, var(--color-mint) 8%, var(--color-surface)); }
.guide-levels__strip strong { font-size: var(--text-2xl); font-family: var(--font-measurement); font-variant-numeric: tabular-nums; }
.guide-levels__strip strong span, .guide-levels__strip li > span:not(.guide-levels__bar) { color: var(--color-text-secondary); font-size: var(--text-sm); }
.guide-levels__strip small { color: var(--color-mint); font-size: var(--text-xs); margin-block-start: auto; }
.guide-levels__bar { display: block; height: .25rem; width: var(--level-bar); border-radius: var(--radius-xs); background: var(--color-text-secondary); }
.is-current .guide-levels__bar { background: var(--color-mint); }
.guide-module-note { color: var(--color-text-secondary); font-size: var(--text-sm); max-width: 100ch; margin-block-end: var(--space-4); }
.guide-text-link, .guide-levels__strip a, .guide-safety a, .guide-visual a { color: var(--color-cyan); }
.guide-body { grid-template-columns: minmax(0, 1fr) min(100%, var(--guide-measure)) minmax(0, 1fr); }
.guide-body > * { grid-column: 2; }
.guide-body > :first-child { margin-block-start: var(--space-6); }
.guide-body > .guide-callout, .guide-body > .guide-tool-cta, .guide-body > .guide-wide { grid-column: 1 / -1; }
.guide-body h2 { scroll-margin-block-start: 7rem; }
.guide-body blockquote { padding: var(--space-6); margin-block: var(--space-4) var(--space-8); font-size: var(--text-xl); border-block: 1px solid var(--color-border); color: var(--color-text-secondary); }
.guide-body blockquote p { max-width: 65ch; }
.guide-callout { background: var(--gold-box-background); border: 1px solid var(--gold-box-border); padding: var(--gold-box-padding); }
.guide-callout h3, .guide-callout h2 { color: var(--color-warning); }
.guide-callout p { max-width: 85ch; }
.guide-callout--warning { border-color: color-mix(in srgb, var(--color-danger) 45%, var(--color-border)); }
.guide-callout--warning h3 { color: var(--color-warning); }
.guide-tool-cta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-6) var(--space-8); }
.guide-tool-cta > div:first-child { flex: 1 1 32rem; }
.guide-tool-cta > div:first-child > p { max-width: 72ch; }
.guide-tool-cta .guide-actions { flex: 1 1 20rem; }
.guide-tool-cta .guide-privacy { font-size: var(--text-sm); margin-block-end: 0; }
.guide-privacy a, .guide-limits { color: var(--color-cyan); }
.guide-tool-cta--final { margin-block: var(--space-12); padding: var(--card-padding); background: color-mix(in srgb, var(--color-mint) 5%, var(--color-surface-elevated)); border: 1px solid color-mix(in srgb, var(--color-mint) 30%, var(--color-border)); }
.guide-safety { margin-block: var(--space-12); }
.guide-safety__standards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-6); margin-block-start: var(--space-6); }
.guide-safety__standards dt { font-weight: var(--font-weight-bold); margin-block-end: var(--space-3); }
.guide-safety__standards dd { margin: 0; max-width: 70ch; }
.guide-safety__standards a { display: block; margin-block-start: var(--space-3); font-size: var(--text-sm); }
.guide-trust { max-width: 85ch; }
.guide-sources { margin-block: var(--space-12); max-width: 90ch; }
.guide-sources ul { list-style: none; padding: 0; }
.guide-sources li { padding-block: var(--space-4); margin: 0; border-block-end: 1px solid var(--color-border); }
.guide-source-organization { display: block; color: var(--color-text-secondary); font-size: var(--text-sm); margin-block-end: var(--space-2); }
.guide-level-links { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); list-style: none; padding: 0; border-block-start: 1px solid var(--color-border); }
.guide-level-links li { min-width: 0; }
.guide-level-links li > a, .guide-level-links li > div { display: flex; flex-direction: column; gap: var(--space-2); height: 100%; padding: var(--space-6) var(--space-4); border-block-end: 1px solid var(--color-border); }
.guide-level-links li > a { text-decoration: none; }
.guide-level-links li > a:hover { background: var(--color-surface); }
.guide-level-links strong { font-size: var(--text-xl); }
.guide-level-links span { color: var(--color-text-secondary); font-size: var(--text-sm); }
.guide-level-links small { color: var(--color-text-secondary); font-size: var(--text-xs); }
.guide-faq { margin-block: var(--space-12); gap: 0; }
.guide-faq h2 { margin-block-end: var(--space-6); }
.guide-visual { margin-block: var(--space-8); }
.guide-visual img { display: block; width: auto; max-width: 100%; max-height: 40rem; height: auto; margin-inline: auto; }
.guide-visual figcaption { margin-block-start: var(--space-4); font-size: var(--text-sm); color: var(--color-text-secondary); text-align: center; }
.guide-toc { margin-block: var(--space-8); max-width: none; padding-block: var(--space-4); border-block: 1px solid var(--color-border); font-size: var(--text-base); }
.guide-toc summary { cursor: pointer; min-height: var(--control-height); align-content: center; font-weight: var(--font-weight-semibold); }
.guide-toc ol { padding-inline-start: var(--space-6); margin-block-start: var(--space-4); }
.guide-toc li + li { margin-block-start: var(--space-2); }
.guide-toc a { color: var(--color-cyan); }
.guide-toc, .guide-trust, .guide-sources { margin-inline: auto; }
.guide-table { scrollbar-color: var(--color-border) var(--color-surface); scrollbar-width: thin; overscroll-behavior-inline: contain; }
.guide-table th { color: var(--color-text); }
@media (width > 40rem) {
    .guide-levels__strip li:nth-child(3n + 1) { border-inline-start: 0; }
    .guide-levels__strip li:nth-child(n + 4) { border-block-start: 1px solid var(--color-border); }
}
@media (max-width: 40rem) {
    .guide-article__header h1 { font-size: clamp(2rem, 8vw, 3rem); }
    .guide-relative__levels, .guide-levels__strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .guide-levels__strip li + li { border-inline-start: 0; }
    .guide-levels__strip li { border-block-end: 1px solid var(--color-border); }
    .guide-safety__standards { grid-template-columns: 1fr; }
    .guide-relative__transport .guide-button { white-space: normal; }
    .guide-article { overflow-wrap: anywhere; }
}
@media (prefers-reduced-motion: reduce) {
    .guide-relative__levels button { transition: none; }
}
@media print {
    .guide-relative__transport, .guide-toc { display: none; }
    .guide-answer, .guide-relative, .guide-levels__strip li, .guide-callout { color: #111; background: white; border-color: #777; }
}
