.faq-section .faq-list details { position: relative; border-radius: 10px; margin-bottom: 12px; background: #ffffff80; transition: border-color .2s,box-shadow .2s; }
.faq-section .faq-list details[open] { background: linear-gradient(135deg,white 60%,#fff9f9); border-left-color: var(--brand); box-shadow: 0 8px 25px #17292f06; }
.faq-section .faq-list details:hover { border-color: #dcb6bb; }
.faq-section.faq-enhanced .faq-list summary { display: grid; grid-template-columns: 32px minmax(0,1fr) 28px; gap: 14px; min-height: 74px; align-items: center; }
.faq-order { display: grid; place-items: center; width: 30px; height: 30px; border: 1px solid #e2e7e8; border-radius: 7px; background: #f5f7f7; color: #87989e; font-size: 10px; font-weight: 600; font-variant-numeric: tabular-nums; }
.faq-section .faq-list details[open] .faq-order { background: #fff0f1; border-color: #f0c8ce; color: var(--brand); }
.faq-section .faq-list summary > .icon { width: 28px; height: 28px; padding: 6px; border-radius: 50%; background: white; }
.faq-section .faq-list details[open] summary > .icon { background: var(--brand); border-color: var(--brand); color: white; }
.faq-section.faq-enhanced .faq-list details > p { padding-left: 46px; padding-right: 35px; overflow: hidden; }
.faq-section .faq-intro .text-link { display: inline-flex; min-height: 43px; padding: 10px 13px; gap: 20px; border: 1px solid #eed5d8; border-radius: 6px; background: #fff; box-shadow: 0 3px 10px #17292f03; }
.faq-section .faq-intro .text-link:hover { background: #fff3f4; }
.faq-section .faq-intro .text-link > .icon { width: 23px; height: 23px; padding: 4px; background: #fff1f2; border-radius: 5px; }
@media(max-width:640px) {
  .faq-section.faq-enhanced .faq-list summary { grid-template-columns: 25px minmax(0,1fr) 24px; gap: 10px; min-height: 72px; font-size: 13px; line-height: 1.45; }
  .faq-order { width: 25px; height: 25px; font-size: 9px; border-radius: 5px; }
  .faq-section .faq-list summary > .icon { width: 24px; height: 24px; padding: 5px; }
  .faq-section.faq-enhanced .faq-list details > p { padding-left: 35px; padding-right: 0; }
}
@media(prefers-reduced-motion:reduce) {
  .faq-section .faq-list details, .faq-section .faq-list summary > .icon, .faq-section .faq-intro .text-link { transition: none; }
}