/* The one way the questions (FAQ) are shown on every page except the homepage (Charlie, 11 Nov 2026: "a set way we
   display the FAQ ... centralised and smaller and more condensed ... not changing any text or how it looks").

   Size and place only: the section runs the page's full width (1200 px) so it is as short as it can be, the title is
   smaller and centred, three columns of short rows (two on a tablet, one on a phone), small type, tight rows but not
   squeezed. Colours, hairlines, chevrons and every word stay as each page has them. This file loads last (build.py),
   after every page style, so one rule here beats the page files; the geometry properties carry !important for that
   reason. The homepage loads it too: one FAQ, one look, on every page.
   Rows are the folding <details> list built by standard_layout.py (or the team's own list on the pages it leaves alone). */
html[data-wl-redesign] :is(.wl-faq-section-1, [class*="wl-faq-section-1-copy"]) {
  --faq-col: var(--wl-max, 1200px);
  padding-top: clamp(32px, 4vw, 56px) !important;
  padding-bottom: clamp(32px, 4vw, 56px) !important;
  padding-left: var(--wl-gutter, 20px) !important;
  padding-right: var(--wl-gutter, 20px) !important;
}
html[data-wl-redesign] :is(.wl-faq-section-1, [class*="wl-faq-section-1-copy"]) :is(.wl-faq-container-1, .faq-sb, .sp-container) {
  width: 100% !important;
  max-width: var(--faq-col) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 0 !important;
  display: block !important;
}
/* title: small, centred, one size on every page */
html[data-wl-redesign] :is(.wl-faq-section-1, [class*="wl-faq-section-1-copy"]) .wl-faq-header {
  margin: 0 0 20px !important;
  padding: 0 !important;
  text-align: center !important;
  position: static !important;
}
html[data-wl-redesign] :is(.wl-faq-section-1, [class*="wl-faq-section-1-copy"]) .wl-faq-header > :is(h1, h2, h3, h4, h5),
html[data-wl-redesign] :is(.wl-faq-section-1, [class*="wl-faq-section-1-copy"]) .wl-faq-title-1 {
  margin: 0 !important;
  font-family: Bungee, "Poppins", sans-serif !important;
  font-size: clamp(1.15rem, 1rem + .6vw, 1.5rem) !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  text-transform: none !important;
}
html[data-wl-redesign] :is(.wl-faq-section-1, [class*="wl-faq-section-1-copy"]) .wl-faq-header :is(strong, b) { font-weight: inherit !important; }
html[data-wl-redesign] :is(.wl-faq-section-1, [class*="wl-faq-section-1-copy"]) .wl-faq-intro,
html[data-wl-redesign] :is(.wl-faq-section-1, [class*="wl-faq-section-1-copy"]) .wl-faq-pretitle {
  margin: -6px auto 20px !important;
  max-width: 760px !important;
  text-align: left !important;  /* body text is never centred (the house rule); the block sits under the centred title */
}
html[data-wl-redesign] :is(.wl-faq-section-1, [class*="wl-faq-section-1-copy"]) .wl-faq-intro p {
  margin: 0 0 6px !important;
  max-width: none !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
}
/* the list: two columns, tight rows */
html[data-wl-redesign] :is(.wl-faq-section-1, [class*="wl-faq-section-1-copy"]) .wl-faq-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 0 40px !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  align-items: start !important;
}
html[data-wl-redesign] :is(.wl-faq-section-1, [class*="wl-faq-section-1-copy"]) .wl-faq-grid > details > summary {
  padding: 11px 0 !important;
  font-size: 13.5px !important;
  line-height: 1.38 !important;
  gap: 12px !important;
  align-items: center !important;
}
html[data-wl-redesign] :is(.wl-faq-section-1, [class*="wl-faq-section-1-copy"]) .wl-faq-grid > details > summary > span { font-size: inherit !important; line-height: inherit !important; }
html[data-wl-redesign] :is(.wl-faq-section-1, [class*="wl-faq-section-1-copy"]) .wl-faq-grid .wl-faq-arrow-1 { font-size: 11px !important; line-height: 1 !important; }
html[data-wl-redesign] :is(.wl-faq-section-1, [class*="wl-faq-section-1-copy"]) .wl-faq-grid .wl-faq-answer-1-2 {
  padding: 0 0 14px !important;
  font-size: 13px !important;
  line-height: 1.55 !important;
}
html[data-wl-redesign] :is(.wl-faq-section-1, [class*="wl-faq-section-1-copy"]) .wl-faq-grid .wl-faq-answer-1-2 :is(p, ul, ol, li) { font-size: inherit !important; line-height: inherit !important; }
@media (max-width: 991px) {
  html[data-wl-redesign] :is(.wl-faq-section-1, [class*="wl-faq-section-1-copy"]) .wl-faq-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 0 32px !important; }
}
@media (max-width: 640px) {
  html[data-wl-redesign] :is(.wl-faq-section-1, [class*="wl-faq-section-1-copy"]) .wl-faq-grid { grid-template-columns: minmax(0, 1fr) !important; }
}
