/* Shared FAQ accordion (plans page FAQ and home page "Common questions"). Native <details>: keyboard and screen-reader friendly, no JS. */
.faq details{background:#14181D;padding:0 24px}
.faq summary{position:relative;cursor:pointer;min-height:64px;display:flex;align-items:center;padding:12px 44px 12px 0;box-sizing:border-box;font-weight:600;font-size:18px;color:#F5F6F7;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::marker{content:''}
.faq summary:focus-visible{outline:2px solid #2BB3E6;outline-offset:2px}
/* Plus icon in accent blue; the vertical bar rotates flat so the plus becomes a minus when open. */
.faq summary::before,.faq summary::after{content:'';position:absolute;right:4px;top:50%;width:16px;height:2px;margin-top:-1px;background:#2BB3E6;transition:transform .25s ease}
.faq summary::after{transform:rotate(90deg)}
.faq details[open]>summary::after{transform:rotate(0deg)}
.faq summary:hover::before,.faq summary:hover::after{background:#5CC6EE}
@media (prefers-reduced-motion:reduce){.faq summary::before,.faq summary::after{transition:none}}
/* Nested sub-question inside an answer: inset, smaller, left accent border, smaller icon. Toggles on its own; closing the parent hides it. */
.faq details.faq-sub{background:#1B2027;border-left:2px solid #2BB3E6;padding:0 16px;margin:0 0 20px}
.faq details.faq-sub>summary{min-height:48px;padding:10px 32px 10px 0;font-size:15px;color:#E6E9ED}
.faq details.faq-sub>summary::before,.faq details.faq-sub>summary::after{width:12px;right:2px}
.faq details.faq-sub>p{margin:0;padding-bottom:16px;font-size:15px;line-height:1.55;color:#B8BEC6}
@media (max-width:600px){.faq details.faq-sub{padding:0 12px}}
