/* faq.html — page-specific additions (tokens from site.css only) */

/* No-JS fallback: keep every answer readable when main.js is unavailable.
   main.js sets panel.hidden on init, so this only applies before/without JS.
   !important is needed to beat the global [hidden] { display: none !important }. */
.no-js .faq__panel[hidden] { display: block !important; }
.no-js .faq__panel { max-height: none; }

/* Hero proportion: five-column square plate, seven-column text, one-column gutter between. */
@media (min-width: 901px) {
  .page--faq .page-hero__text { grid-column: 1 / span 7; }
  .page--faq .page-hero__side { grid-column: 8 / span 5; }
}

/* Accordion icon: open state rotates the whole plus into an x, never a lone horizontal line. */
.page--faq .faq__icon { transition: transform var(--dur) var(--ease); }
.page--faq .faq__item.is-open .faq__icon { transform: rotate(45deg); }
.page--faq .faq__item.is-open .faq__icon::after { transform: translate(-50%, -50%); }