/* /faq/: the six CEO questions (moved from the home page in the five-screen cut).
   Page-local; tokens and theme.css classes only (.faq is in theme.css). Phone first (375), then 768 and 1100. */

/* Apple: a white page, like the home page. candidate for look-apple.css (--paper: #ffffff) */
html[data-look="apple"] { --paper: #ffffff; }

.faq-page { padding-block: var(--space-4) var(--band-pad); }
.faqs__head { display: flex; flex-direction: column; gap: var(--space-2); margin-bottom: var(--space-4); }
.faqs__head .h-1 { max-width: 14em; }
.faqs__list .faq summary { padding-right: 2px; }
.faqs__end { display: flex; flex-direction: column; gap: var(--space-2); margin-top: var(--space-5); }
.faqs__end > p { margin: 0; }
@media (min-width: 768px) { .faq-page { padding-top: var(--space-5); } }
@media (min-width: 1100px) {
  .faqs { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: var(--space-5); align-items: start; }
  .faqs__head { margin-bottom: 0; position: sticky; top: 96px; }
  .faqs__end { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: var(--space-2) var(--space-5); }
  .faqs__end > * { grid-column: 2; }
}
html[data-look="editorial"] .faqs__head { border-top: var(--rule-w) solid var(--rule); padding-top: var(--space-2); }
