/* Pages for firms: /for-trades/, registrations by trade, group and trade pages, guides for firms (package S).
   Builds on guides.css and firms.css. Sizes in rem so text grows with the phone's text size. */
.trades-shell .guide-heading h1 { font-size: clamp(1.875rem, 1.2rem + 3vw, 3rem); }
.free-terms { margin: 0.75rem 0 0; color: var(--teal); font-size: 1rem; font-weight: 700; line-height: 1.5; }
.trade-cta { margin: 1.5rem 0; }
.trade-cta .offer-actions { margin: 0 0 0.5rem; }
.cta-terms { margin: 0; color: var(--muted); font-size: 0.9375rem; line-height: 1.5; }
.offer-actions .text-link { min-height: 44px; }
.cost-lead { margin: 1.25rem 0 0; padding: 1rem 1.25rem; border-left: 4px solid var(--teal); border-radius: 0 0.875rem 0.875rem 0; background: #fff; color: var(--text); font-size: 1.125rem; line-height: 1.6; }
.cost-lead strong { color: var(--teal); white-space: nowrap; }
.cost-basis { display: block; margin-top: 0.375rem; color: var(--muted); font-size: 0.9375rem; }
.why-list li { margin: 0.75rem 0; }
.check-list .legal { display: block; margin-top: 0.375rem; color: var(--muted); font-size: 0.9375rem; line-height: 1.6; }
.check-list a, .related-trades a, .trade-groups a, .source-list a { display: inline-flex; align-items: center; min-height: 44px; }
.check-list li { line-height: 1.6; }
.checks-example { margin: 1.25rem 0; padding: 1rem 1.25rem; border: 1px solid var(--border); border-radius: 0.875rem; background: #fff; }
.checks-example-date { margin: 0 0 0.25rem; color: var(--text); font-weight: 700; }
.checks-example ul { margin: 0; padding-left: 1.25rem; }
.checks-example li { margin: 0.25rem 0; }
.guide-body .related-trades, .guide-body .trade-groups { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(16rem, 100%), 1fr)); gap: 0 1.25rem; padding-left: 0; list-style: none; }
.related-trades li, .trade-groups li { margin: 0.25rem 0; }
.trade-groups li { padding: 0.5rem 0; border-top: 1px solid var(--border); }
.trade-groups .group-link { display: flex; font-weight: 700; }
.group-count { display: block; color: var(--muted); font-size: 0.875rem; }
.group-pages { display: block; font-size: 0.9375rem; line-height: 1.5; }
.group-pages a { min-height: 44px; }
.check-block { margin: 1.5rem 0; padding: 1rem 1.25rem; border: 1px solid var(--border); border-radius: 0.875rem; background: #fff; }
.check-block h3 { margin-top: 0; }
.check-block p { margin: 0.5rem 0; }
.legal-basis .legal { color: var(--body); }
.check-sources { font-size: 0.875rem; color: var(--muted); }
.check-block a { display: inline-flex; align-items: center; min-height: 44px; }
.guide-body q { font-style: italic; }
.guide-body q::before { content: "\201C"; }
.guide-body q::after { content: "\201D"; }
.fee-table th[scope="row"] { min-width: 8rem; }
.guide-body .fee-table td, .guide-body .group-table td { overflow-wrap: normal; word-break: normal; hyphens: none; }
@media (min-width: 601px) { .fee-table td:nth-child(2) { min-width: 9rem; } .fee-table td:nth-child(4) { min-width: 9rem; } .group-table td:nth-child(3), .group-table td:nth-child(4) { min-width: 9rem; } }
.group-table td:last-child a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 700; }
.trades-shell .guide-contents a { display: inline-flex; align-items: center; min-height: 44px; }
.group-table th[scope="row"] a { display: inline-flex; align-items: center; min-height: 44px; }
.trades-shell .guide-grid { margin-top: 1.5rem; }
.trades-shell .guide-card { display: block; }
.trades-shell .guide-card span { display: inline-flex; align-items: center; min-height: 44px; }
@media (max-width: 600px) {
  .cost-lead { font-size: 1.0625rem; padding: 0.875rem 1rem; }
  .cost-lead strong { white-space: normal; }
  .trade-cta .button { width: 100%; }
}
.checks-example-kind { margin: 0.75rem 0 0.25rem; color: var(--text); font-weight: 600; }
.checks-example-meta { margin: 0.25rem 0 0; color: var(--muted); font-size: 0.875rem; }
/* /for-trades/: the trade picker's groups are closed sections (folded_picker in build_trade_pages.py), so on a phone the
   search and the 8 group headings come first and the list is no longer one long scroll inside the page. */
.pick-groups.pick-folded { gap: 0; max-height: none; overflow: visible; padding: 0; }
.pick-folded details.pick-group { padding: 0; border-bottom: 1px solid var(--border); }
.pick-folded details.pick-group:last-child { border-bottom: 0; }
.pick-folded .pick-group-name { display: flex; align-items: center; gap: 0.5rem; min-height: 44px; padding: 0.5rem 0.75rem; color: var(--teal); font-weight: 800; line-height: 1.35; cursor: pointer; list-style: none; }
.pick-folded .pick-group-name::-webkit-details-marker { display: none; }
/* The same chevron as "Show checks" on a firm's card: pointing right while closed, down once open. */
.pick-folded .pick-group-name::before { content: ""; flex: none; width: 0.5rem; height: 0.5rem; margin: 0 0.25rem 0 0.125rem; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(-45deg); }
.pick-folded details[open] > .pick-group-name::before { transform: rotate(45deg); }
.pick-folded .pick-group-name:focus-visible { outline: 3px solid var(--teal); outline-offset: -3px; }
.pick-folded .pick-group-count { color: var(--muted); font-weight: 600; white-space: nowrap; }
.pick-folded .pick-fieldset { min-width: 0; margin: 0; padding: 0 0.75rem 0.5rem; border: 0; }