/* Installer partners (/partners/): page-specific rules on top of css/site.css. Tokens only. Linked from partners.html only. */

/* page-level rules: the breadcrumb slash keeps its gap before the current page, and an H1 or H2 does not split a short word at a hyphen */
.sb-breadcrumb li[aria-current]::before { margin-right: 8px; }
h1, h2, h3, .sb-head h2 { hyphens: auto; hyphenate-limit-chars: 12 5 5; overflow-wrap: anywhere; }   /* only a very long word is hyphenated; none is cut in two at a normal size, and none can overflow at 200% text size */
/* a link inside a sentence or a table cell flows with the text (the system draws it as an inline block, which leaves holes in a wrapped line) */
.sb-table .sb-link, .sb-faq__item p .sb-link, main p > .sb-link { display: inline; }
.sb-table .sb-link svg { display: none; }

/* hero: the long H1 sits at the inner-page size; the answer box is a little smaller than the pillar's */
.pt-hero h1 { max-width: none; font-size: var(--fs-h1); line-height: var(--lh-h1); letter-spacing: var(--trk-h1); }
.pt-hero .sb-answer > p:first-child { font-size: clamp(1.125rem, 1.07rem + .3vw, 1.3125rem); }
.pt-hero .sb-hero__media img { object-position: 30% 50%; }   /* the house photograph: the gable and both garage doors stay in the tall frame from 64em */
@media (min-width: 64em) { .pt-hero { min-height: 560px; } .pt-hero h1 { max-width: 17ch; } }

/* state outlines and the market head cells */
.pb-state { width: 44px; height: 44px; flex: none; }
.pb-state path.o { fill: var(--sky-soft); stroke: var(--navy); stroke-width: 1.8; stroke-linejoin: round; }
.pb-state circle { fill: var(--gold); stroke: var(--navy); stroke-width: 1.6; }
.pb-mk { display: inline-flex; align-items: center; gap: var(--sp-3); }
.pb-glyph { flex: none; }

/* H3 used as a section head: the grid placement the H2 gets in .sb-head */
@media (min-width: 64em) {
  .pt-head h3 { grid-column: 1 / span 7; }
  .pt-head p { grid-column: 8 / span 5; }
}
.pt-head h3 { font-weight: var(--w-display); }

/* what the term says: a drawn mark and a bold word, so the answer never rests on colour */
.pt-yn { display: inline-flex; align-items: center; gap: 6px; vertical-align: middle; }
.pt-yn b { font-weight: 700; color: var(--text); }
.pt-yn--yes svg { color: var(--positive); }
.pt-yn--no svg { color: var(--navy-soft); }
@media (min-width: 48em) { .sb-sheet .sb-table--terms td:nth-child(2) { min-width: 11rem; } }

/* the lookups sheet on the one dark band: a white sheet keeps the light-surface tokens */
.pt-lookups .sb-sheet { --text: var(--navy); --text-soft: var(--navy-soft); --rule: var(--line); --link-c: var(--link); --link-visited-c: var(--link-visited); --focus: var(--navy); --w-display: 600; background: var(--paper); border-color: var(--paper); color: var(--navy); }
@media (min-width: 64em) { .pt-lookups .sb-sheet .sb-table td { max-width: 22rem; } }
.pt-notes { margin-top: var(--sp-7); display: grid; gap: var(--sp-4); }
.pt-notes p { max-width: var(--measure); }
.pt-lookups .sb-source a { color: var(--link-on-dark); }
.pt-go { margin-top: var(--sp-6); padding-top: var(--sp-5); border-top: 1px solid var(--rule); }
.pt-go .sb-market-links__label { color: var(--text-soft); margin-bottom: var(--sp-2); font-size: var(--fs-body); }

/* related guides and the sourcing line */
.pt-trust { margin-top: var(--sp-7); padding-top: var(--sp-5); border-top: 1px solid var(--line-strong); display: grid; gap: var(--sp-2); max-width: 46rem; }
.pt-trust p { max-width: var(--measure); }
@media (min-width: 64em) { .sb-sources ol.pb-sources { max-width: none; columns: 2; column-gap: var(--sp-8); } .sb-sources ol.pb-sources li { break-inside: avoid; max-width: 31rem; } }

/* TABLES AND LISTS. Each of the two tables is a real table where it fits and a real list where it does not: the terms table from 48em, the four-column lookups table from 64em. The table keeps its own semantics (no role overrides, no hidden thead); the list under it is a labelled <ul> of <dl> items with the same words. The hidden one is display:none, so a reader meets each fact once. */
@media (max-width: 47.99em) { .pt-tbl--terms { display: none; } }
@media (min-width: 48em) { .pt-lst--terms { display: none; } }
@media (max-width: 63.99em) { .pt-tbl--lookups { display: none; } }
@media (min-width: 64em) { .pt-lst--lookups { display: none; } }
.sb-table--terms thead th, .sb-table--lookups thead th { font-size: var(--fs-ui); }   /* table cells are 16 px; the system sets head cells to 14 px */
.pt-lst { max-width: calc(36em + 2 * var(--sp-5)); }   /* the sheet is as wide as its list: no blank white beside a 36em measure on a large tablet */
.pt-lst__caption { margin: 0 0 var(--sp-3); font-size: var(--fs-caption); line-height: 1.5; color: var(--text-soft); max-width: 52rem; }
.pt-lst__list { list-style: none; margin: 0; padding: 0; border-top: 2px solid var(--navy); max-width: 36em; }   /* a prose measure: the tablet list never runs wider than 36em */
.pt-lst__list > li { padding: var(--sp-5) 0 var(--sp-5); border-bottom: 1px solid var(--rule); min-width: 0; }
.pt-lst__list > li:last-child { border-bottom-color: var(--navy); }
.pt-lst__h { font-size: 1.375rem; line-height: 1.2; letter-spacing: -.01em; color: var(--text); }
.pt-lst__h .pb-mk { align-items: center; }
.pt-lst__q { font-weight: 600; font-size: var(--fs-body); line-height: 1.4; color: var(--text); text-wrap: balance; }
.pt-lst dl { margin: var(--sp-3) 0 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--sp-4); min-width: 0; }   /* one track that may shrink: at 200 percent text size an auto track kept the widest link's width and pushed the page 45 px past a 320 px screen */
.pt-lst dt { font-size: var(--fs-caption); font-weight: 600; line-height: 1.4; color: var(--text-soft); }
.pt-lst dd { margin: 2px 0 0; font-size: var(--fs-body); line-height: 1.55; max-width: var(--measure); }
.pt-lst .sb-link svg { display: none; }
.pt-lst a.sb-cell-link { display: inline-block; padding-block: 10px; margin-block: -10px; }   /* a link that is the whole answer is a 44 px target that borrows the row's spacing */
@media (min-width: 48em) {
  .pt-lst--lookups .pt-lst__list > li { display: grid; grid-template-columns: 11rem minmax(0, 1fr); column-gap: var(--sp-6); align-items: start; }
  .pt-lst--lookups .pt-lst__h { padding-top: 2px; }
  .pt-lst--lookups .pt-lst__h .pb-mk { flex-direction: column; align-items: flex-start; gap: var(--sp-2); }
  .pt-lst--lookups dl { margin-top: 0; }
}

/* small repairs */
.sb-utility a[aria-current], .sb-footer li a[aria-current] { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: .3em; }   /* the current page is marked by more than colour */
.sb-closing .sb-note, .sb-footer__brand p { font-size: var(--fs-body); }                                  /* prose sentences are 18 px; the system sets them to 16 px */
@media (max-width: 63.99em) { .pt-hero .sb-answer { max-width: none; } }                                    /* the answer box runs the width of the heading on a tablet */
@media (min-width: 64em) { .pt-lookups .sb-head { align-items: start; } }                                  /* heading and lede share a top edge instead of the heading sinking to the foot of a seven-line lede */

/* the five checks: a wider right column and two columns of steps (numeral above the text) from 64em; the list stays one ordered list in reading order; below 64em it is a single column. */
@media (min-width: 64em) {
  #five-checks .sb-split__b { grid-column: 5 / span 8; }
  #five-checks .sb-steps { max-width: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--sp-7); }
  #five-checks .sb-steps > li { display: block; padding: var(--sp-5) 0 var(--sp-6); }
  #five-checks .sb-steps > li::before { display: block; margin-bottom: var(--sp-3); }
  #five-checks .sb-steps h3 { font-size: var(--fs-h4); line-height: 1.25; }
  #five-checks .sb-steps p { max-width: 36rem; }
}
#tells-you { font-size: var(--fs-h3); line-height: var(--lh-h3); letter-spacing: var(--trk-h3); }   /* a block heading: the H3 size of the type scale */