/* Local reading layer for homepage, Plus and the separate Moa products. */
/* Shared navigation, footer, application forms and customer screens stay upstream. */
body.service-detail-page.service-reading,
body.series-page.service-reading {
  --canvas: #f8f5ed;
  --surface: #fffdf9;
  --ink: #263229;
  --copy: #626b61;
  --muted: #626b61;
  --line: #dddcd2;
  --blue: #3156d6;
  --service-accent: #3156d6;
  --service-focus: #3156d6;
  background: var(--canvas);
  color: var(--ink);
}
body.service-reading main { min-width: 0; }
body.service-reading main :is(h1, h2, h3, h4) { color: var(--ink); word-break: keep-all; overflow-wrap: anywhere; }
body.service-reading main :is(a, button, summary):focus-visible { outline: 3px solid var(--blue); outline-offset: 4px; }
body.service-reading .service-reading-icon { display: block; width: 25px; height: 25px; flex: 0 0 25px; color: var(--blue); }
body.service-reading main .search-kicker { color: var(--blue); }
body.service-reading .sr-switch-controls button[aria-pressed="true"] { background: #edf1fc; color: var(--blue); border-bottom-color: var(--blue); }
body.service-reading .sr-switch-controls button:not([aria-pressed="true"]):hover { background: #f0eee5; color: var(--ink); }
body.service-reading .search-faq summary::marker { color: var(--blue); }
body.service-reading .search-faq details { padding-block: 0; }
body.service-reading .search-faq summary { padding-block: 22px; min-height: 64px; }
body.service-reading .search-faq details > p { margin-top: 0; margin-bottom: 24px; }

/* Homepage: compare the scope as a table and follow the existing three steps. */
body.sr-homepage.service-reading .service-support-table thead { background: #edf1fc; }
body.sr-homepage.service-reading .service-support-table thead th { color: #2848b3; }
body.sr-homepage.service-reading .service-support-table tbody td:last-child { color: var(--copy); }
body.sr-homepage.service-reading .sr-number { display: inline-flex; align-items: center; gap: 12px; }
body.sr-homepage.service-reading .sr-publish { background: #edf1fc; }
body.sr-homepage.service-reading .sr-publish > span .service-reading-icon { width: 46px; height: 46px; }
body.sr-homepage.service-reading .sr-method summary { gap: 24px; }
body.sr-homepage.service-reading .service-reading-disclosure { display: flex; align-items: center; justify-content: center; flex: 0 0 24px; }
body.sr-homepage.service-reading .sr-method details[open] .service-reading-disclosure-vertical { display: none; }
body.sr-homepage.service-reading .sr-role-compare > div { padding-top: 14px; border-top: 1px solid var(--line); }
body.sr-homepage.service-reading .sr-role-compare h4 { margin-top: 0; color: var(--blue); }
body.sr-homepage.service-reading .service-price-grid article { color: var(--ink); background: var(--surface); }
body.sr-homepage.service-reading .service-price-grid article.is-plus { color: var(--ink); background: #edf1fc; }
body.sr-homepage.service-reading .service-price-grid :is(dt, h3 small) { color: var(--copy); }
body.sr-homepage.service-reading .service-price-grid h3 strong { font-variant-numeric: tabular-nums; }

/* Plus: the source is separate from the three output destinations. */
/* Size the two full-bleed backgrounds from the page, excluding its scrollbar. */
body.sr-plus.service-reading #service-main { container-type: inline-size; }
body.sr-plus.service-reading :is(#examples, #price)::before { width: 100cqw; }
body.sr-plus.service-reading .sr-data-source { background: var(--surface); box-shadow: none; border-top: 3px solid var(--blue); }
body.sr-plus.service-reading .sr-channel-results { align-self: stretch; align-items: center; }
body.sr-plus.service-reading .sr-destination-icon { display: flex; align-items: center; justify-content: center; min-height: 38px; }
body.sr-plus.service-reading .sr-destination-icon .service-reading-icon { width: 32px; height: 32px; }
body.sr-plus.service-reading .sr-channel-results h3 { word-break: keep-all; }
body.sr-plus.service-reading [data-channel-label] { background: #edf1fc; color: #2848b3; }
body.sr-plus.service-reading [data-channel-sold-out="true"] [data-channel-label] { background: #f3e9dd; color: #7b4927; }
body.sr-plus.service-reading .sr-status-controls button:disabled { color: var(--copy); background: #f0eee5; border-color: var(--line); cursor: default; }
body.sr-plus.service-reading .service-scope { gap: 40px; }
body.sr-plus.service-reading .service-scope section + section { padding-left: 40px; }
body.sr-plus.service-reading .service-scope section > span { color: var(--blue); }
body.sr-plus.service-reading .service-scope li { color: var(--copy); }
body.sr-plus.service-reading .did-single-price { background: var(--surface); }
body.sr-plus.service-reading .did-single-price > div:first-child { background: #edf1fc; }
body.sr-plus.service-reading .did-single-price h3 { color: var(--ink); font-variant-numeric: tabular-nums; }

/* These pages end in the same blue service action as the approved renewal page. */
body.service-reading :is(.service-final) { background: var(--blue); color: #fff8e9; }
body.service-reading .service-final h2 { color: inherit; }
body.service-reading .service-final :is(.search-kicker, p:not(.search-kicker)) { color: #edf0fc; }
body.service-reading .service-final a:first-child { color: #2848b3; background: var(--canvas); border-color: var(--canvas); }
body.service-reading .service-final a + a { color: #fffdf9; background: transparent; border-color: #b7c4f2; }
body.service-reading .service-final a:focus-visible { outline-color: #fff8e9; }

/* Moa Series: product purpose, connection method and the official destination. */
body.series-page.service-reading .series-comparison { border-top: 1px solid var(--ink); }
body.series-page.service-reading .series-product-name { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 0 13px; min-width: 0; }
body.series-page.service-reading .series-product-name > .service-reading-icon { grid-column: 1; grid-row: 1 / 4; margin-top: 2px; }
body.series-page.service-reading .series-product-name > :is(span, h3, a) { grid-column: 2; min-width: 0; }
body.series-page.service-reading .series-product-name > span { color: var(--blue); }
body.series-page.service-reading .series-product-name h3 { margin-top: 10px; }
body.series-page.service-reading .series-product-name > a { overflow-wrap: anywhere; }
body.series-page.service-reading .series-comparison dl { gap: 0; margin-top: 22px; border-top: 1px solid var(--line); }
body.series-page.service-reading .series-comparison dl > div { padding-block: 10px; border-bottom: 1px solid var(--line); }
body.series-page.service-reading .series-product-link { color: #2848b3; }
body.series-page.service-reading .editorial-columns { gap: 40px; }
body.series-page.service-reading .editorial-columns > section { border-top-color: var(--line); }
body.series-page.service-reading .series-boundary { border-top-color: var(--line); }
body.series-page.service-reading .search-related a { background: transparent; }
body.series-page.service-reading .search-related a:hover { background: #edf1fc; color: #2848b3; border-color: #b4c2ed; }

@media (min-width: 801px) {
  body.service-reading .search-section { padding-block: 64px; }
  body.service-reading .search-section > header { margin-bottom: 32px; }
  body.sr-homepage.service-reading .sr-process-panel { gap: 48px; padding-block: 34px; min-height: 392px; }
  body.sr-homepage.service-reading .sr-method { padding-block: 0 54px; }
  body.series-page.service-reading .series-products { padding-top: 38px; }
  body.series-page.service-reading .series-comparison > article { gap: 32px; }
}
@media (max-width: 800px) {
  body.series-page.service-reading .series-comparison > article { gap: 20px 28px; }
}
@media (max-width: 600px) {
  body.service-reading .search-faq summary { padding-block: 20px; }
  body.sr-homepage.service-reading .sr-method summary { gap: 10px; }
  body.sr-homepage.service-reading .sr-role-compare { gap: 14px; }
  body.sr-plus.service-reading .sr-channel-results { grid-template-columns: minmax(0, 1fr); }
  body.sr-plus.service-reading .sr-channel-results > div { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; align-items: center; gap: 5px 12px; padding: 18px 0; text-align: left; }
  body.sr-plus.service-reading .sr-channel-results > div + div { border-left: 0; border-top: 1px solid var(--line); }
  body.sr-plus.service-reading .sr-destination-icon { grid-column: 1; grid-row: 1 / 3; }
  body.sr-plus.service-reading .sr-destination-icon .service-reading-icon { width: 28px; height: 28px; }
  body.sr-plus.service-reading .sr-channel-results h3 { grid-column: 2; min-height: 0; display: block; font-size: 16px; line-height: 1.5; }
  body.sr-plus.service-reading .sr-channel-results [data-channel-label] { grid-column: 3; grid-row: 1; justify-self: end; font-size: 12px; }
  body.sr-plus.service-reading .sr-channel-results small { grid-column: 2 / 4; font-size: 13px; line-height: 1.6; }
  body.sr-plus.service-reading .service-scope { gap: 0; }
  body.sr-plus.service-reading .service-scope section + section { padding-left: 0; }
  body.series-page.service-reading .editorial-columns { gap: 28px; }
  body.series-page.service-reading .series-comparison > article { gap: 22px; }
  body.series-page.service-reading .series-product-name { grid-template-columns: 28px minmax(0, 1fr); gap: 0 12px; }
}