.gh-faq { font-family: inherit; }
.gh-faq__item {
background: #fff;
} .gh-faq__row {
display: grid;
grid-template-columns: 1fr;
align-items: start;
}
.gh-faq--has-icon .gh-faq__row {
grid-template-columns: auto 1fr;
}
.gh-faq__main { min-width: 0; } .gh-faq__icon {
display: inline-flex;
align-items: center;
justify-content: center;
flex: 0 0 auto;
line-height: 1;
color: inherit; margin-top: .15em;
}
.gh-faq__icon--circle {
border: 2px solid currentColor;
border-radius: 50%;
}
.gh-faq__icon i { font-size: inherit; line-height: 1; } .gh-faq__q {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
width: 100%;
margin: 0;
line-height: 1.4;
font-weight: 700;
} button.gh-faq__q {
text-align: left;
border: 0;
background: transparent;
cursor: pointer;
color: inherit;
font-family: inherit;
}
button.gh-faq__q:hover { opacity: .9; }
button.gh-faq__q:focus-visible { outline: 2px solid currentColor; outline-offset: -2px; }
.gh-faq__question {
margin: 0;
font-size: inherit;
font-weight: inherit;
line-height: inherit;
color: inherit;
} .gh-faq__indicator {
position: relative;
flex: 0 0 auto;
width: 16px;
height: 16px;
margin-top: .15em;
}
.gh-faq__indicator::before,
.gh-faq__indicator::after {
content: "";
position: absolute;
top: 50%;
left: 50%;
width: 14px;
height: 2px;
background: currentColor;
transform: translate(-50%, -50%);
transition: transform .25s ease, opacity .25s ease;
}
.gh-faq__indicator::after { transform: translate(-50%, -50%) rotate(90deg); }
.gh-faq__item.is-open .gh-faq__indicator::after { transform: translate(-50%, -50%) rotate(0deg); opacity: 0; } .gh-faq__answer-inner {
line-height: 1.6;
}
.gh-faq__answer-inner p { margin: 0 0 1em; }
.gh-faq__answer-inner p:last-child { margin-bottom: 0; } .gh-faq--empty {
padding: 1rem;
border: 1px dashed #c7ccd6;
border-radius: 8px;
color: #6b7280;
}
@media (prefers-reduced-motion: reduce) {
.gh-faq__indicator::before,
.gh-faq__indicator::after { transition: none; }
}