.faq-body { min-width:0; }
.faq-main { --faq-soft-orange:#f6e0d3; --faq-soft-blue:#e1e8ee; --faq-soft-purple:#e9e2f1; --faq-soft-green:#e2e9da; }
html[data-theme="dark"] .faq-main { --faq-soft-orange:#30251e; --faq-soft-blue:#202932; --faq-soft-purple:#292332; --faq-soft-green:#242d21; }
.faq-main button,.faq-main input { font:inherit; }
.faq-main [hidden] { display:none !important; }
.faq-opening { padding-bottom:58px; border-bottom:1px solid var(--line); }
.faq-opening-meta { display:flex; justify-content:space-between; gap:16px; align-items:flex-start; padding-inline:4px; color:var(--muted); font-size:var(--type-support); }
.faq-opening-meta .kicker { margin:0; }
.faq-opening-body { display:grid; grid-template-columns:1.35fr 1fr; gap:52px; align-items:center; padding-top:48px; }
.faq-opening h1 { font-size:clamp(36px,4.1vw,56px); line-height:1.3; letter-spacing:-.035em; white-space:pre-line; font-weight:750; margin:0 0 22px; }
.faq-lead { max-width:580px; font-size:17px; line-height:1.85; color:var(--muted); margin:0; }
.quick-questions { display:flex; flex-wrap:wrap; gap:10px; margin-top:28px; }
.quick-questions a { display:inline-flex; align-items:center; min-height:44px; border:1px solid var(--line); border-radius:30px; padding:10px 16px; text-decoration:none; font-size:14px; background:var(--panel); transition:transform .2s,border-color .2s; }
.quick-questions a:hover { transform:translateY(-3px); border-color:var(--orange); }
.answer-art { position:relative; height:290px; max-width:470px; width:100%; margin-left:auto; }
.art-caption,.art-note { position:absolute; color:var(--muted); font:12px var(--mono); letter-spacing:.06em; }
.art-caption { top:0; left:0; }.art-note { bottom:0; right:0; }
.question-paper,.answer-paper { position:absolute; width:220px; height:215px; border:1px solid var(--line); border-radius:4px 28px 4px 4px; padding:20px 24px; box-shadow:6px 7px 0 var(--fine); }
.question-paper { background:var(--faq-soft-purple); top:24px; left:18px; transform:rotate(-9deg); }
.answer-paper { background:var(--faq-soft-green); right:14px; bottom:25px; transform:rotate(8deg); }
.question-paper>span,.answer-paper>span { display:block; font-size:78px; line-height:1; font-weight:750; letter-spacing:-.05em; }
.question-paper i { display:block; width:100%; height:1px; background:var(--line); margin-top:13px; }.question-paper i:nth-of-type(2) { width:70%; }
.answer-paper svg { width:100px; height:54px; fill:none; stroke:var(--ink); stroke-width:2.5; margin-left:54px; }
.question-paper b,.answer-paper b { display:block; font:11px var(--mono); margin-top:18px; }
.answer-room { display:grid; grid-template-columns:245px minmax(0,1fr); gap:56px; padding:52px 0 76px; scroll-margin-top:24px; }
.topic-sticky { position:sticky; top:24px; }.topic-title { font-size:20px; margin:12px 0 22px; font-weight:650; }
.topic-filters { display:grid; gap:5px; }.topic-filter { width:100%; border:0; background:transparent; min-height:48px; display:flex; gap:12px; align-items:center; padding:10px 12px; border-radius:7px; cursor:pointer; text-align:left; font-size:15px; }
.topic-filter:hover { background:var(--fine); }.topic-filter.is-active { background:var(--panel); box-shadow:inset 0 0 0 1px var(--line); font-weight:650; }
.topic-index { margin-left:auto; color:var(--muted); font:12px var(--mono); }.topic-dot { flex:none; width:8px; height:8px; border-radius:50%; }.dot-orange { background:var(--orange); }.dot-blue { background:var(--blue); }.dot-purple { background:var(--purple); }.dot-green { background:var(--green); box-shadow:0 0 0 1px var(--line); }.dot-all { background:var(--ink); }
.sidebar-note { display:flex; align-items:flex-start; gap:12px; padding:26px 12px 0; margin-top:24px; border-top:1px solid var(--line); }.sidebar-note .signal-dot { flex:none; margin:9px 0 0; }.sidebar-note p { margin:0; color:var(--muted); font-size:14px; line-height:1.8; }
.answer-library { min-width:0; }.search-toolbar { margin-bottom:26px; }.question-search { display:flex; gap:12px; align-items:center; min-height:58px; padding:8px 15px; background:var(--panel); border:1px solid var(--line); border-radius:9px; }.question-search:focus-within { outline:2px solid var(--orange); outline-offset:3px; }.question-search>svg { flex:none; width:21px; height:21px; stroke:var(--muted); fill:none; stroke-width:1.6; }.search-label { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }.question-search input { width:100%; min-width:0; border:0; outline:none; background:transparent; color:var(--ink); font-size:16px; padding:6px 0; }.question-search input::-webkit-search-cancel-button { display:none; }.question-search input::placeholder { color:var(--muted); opacity:1; }.question-search button { flex:none; width:44px; height:44px; border:0; background:transparent; cursor:pointer; padding:10px; }.question-search button svg { width:100%; stroke:var(--muted); stroke-width:1.5; fill:none; }
.library-status { display:flex; align-items:center; justify-content:space-between; gap:12px; color:var(--muted); font-size:14px; min-height:42px; }.library-status p { margin:12px 0 0; }.library-status button { min-height:44px; border:0; background:transparent; color:var(--brand); cursor:pointer; padding:8px 0; }
.faq-section { margin-bottom:36px; scroll-margin-top:24px; }.category-heading { display:flex; gap:20px; justify-content:space-between; align-items:center; border-radius:10px; padding:23px 26px; border:1px solid var(--fine); }.color-orange { background:var(--faq-soft-orange); }.color-blue { background:var(--faq-soft-blue); }.color-purple { background:var(--faq-soft-purple); }.color-green { background:var(--faq-soft-green); }.category-index { font:12px var(--mono); color:var(--muted); }.category-heading h2 { font-size:24px; line-height:1.45; font-weight:650; margin:9px 0 6px; }.category-heading p { margin:0; color:var(--muted); font-size:15px; line-height:1.7; }.category-link { display:flex; gap:9px; align-items:center; color:var(--ink); font-size:14px; text-decoration:none; min-height:44px; flex:none; }.category-link:hover { color:var(--brand); }.category-link svg { width:20px; stroke:currentColor; stroke-width:1.4; fill:none; }
.faq-item { border-bottom:1px solid var(--line); scroll-margin-top:24px; }.faq-item summary { display:flex; gap:18px; align-items:baseline; padding:23px 8px; cursor:pointer; list-style:none; }.faq-item summary::-webkit-details-marker { display:none; }.question-number { font:12px var(--mono); color:var(--muted); min-width:22px; flex:none; }.question-text { font-size:17px; line-height:1.75; font-weight:600; flex:1; }.faq-item summary>svg { width:20px; height:20px; flex:none; align-self:center; fill:none; stroke:var(--ink); stroke-width:1.5; transition:transform .2s; }.faq-item[open] summary>svg { transform:rotate(45deg); }.faq-item[open] .question-text { color:var(--ink); }.faq-answer { padding:0 46px 23px 48px; }.faq-answer p { margin:0; font-size:16px; line-height:1.9; color:var(--muted); max-width:840px; }
.empty-results { text-align:center; padding:55px 24px; background:var(--panel); border:1px dashed var(--line); border-radius:12px; }.empty-results>span { font-size:56px; color:var(--orange); }.empty-results h2 { font-size:24px; line-height:1.5; }.empty-results p { color:var(--muted); font-size:16px; }.empty-results button,.empty-results a { display:inline-flex; align-items:center; justify-content:center; gap:10px; border:1px solid var(--line); background:var(--paper); border-radius:6px; min-height:44px; padding:10px 14px; font-size:14px; color:var(--ink); text-decoration:none; cursor:pointer; margin:8px; }.empty-results svg { width:20px; fill:none; stroke:currentColor; stroke-width:1.4; }
.faq-closing { display:grid; grid-template-columns:1fr auto; column-gap:40px; padding:38px 42px; margin-bottom:66px; background:var(--faq-soft-blue); border:1px solid var(--line); border-radius:14px; }.faq-closing h2 { font-size:32px; white-space:pre-line; line-height:1.45; margin:15px 0; }.faq-closing p:not(.kicker) { max-width:650px; color:var(--muted); font-size:16px; line-height:1.85; margin-bottom:0; }.faq-contact-link { display:flex; align-items:center; gap:30px; text-decoration:none; align-self:center; font-size:18px; font-weight:650; padding:16px 0; border-bottom:1px solid var(--line); min-height:44px; }.faq-contact-link svg { width:28px; stroke:currentColor; fill:none; stroke-width:1.3; }.faq-email { grid-column:2; font:14px var(--mono); text-decoration:none; color:var(--brand); padding:10px 0; justify-self:end; }
@media(max-width:1100px) { .faq-opening-body { gap:28px; }.answer-room { grid-template-columns:215px minmax(0,1fr); gap:30px; }.category-heading { padding:20px; }.category-link { flex-shrink:1; } }
@media(max-width:780px) { .faq-opening-body { grid-template-columns:1fr; padding-top:32px; gap:30px; }.faq-opening-meta>span:last-child { display:none; }.faq-opening h1 { font-size:40px; }.answer-art { height:245px; max-width:390px; margin:0 auto; }.question-paper,.answer-paper { width:190px; height:184px; padding:17px 20px; }.question-paper>span,.answer-paper>span { font-size:62px; }.question-paper b,.answer-paper b { font-size:10px; margin-top:12px; }.question-paper { left:8px; top:20px; }.answer-paper { right:8px; bottom:20px; }.answer-paper svg { width:80px; height:43px; margin-left:45px; }.art-caption,.art-note { font-size:11px; }.faq-opening { padding-bottom:32px; }.answer-room { grid-template-columns:1fr; padding-top:30px; gap:24px; }.topic-sticky { position:static; }.topic-sidebar .kicker,.sidebar-note { display:none; }.topic-title { font-size:18px; margin:0 0 16px; }.topic-filters { grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; }.topic-filter { font-size:13px; padding:9px 8px; gap:7px; line-height:1.6; border:1px solid var(--line); }.topic-index { display:none; }.topic-dot { width:6px; height:6px; }.category-heading { align-items:flex-start; flex-direction:column; gap:4px; padding:20px; }.category-heading h2 { font-size:23px; }.category-link { margin-bottom:-6px; }.question-text { font-size:16px; }.faq-item summary { padding:20px 2px; gap:10px; }.question-number { min-width:20px; }.faq-answer { padding:0 28px 20px 32px; }.faq-answer p { font-size:15px; }.faq-closing { grid-template-columns:1fr; padding:28px 24px; margin-bottom:40px; gap:18px; }.faq-closing h2 { font-size:28px; }.faq-contact-link { justify-content:space-between; }.faq-email { grid-column:1; justify-self:start; padding-top:0; } }
@media(max-width:360px) { .faq-opening h1 { font-size:34px; }.faq-lead { font-size:16px; }.answer-art { height:215px; }.question-paper,.answer-paper { width:165px; height:164px; }.question-paper>span,.answer-paper>span { font-size:52px; }.question-paper b,.answer-paper b { font-size:9px; }.answer-paper svg { width:70px; height:37px; margin-left:25px; }.art-note { font-size:10px; }.topic-filters { grid-template-columns:repeat(2,minmax(0,1fr)); }.quick-questions { gap:7px; }.quick-questions a { padding:9px 12px; }.category-heading { padding:18px; } }
@media(prefers-reduced-motion:reduce) { .faq-main * { transition:none!important; } }
