/* FAQ follows the shared site typography, surfaces and theme tokens. */
.faq-page { padding-bottom: 2.5rem; overflow-wrap: anywhere; }
.faq-intro { max-width: 65ch; font-size: 1.05rem; margin-bottom: 1.25rem; }
.faq-section { margin-block: 1.5rem; }
.faq-section h2, .faq-card h2 { font-size: 1.25rem; line-height: 1.35; margin: 0 0 .875rem; }
.faq-card, .faq-answer { border-radius: var(--border-radius); background: var(--white-color); box-shadow: var(--box-shadow-1); padding: 1.5rem; }
.faq-card > :last-child, .faq-answer > :last-child, .faq-section > :last-child { margin-bottom: 0; }
.faq-answer { border-left: 4px solid var(--theme-color); margin: 0 0 1.5rem; }
.faq-answer h2 { font-size: 1rem; margin: 0 0 .625rem; }
.faq-answer p { font-size: 1.0625rem; line-height: 1.65; }
.faq-dates { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; color: var(--gray-color); font-size: .8125rem; margin: 1rem 0 1.25rem; line-height: 1.5; }
.faq-home .section__header { margin-bottom: 1.25rem; }
.faq-list { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.125rem; }
.faq-home .faq-list, .template-faq-index .faq-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.faq-question-card.card { display: flex; flex-direction: column; height: 100%; padding: 1.375rem; border: 1px solid transparent; user-select: text; overflow: visible; transition: border-color .2s, box-shadow .2s; }
.faq-question-card h3 { margin: 0 0 .625rem; font-size: 1.125rem; line-height: 1.4; font-weight: 600; }
.faq-question-card .faq-list__link { color: var(--text-color); text-decoration: none; }
.faq-question-card .faq-list__link::after { content: ''; position: absolute; inset: 0; border-radius: inherit; }
.faq-question-card p { margin: 0 0 1rem; color: var(--gray-color); line-height: 1.55; font-size: .9375rem; }
.faq-question-card__footer { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .625rem 1rem; margin-top: auto; }
.faq-question-card small { color: var(--gray-color); font-size: .75rem; line-height: 1.5; }
.faq-card-action { color: var(--theme-color); font-size: .8125rem; font-weight: 500; background: var(--bg-color); padding: .375rem .625rem; border-radius: var(--border-radius-sm); }
.faq-question-card:focus-within { border-color: var(--theme-color); box-shadow: var(--box-shadow-2); }
.template-faq-question article > .faq-section { background: var(--white-color); border-radius: var(--border-radius); box-shadow: var(--box-shadow-1); padding: 1.5rem; }
.template-faq-question article > .row.faq-section { background: none; box-shadow: none; padding: 0; }
.template-faq-question .faq-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.template-faq-question .faq-question-card.card { background: var(--bg-color); box-shadow: none; }
.template-faq-question .faq-section p:last-child, .template-faq-question .faq-section ul:last-child, .template-faq-question .faq-section ol:last-child { margin-bottom: 0; }
.faq-myth h3 { margin: 1rem 0 .625rem; font-size: 1.125rem; line-height: 1.4; }
.faq-section > ol li + li { margin-top: .25rem; }
.faq-category-header, .template-faq-index .faq-search { background: var(--white-color); border-radius: var(--border-radius); padding: 1.5rem; box-shadow: var(--box-shadow-1); }
.faq-category-header { display: flex; gap: 1.5rem; align-items: flex-start; margin-bottom: 1.5rem; }
.faq-category-header h1 { margin-top: 0; }
.faq-category-header p:last-child { margin-bottom: 0; }
.faq-category-cover { width: 130px; height: auto; flex-shrink: 0; border-radius: var(--border-radius); }
.faq-category-grid { list-style: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.125rem; padding: 0; margin: 0; }
.faq-category-grid li { min-width: 0; }
.faq-category-card.card { display: flex; align-items: center; gap: .75rem; padding: 1.25rem; height: 100%; text-decoration: none; }
.faq-category-card__title { font-weight: 500; line-height: 1.4; }
.faq-category-count { margin-left: auto; display: inline-flex; align-items: center; justify-content: center; min-width: 30px; height: 30px; padding: 0 .375rem; border-radius: var(--border-radius-sm); background: var(--bg-color); color: var(--gray-color); font-size: .8125rem; }
.faq-group-title { color: var(--gray-color); font-size: .9375rem; margin: 0 0 .875rem; }
.faq-category-links { list-style: none; padding: 0; margin: 0; }
.faq-category-links a, .faq-sidebar a { display: flex; align-items: center; min-height: 44px; padding: .5rem 0; font-weight: 500; line-height: 1.5; }
/* Keep active and hovered rows visually separate, including wrapped titles. */
.faq-sidebar-panel { padding: 1.25rem; }
.faq-sidebar-panel h2 { font-size: 1.125rem; margin-bottom: 1rem; }
.faq-sidebar-panel + .faq-sidebar-panel { margin-top: 1rem; }
.faq-sidebar .faq-category-links { display: grid; gap: .375rem; }
.faq-sidebar .faq-category-links a { padding: .625rem .75rem; border: 1px solid transparent; border-radius: var(--border-radius-sm); color: var(--text-color); text-decoration: none; font-size: .9375rem; line-height: 1.45; transition: color .2s, background-color .2s, border-color .2s, box-shadow .2s; }
.faq-sidebar .faq-category-links a[aria-current] { background: color-mix(in srgb, var(--theme-color) 9%, var(--white-color)); color: var(--theme-color); border-color: color-mix(in srgb, var(--theme-color) 24%, var(--white-color)); font-weight: 600; }
@media (hover: hover) {
 .faq-sidebar .faq-category-links a:hover { color: var(--theme-color); border-color: var(--border-color, #ddd); background: var(--white-color); box-shadow: var(--box-shadow-1); }
 .faq-sidebar .faq-category-links a[aria-current]:hover { background: color-mix(in srgb, var(--theme-color) 9%, var(--white-color)); border-color: var(--theme-color); }
}
.faq-sources { list-style: none; padding: 0; margin: 0; }
.faq-sources li { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .25rem 1rem; padding: .5rem 0; }
.faq-sources li + li { border-top: 1px solid var(--border-color, #ddd); padding-top: .875rem; }
.faq-sources a { display: inline-flex; align-items: center; min-height: 44px; }
.faq-sources small { color: var(--gray-color); font-size: .75rem; }
.faq-cover { width: 100%; height: auto; border-radius: var(--border-radius); margin: 0 0 1.5rem; }
.faq-note { color: var(--gray-color); font-size: .8125rem; line-height: 1.5; }
.faq-read-more { min-height: 44px; width: 100%; white-space: normal; line-height: 1.4; margin-bottom: .5rem; }
.faq-read-more--mobile { display: none; }
.faq-search { margin: 1.25rem 0 2rem; }
.faq-search label { display: block; margin-bottom: .5rem; }
.faq-search > div { display: flex; gap: .75rem; }
.faq-search input { min-width: 0; width: 100%; min-height: 44px; border: 1px solid var(--border-color, #ddd); border-radius: var(--border-radius-sm); padding: .5rem .75rem; }
.faq-search button { min-height: 44px; }
.faq-video { aspect-ratio: 16 / 9; background: var(--text-color); display: grid; place-items: center; border-radius: var(--border-radius); overflow: hidden; }
.faq-video iframe { width: 100%; height: 100%; border: 0; }
.faq-video__play { min-height: 44px; }
.faq-page a:focus-visible, .faq-home a:focus-visible, .faq-page button:focus-visible, .faq-page input:focus-visible { outline: 3px solid var(--theme-color); outline-offset: 3px; }
@media (min-width: 992px) {
 .faq-sidebar--sticky { position: sticky; top: var(--faq-sidebar-top, 6rem); }
}
@media (hover: hover) {
 .faq-question-card.card:hover { border-color: var(--theme-color); box-shadow: var(--box-shadow-2); }
 .faq-question-card:hover .faq-list__link { color: var(--theme-color); }
 .faq-category-card:hover { box-shadow: var(--box-shadow-2); color: var(--theme-color); }
}
@media (max-width: 991px) {
 .faq-home .faq-list, .template-faq-index .faq-list, .faq-category-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
 .faq-read-more--mobile { display: inline-flex; }
 .faq-read-more--desktop { display: none; }
 .faq-category-header { flex-direction: column; gap: 1rem; }
 .faq-search > div { flex-wrap: wrap; }
}
@media (max-width: 575px) {
 .faq-list, .faq-home .faq-list, .template-faq-index .faq-list, .template-faq-question .faq-list, .faq-category-grid { grid-template-columns: 1fr; gap: 1rem; }
 .faq-question-card.card, .faq-category-card.card, .faq-card, .faq-category-header, .faq-answer, .template-faq-index .faq-search, .template-faq-question article > .faq-section { padding: 1.125rem; }
 .faq-answer p { font-size: 1rem; }
}
@media (prefers-reduced-motion: reduce) { .faq-question-card.card, .faq-sidebar a { transition: none; } }
