*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--color-page); color: var(--color-text); font-family: var(--font-sans); font-size: var(--font-size-body); line-height: var(--line-height-body); }
img { display: block; max-width: 100%; height: auto; }
a { color: var(--color-action); text-decoration-thickness: .08em; text-underline-offset: .16em; }
a:hover { color: var(--color-action-hover); }
:focus-visible { outline: 2px solid var(--color-action); outline-offset: 3px; box-shadow: var(--focus-ring); }
h1, h2, h3 { color: var(--color-primary); line-height: var(--line-height-heading); text-wrap: balance; }
h1 { margin: 0 0 var(--space-3); font-size: var(--font-size-h1); }
h2 { margin: var(--space-8) 0 var(--space-2); font-size: var(--font-size-h2); }
h3 { margin: var(--space-4) 0 var(--space-1); font-size: var(--font-size-h3); }
p, ul, ol, dl { margin-top: 0; margin-bottom: var(--space-3); }
.container { width: min(100% - 2rem, var(--container-width)); margin-inline: auto; }
.text-column { max-width: var(--text-width); }
.skip-link { position: fixed; z-index: 100; top: 1rem; left: 1rem; padding: .65rem 1rem; transform: translateY(-180%); background: var(--color-primary); color: #fff; border-radius: var(--radius-sm); }
.skip-link:focus { transform: none; }
.site-header { background: var(--color-surface); border-bottom: var(--border-width) solid var(--color-border); }
.site-header__inner { min-height: 6rem; display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); }
.site-brand { display: block; width: min(29rem, 60vw); }
.site-brand img { width: 100%; }
.primary-navigation__list, .mobile-navigation__list { display: flex; flex-wrap: wrap; gap: var(--space-3); margin: 0; padding: 0; list-style: none; }
.primary-navigation a, .mobile-navigation a { font-weight: var(--font-weight-medium); text-decoration: none; }
.mobile-navigation { display: none; }
.breadcrumb { padding-block: var(--space-2); font-size: var(--font-size-small); }
.breadcrumb ol { margin: 0; padding: 0; list-style: none; }
.page-intro { padding-block: var(--space-5) var(--space-3); }
.eyebrow { margin-bottom: var(--space-1); color: var(--color-action); font-size: var(--font-size-small); font-weight: var(--font-weight-bold); letter-spacing: .04em; text-transform: uppercase; }
.lead { color: var(--color-text-muted); font-size: clamp(1.2rem, 2vw, 1.35rem); line-height: 1.55; }
.info-box, .option-box, .caution-box, .warning-box { margin-block: var(--space-4); padding: var(--space-3); border: var(--border-width) solid var(--color-border); border-left-width: .35rem; border-radius: var(--radius-md); background: var(--color-surface); }
.info-box { border-left-color: var(--color-primary); background: var(--color-info-surface); }
.option-box { border-left-color: var(--color-action); background: var(--color-option-surface); }
.caution-box { border-left-color: var(--color-caution); background: var(--color-caution-surface); }
.warning-box { border-left-color: var(--color-danger); background: var(--color-danger-surface); }
.info-box h2, .option-box h3, .caution-box h3, .warning-box h3 { margin-top: 0; }
.info-box p:last-child, .option-box p:last-child, .caution-box p:last-child, .warning-box p:last-child { margin-bottom: 0; }
.key-points { margin-block: var(--space-5); }
.key-points h2 { margin-top: 0; }
.check-list, .warning-list { padding-left: 1.4rem; }
.check-list li, .warning-list li { padding-left: .35rem; margin-bottom: .65rem; }
.check-list li::marker { color: var(--color-action); }
.warning-list li::marker { color: var(--color-danger); }
.article-layout { display: grid; grid-template-columns: minmax(14rem, 18rem) minmax(0, var(--text-width)); justify-content: space-between; gap: var(--space-8); align-items: start; }
.table-of-contents { position: sticky; top: var(--space-3); padding: var(--space-3); border: var(--border-width) solid var(--color-border); border-radius: var(--radius-md); background: var(--color-surface); font-size: var(--font-size-small); }
.table-of-contents h2 { margin: 0 0 var(--space-2); font-size: 1.25rem; }
.table-of-contents ol { margin: 0; padding-left: 1.25rem; }
.table-of-contents li { margin-bottom: .4rem; }
.article-content > section:first-child h2 { margin-top: 0; }
.table-scroll { max-width: 100%; margin-block: var(--space-4); overflow-x: auto; border: var(--border-width) solid var(--color-border); border-radius: var(--radius-md); background: var(--color-surface); }
table { width: 100%; min-width: 42rem; border-collapse: collapse; font-size: 1rem; }
th, td { padding: .9rem 1rem; border-bottom: var(--border-width) solid var(--color-border); text-align: left; vertical-align: top; }
thead th { background: var(--color-primary); color: #fff; }
tbody tr:last-child > * { border-bottom: 0; }
tbody th { color: var(--color-primary); }
.source-note { color: var(--color-text-muted); font-size: var(--font-size-small); }
.classification-grid, .wayfinder-grid, .related-pages__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-2); margin: var(--space-4) 0; padding: 0; list-style: none; }
.classification-card, .wayfinder-card, .related-card { padding: var(--space-3); border: var(--border-width) solid var(--color-border); border-radius: var(--radius-md); background: var(--color-surface); }
.classification-card h3, .wayfinder-card h3, .related-card h3 { margin-top: 0; }
.classification-card p:last-child, .wayfinder-card p:last-child, .related-card p:last-child { margin-bottom: 0; }
.definition-list > div { padding-block: var(--space-2); border-bottom: var(--border-width) solid var(--color-border); }
.definition-list dt { color: var(--color-primary); font-weight: var(--font-weight-bold); }
.definition-list dd { margin: .25rem 0 0; }
.text-cta { display: inline-block; padding: .65rem 1rem; border: 2px solid var(--color-action); border-radius: var(--radius-sm); font-weight: var(--font-weight-semibold); text-decoration: none; }
.text-cta:hover { background: var(--color-action); color: #fff; }
.wayfinder-card { position: relative; padding-left: 4.25rem; }
.wayfinder-card__number { position: absolute; top: var(--space-3); left: var(--space-3); display: grid; width: 2rem; height: 2rem; place-items: center; border-radius: 50%; background: var(--color-primary); color: #fff; font-weight: var(--font-weight-bold); }
.faq-section details { border-top: var(--border-width) solid var(--color-border); background: var(--color-surface); }
.faq-section details:last-child { border-bottom: var(--border-width) solid var(--color-border); }
.faq-section summary { padding: var(--space-2); color: var(--color-primary); font-weight: var(--font-weight-semibold); cursor: pointer; }
.faq-section details p { padding: 0 var(--space-2) var(--space-2); }
.editorial-box { margin-top: var(--space-8); padding: var(--space-3); border: var(--border-width) solid var(--color-border); border-radius: var(--radius-md); background: var(--color-surface); }
.editorial-box h2 { margin: 0 0 var(--space-2); }
.review-data { display: flex; flex-wrap: wrap; gap: var(--space-4); margin: 0; font-size: var(--font-size-small); }
.review-data dt { color: var(--color-text-muted); font-weight: var(--font-weight-semibold); }
.review-data dd { margin: 0; }
.sources { font-size: var(--font-size-small); }
.sources li { margin-bottom: var(--space-1); overflow-wrap: anywhere; }
.related-pages { margin-top: var(--space-8); padding-block: var(--space-6); background: var(--color-info-surface); border-block: var(--border-width) solid var(--color-border); }
.related-pages h2 { margin-top: 0; }
.related-card h3 { font-size: 1.25rem; }
.site-footer { padding-block: var(--space-6) var(--space-3); background: var(--color-primary); color: #fff; }
.site-footer__grid { display: grid; grid-template-columns: minmax(16rem, 2fr) repeat(3, minmax(10rem, 1fr)); gap: var(--space-4); }
.site-footer__about { max-width: 30rem; }
.site-footer__about img { filter: brightness(0) invert(1); }
.site-footer h2 { margin-top: 0; color: #fff; font-size: 1.15rem; }
.site-footer ul { padding: 0; list-style: none; }
.site-footer a { color: #fff; }
.site-footer__legal { display: flex; justify-content: space-between; gap: var(--space-3); margin-top: var(--space-4); padding-top: var(--space-3); border-top: 1px solid rgb(255 255 255 / .25); font-size: var(--font-size-meta); }
.site-footer__legal p { margin: 0; }
@media (max-width: 61.99rem) {
  .article-layout { grid-template-columns: 1fr; }
  .table-of-contents { position: static; max-width: var(--text-width); }
  .site-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 47.99rem) {
  html { scroll-behavior: auto; }
  .site-header__inner { min-height: 4.75rem; }
  .site-brand { width: min(15rem, 72vw); }
  .primary-navigation--desktop { display: none; }
  .mobile-navigation { display: block; position: relative; }
  .mobile-navigation summary { padding: .45rem .65rem; border: var(--border-width) solid var(--color-border); border-radius: var(--radius-sm); cursor: pointer; }
  .mobile-navigation nav { position: absolute; z-index: 5; right: 0; width: min(18rem, 85vw); padding: var(--space-2); background: var(--color-surface); border: var(--border-width) solid var(--color-border); box-shadow: var(--shadow-subtle); }
  .mobile-navigation__list { flex-direction: column; }
  .page-intro { padding-top: var(--space-3); }
  .classification-grid, .wayfinder-grid, .related-pages__grid { grid-template-columns: 1fr; }
  .site-footer__grid { grid-template-columns: 1fr; }
  .site-footer__legal { flex-direction: column; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { transition-duration: .01ms !important; } }
