/* faq. Scoped to its root class. Colours come only from tokens.css. */
.sk.sk-faq { background: var(--sk-ground); }
.sk.sk-faq .sk-title { font-size: clamp(30px, 3.7cqi, 48px); }
.sk.sk-faq .sk-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr); gap: clamp(32px, 6cqi, 88px); padding-block: var(--sk-section-y); align-items: start; }
.sk.sk-faq .sk-side { display: flex; flex-direction: column; gap: 18px; }
.sk.sk-faq .sk-eyebrow { color: var(--sk-accent-text); }
.sk.sk-faq .sk-pic { aspect-ratio: 16 / 9; margin-top: 10px; border-radius: var(--sk-radius-lg); }
.sk.sk-faq .sk-list { border-top: var(--sk-stroke-bold) solid var(--sk-ink); }
.sk.sk-faq .sk-item { border-bottom: var(--sk-stroke) solid var(--sk-ink); }
.sk.sk-faq .sk-q { display: flex; justify-content: space-between; align-items: center; gap: 20px; min-height: 68px; padding-block: 14px; cursor: pointer; font-size: var(--sk-text-lg); font-weight: 700; line-height: 1.25; list-style: none; }
.sk.sk-faq .sk-q::-webkit-details-marker { display: none; }
.sk.sk-faq .sk-plus { flex: none; position: relative; width: 22px; height: 22px; }
.sk.sk-faq .sk-plus::before, .sk.sk-faq .sk-plus::after { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: var(--sk-stroke-bold); margin-top: calc(var(--sk-stroke-bold) / -2); background: var(--sk-accent-text); transition: transform var(--sk-motion-base) var(--sk-ease); }
.sk.sk-faq .sk-plus::after { transform: rotate(90deg); }
.sk.sk-faq .sk-item[open] .sk-plus::after { transform: rotate(0deg); }
.sk.sk-faq .sk-grid:not(:has(.sk-list > :nth-child(4))) .sk-pic { aspect-ratio: 3 / 1; }
.sk.sk-faq .sk-a { padding-bottom: 22px; max-width: 62ch; line-height: 1.55; text-wrap: pretty; }
@container sk (max-width: 760px) {
  .sk.sk-faq .sk-grid { grid-template-columns: minmax(0, 1fr); }
}