/* Published CMS reading surfaces. Keep the article, article menu and contents distinct. */
.support-reading { --reading-line:#e2e7ef; --reading-muted:#50627a; max-width:1480px; margin:auto; padding:0 40px 88px; }
.support-reading-hero { background:#071d3b; color:#fff; }
.support-reading-hero-inner { display:flex; justify-content:space-between; align-items:center; gap:40px; max-width:1480px; min-height:176px; margin:auto; padding:32px 40px; }
.support-reading-intro { min-width:0; }
.support-reading-title { display:inline-block; color:#fff; font-size:34px; font-weight:600; letter-spacing:-.04em; line-height:1.2; }
.support-reading-title:hover { color:#dbe8ff; }
.support-reading-intro p { margin:10px 0 0; color:#bdcce1; font-size:15px; line-height:1.6; }
.article-search { display:flex; align-items:center; gap:12px; width:480px; max-width:100%; flex-shrink:0; padding:6px 6px 6px 18px; border:1px solid #d5dfed; border-radius:12px; background:#fff; }
.article-search:focus-within { outline:3px solid #95b9ff; outline-offset:4px; }
.article-search-icon { flex:none; width:20px; height:20px; color:#667b96; }
.article-search input { flex:1; min-width:0; width:100%; min-height:44px; padding:10px 0; border:0; border-radius:0; outline:none; background:transparent; color:#102b49; font-size:15px; }
.article-search input::placeholder { color:#62738b; opacity:1; }
.article-search button { display:flex; align-items:center; justify-content:center; gap:10px; flex:none; min-height:44px; padding:10px 16px; border:0; border-radius:7px; color:#fff; background:#1463e5; font-size:13px; font-weight:600; }
.article-search button:hover { background:#034ed4; }
.article-search button svg { width:17px; height:17px; }
.article-search button:focus-visible { outline:2px solid #102b49; outline-offset:2px; }
.support-reading-grid { display:grid; grid-template-columns:220px minmax(0,740px) 184px; gap:40px; justify-content:space-between; align-items:start; padding-top:36px; }
.article-navigation { position:sticky; top:100px; max-height:calc(100dvh - 124px); overflow:auto; padding:0 22px 24px 0; border-right:1px solid var(--reading-line); scrollbar-width:thin; }
.article-navigation nav, .article-mobile-menu nav { font-size:13px; line-height:1.5; }
.article-menu-home { display:block; padding:10px 12px; color:var(--reading-muted); }
.article-menu-group { margin:24px 0 0; }
.article-menu-group h2 { margin:0 0 7px; padding:0 12px; font-size:12px; font-weight:650; letter-spacing:0; color:#253b58; }
.article-menu-group ul, .article-contents ul { padding:0; margin:0; list-style:none; }
.article-menu-group li a { display:block; border-radius:6px; padding:9px 12px; color:var(--reading-muted); overflow-wrap:anywhere; }
.article-menu-group li a:hover { color:#144faf; background:#f4f7fc; }
.article-menu-group li a[aria-current="page"] { color:#164fac; background:#edf3fe; font-weight:600; }
.article-reading-column { min-width:0; }
.article-breadcrumb { display:flex; align-items:baseline; gap:9px; color:var(--reading-muted); font-size:12px; line-height:1.55; margin-bottom:28px; }
.article-breadcrumb [aria-current] { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.article-breadcrumb > a { flex:none; }
.article-category { color:#285da4; font-size:12px; font-weight:650; display:inline-block; margin-bottom:12px; }
.article-reading-header h1 { margin:0 0 14px; font-size:clamp(30px,3.2vw,40px); line-height:1.15; font-weight:650; letter-spacing:-.038em; text-wrap:balance; }
.article-reading-header > p { margin:0; color:#455c78; font-size:18px; line-height:1.6; }
.article-reading-header { margin-bottom:32px; }
.article-meta { display:flex; flex-wrap:wrap; gap:7px 20px; margin-top:20px; color:var(--reading-muted); font-size:12px; line-height:1.6; }
.article-no-results button { min-height:44px; border:0; background:none; padding:6px 0; color:#225799; font-size:13px; font-weight:550; text-align:left; }
.article-no-results button:hover { color:#0b63ec; text-decoration:underline; text-underline-offset:3px; }
.article-prose { color:#314762; font-size:16px; line-height:1.8; overflow-wrap:anywhere; }
.article-prose > :first-child { margin-top:0; }
.article-prose p { margin:0 0 22px; line-height:1.8; }
.article-prose h2, .article-prose h3, .article-prose h4 { color:#102b49; line-height:1.3; scroll-margin-top:110px; }
.article-prose h2 { font-size:25px; font-weight:650; letter-spacing:-.025em; margin:42px 0 18px; padding-top:24px; border-top:1px solid var(--reading-line); }
.article-prose h2:first-child { padding-top:0; border:0; }
.article-prose h3 { font-size:19px; margin:28px 0 12px; letter-spacing:-.02em; }
.article-prose h4 { font-size:17px; margin:22px 0 10px; }
.article-prose a { color:#1559b4; text-decoration:underline; text-decoration-color:#b4ccee; text-underline-offset:3px; }
.article-prose a:hover { text-decoration-color:currentColor; }
.article-prose ul, .article-prose ol { padding-left:25px; margin:0 0 24px; }
.article-prose li { padding-left:4px; margin:8px 0; }
.article-prose li::marker { color:#536d91; }
.article-prose strong { font-weight:650; color:#193755; }
.article-prose blockquote { margin:24px 0; padding:15px 20px; border-left:3px solid #7595cb; background:#f6f8fc; border-radius:0 6px 6px 0; font-size:15px; }
.article-prose blockquote > :last-child { margin-bottom:0; }
.article-prose code { padding:2px 5px; border:1px solid #e0e6ee; border-radius:4px; background:#f6f8fb; color:#253e5c; font-size:.88em; }
.article-prose pre { padding:20px; overflow:auto; border:1px solid #dfe6ef; border-radius:8px; background:#f7f9fc; line-height:1.6; }
.article-prose pre code { padding:0; border:0; background:none; }
.article-prose hr { border:0; border-top:1px solid var(--reading-line); margin:32px 0; }
.article-pagination { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; margin-top:44px; padding-top:24px; border-top:1px solid var(--reading-line); }
.article-pagination a { display:flex; align-items:center; gap:16px; min-width:0; min-height:96px; padding:18px; border:1px solid #dce5f1; border-radius:12px; transition:background-color 160ms ease-out,border-color 160ms ease-out; }
.article-pagination a:hover { border-color:#91b2e5; background:#f4f8ff; }
.article-pagination-arrow { display:grid; place-items:center; flex:none; width:36px; height:36px; border-radius:50%; color:#245ba9; background:#edf3fc; }
.article-pagination-arrow svg { width:19px; height:19px; }
.article-pagination-previous .article-pagination-arrow svg { transform:rotate(180deg); }
.article-pagination-copy { min-width:0; }
.article-pagination-copy > span { display:block; margin-bottom:6px; color:var(--reading-muted); font-size:12px; line-height:1.4; }
.article-pagination strong { display:block; color:#173d71; font-size:16px; line-height:1.4; font-weight:600; overflow-wrap:anywhere; }
.article-pagination-next { grid-column:2; flex-direction:row-reverse; text-align:right; }
.article-pagination-next .article-pagination-copy { margin-left:auto; }
.article-page-rail { position:sticky; top:104px; max-height:calc(100dvh - 128px); overflow:auto; padding-top:4px; scrollbar-width:thin; }
.article-page-rail > strong { font-size:12px; font-weight:650; }
.article-contents { margin-top:14px; }
.article-contents li a { display:block; padding:7px 0 7px 13px; border-left:1px solid #dfe6ef; color:var(--reading-muted); font-size:12px; line-height:1.5; }
.article-contents .article-contents-sub a { padding-left:25px; }
.article-contents a:hover { color:#1458b0; }
.article-contents a[aria-current="location"] { border-left:2px solid #2462c1; color:#1c55a2; font-weight:600; }
.article-mobile-menu, .article-mobile-contents { display:none; }
.support-reading-collection { grid-template-columns:220px minmax(0,1fr); justify-content:initial; }
.support-reading-collection .article-reading-column { max-width:860px; }
.article-collection-group { margin-top:36px; }
.article-collection-group h2 { font-size:20px; font-weight:650; margin:0 0 12px; }
.article-collection-group ul { list-style:none; padding:0; margin:0; border-top:1px solid var(--reading-line); }
.article-collection-group li { border-bottom:1px solid var(--reading-line); }
.article-collection-group li a { display:grid; grid-template-columns:minmax(0,1fr) 20px; gap:6px 24px; padding:23px 8px; }
.article-collection-group li a:hover { background:#f8faff; }
.article-collection-group h3 { font-size:17px; font-weight:600; line-height:1.4; letter-spacing:-.015em; margin:0; color:#214b82; }
.article-collection-group p { grid-column:1; color:var(--reading-muted); font-size:14px; line-height:1.6; margin:0; max-width:70ch; }
.article-collection-group li a > span { grid-column:2; grid-row:1 / 3; align-self:center; color:#2a5e9c; }
.article-no-results { margin-top:40px; padding-top:28px; border-top:1px solid var(--reading-line); }
.article-no-results h2 { font-size:23px; }
.article-no-results p { color:var(--reading-muted); font-size:15px; }
.article-no-results a { font-size:13px; color:#225799; margin-right:24px; }
@media(max-width:1279px) {
  .support-reading-grid { grid-template-columns:200px minmax(0,1fr); gap:32px; }
  .article-page-rail { display:none; }
  .article-mobile-contents { display:block; padding:0 0 20px; margin-bottom:24px; border-bottom:1px solid var(--reading-line); }
  .article-mobile-contents summary { cursor:pointer; min-height:44px; display:flex; align-items:center; gap:10px; color:#285581; font-size:13px; font-weight:600; }
  .article-mobile-contents summary::before { content:'+'; font-size:18px; font-weight:400; }
  .article-mobile-contents[open] summary::before { content:'−'; }
  .article-mobile-contents .article-contents { margin-top:4px; }
  .article-mobile-contents .article-contents a { padding-block:11px; }
}
@media(max-width:800px) {
  .support-reading { padding:0 24px 64px; }
  .support-reading-hero-inner { align-items:stretch; flex-direction:column; gap:24px; padding:28px 24px; }
  .support-reading-title { font-size:30px; }
  .support-reading-intro p { max-width:40ch; font-size:14px; }
  .support-reading-grid { display:block; padding-top:20px; }
  .article-navigation { display:none; }
  .article-mobile-menu { display:block; margin-bottom:28px; border-bottom:1px solid var(--reading-line); }
  .article-mobile-menu summary { cursor:pointer; min-height:44px; color:#234b83; font-size:14px; font-weight:600; }
  .article-mobile-menu nav { padding:0 0 20px; }
  .article-menu-group li a { padding-block:12px; }
  .article-reading-header h1 { font-size:32px; }
  .article-reading-header > p { font-size:17px; }
  .article-breadcrumb { margin-bottom:24px; }
  .article-search { width:100%; }
  .article-search input { font-size:16px; }
  .article-prose h2 { font-size:23px; }
}
@media(max-width:1000px) and (min-width:801px) { .article-search { width:42%; } .article-search button { padding-inline:12px; } .article-search button svg { display:none; } }
@media(max-width:420px) { .support-reading, .support-reading-hero-inner { padding-inline:20px; } .article-search { gap:10px; padding-left:14px; } .article-search button { width:44px; padding:12px; } .article-search button > span { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; } .article-pagination { grid-template-columns:1fr; gap:12px; } .article-pagination-next { grid-column:auto; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }
