/* FAQ: only what the original markup can't express after the Premier edits. Values come from summit.css. */

/* The panel keeps the tallest tab's height (4 rows: 4 × 60 + 3 × 16) so switching tabs never moves the page.
   The original's 476 was sized for five rows with the "Ask about us." row beside them; both are gone. */
.section-faq .faq-panel { min-height: 288px; }

/* Tablet (768–1099): the original stacks the columns but squeezes the title to 36% and shrink-wraps the FAQ
   column to its tab list, which with three short tabs would leave a 340px column. Both go full width. */
@media (min-width: 768px) and (max-width: 1099px) {
  .section-faq [data-name="Section Title"],
  .section-faq .summit-faq { width: 100%; }
}

@media (max-width: 767px) {
  .section-faq .faq-panel { min-height: 0; }
  /* The search filters the list below it, so it keeps its desktop place (the original's ask box sits last). */
  .section-faq .faq-tabs > .custom-question { order: 0; }
  /* The no-match line keeps the desktop's 12px corners (the original squares the expanded box on phones). */
  .section-faq .custom-question[data-expanded="true"] { border-radius: 12px; }
}

/* Keyboard focus. The site's ring (2px #e7ae4b, offset 4) is clipped in the original: by the item's overflow on a
   question (only a stray line under an open one shows) and by the scrolling tab bar on a tab (a sliver shows).
   Questions draw it on the item instead; tabs draw it inside the tab (offset -2, as summit.css does elsewhere). */
.section-faq .summit-faq-item:has(.summit-faq-trigger:focus-visible) { outline: 2px solid #e7ae4b; outline-offset: 4px; }
.section-faq .summit-faq-trigger:focus-visible { outline: none; box-shadow: none; }
.section-faq .faq-tab:focus-visible { outline-offset: -2px; }