/* Home page FAQ: native disclosure rows in the panel language. */
.faq-list { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; align-items: start; }
.faq-list { interpolate-size: allow-keywords; }
.faq-item { transition: box-shadow 250ms, background 250ms; border-radius: 22px; background: linear-gradient(160deg, #ffffff0a, #ffffff02), var(--surface); box-shadow: inset 0 0 0 1px var(--rim); }
.faq-item summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 22px 24px; cursor: pointer; list-style: none; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item h3 { font-size: 18px; }
.faq-item summary .icon { font-size: 24px; color: var(--coral); transition: transform 200ms var(--motion); }
.faq-item[open] summary .icon { transform: rotate(90deg); }
.faq-item:hover, .faq-item[open] { box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--coral) 35%, transparent); }
.faq-item::details-content { block-size: 0; overflow: hidden; opacity: 0; transition: block-size 380ms var(--motion), opacity 300ms, content-visibility 380ms allow-discrete; }
.faq-item[open]::details-content { block-size: auto; opacity: 1; }
.faq-item p { padding: 0 24px 24px; font-size: 15px; color: #c9d0d3; }
.faq-item a { color: var(--text); text-underline-offset: 3px; }

@media (max-width: 1080px) {
  .faq-list { grid-template-columns: 1fr; }
}
