/* punktachtneun FAQ – Frontend (reddish, modern, accessible) */
:root {
  --p89-accent: #d64045;
  --p89-accent-2: #ffefef;
  --p89-text: #222;
  --p89-muted: #666;
  --p89-bg: #fff;
  --p89-card: #fff;
  --p89-radius: 14px;
}

.p89faq-container { display:grid; grid-template-columns: 280px 1fr; gap: 2rem; align-items:start; }
@media (max-width: 900px) { .p89faq-container { grid-template-columns: 1fr; } }

.p89faq-search {
  display:flex; align-items:center; gap:.5rem; margin-bottom:1rem;
}
.p89faq-search input[type="search"] {
  width:100%; padding:12px 14px; border:1px solid #e8e8e8; border-radius: var(--p89-radius);
  outline:none; background:#fff; box-shadow: 0 1px 0 rgba(0,0,0,.03) inset;
}
.p89faq-search input[type="search"]:focus {
  border-color: var(--p89-accent);
  box-shadow: 0 0 0 3px rgba(214,64,69,.15);
}

.p89faq-sidebar {
  position:sticky; top: 1rem;
  background: var(--p89-card);
  border:1px solid #f0f0f0;
  border-radius: var(--p89-radius);
  padding: 1rem;
}
.p89faq-sidebar h3 { margin-top:0; color: var(--p89-accent); }
.p89faq-cats ul { list-style:none; margin:0; padding-left:0; }
.p89faq-cats li { margin:.15rem 0; }
.p89faq-cats a { text-decoration:none; color:var(--p89-text); padding:.25rem .4rem; border-radius:8px; display:inline-block; }
.p89faq-cats a:hover { background: var(--p89-accent-2); }

.p89faq-list {
  display:grid; grid-template-columns: 1fr; gap: 12px;
}
.p89faq-card {
  border:1px solid #f0f0f0; border-radius: var(--p89-radius); padding: 1rem; background: var(--p89-card);
  transition: box-shadow .2s ease, transform .05s ease;
}
.p89faq-card:hover { box-shadow: 0 6px 24px rgba(214,64,69,.08); transform: translateY(-1px); }
.p89faq-card h2 { margin:.2rem 0 .5rem; font-size:1.05rem; }
.p89faq-meta { color: var(--p89-muted); font-size:.9rem; display:flex; gap:.5rem; flex-wrap:wrap; }
.p89faq-tags { margin-top:.5rem; display:flex; gap:.4rem; flex-wrap:wrap; }
.p89faq-tag { font-size:.78rem; background:var(--p89-accent-2); color:#7a1a1e; padding:.12rem .5rem; border-radius:999px; }

.p89faq-pagination { margin-top:1.5rem; display:flex; gap:8px; }
.p89faq-pagination .page-numbers { padding:.4rem .7rem; border-radius:8px; border:1px solid #eee; text-decoration:none; }
.p89faq-pagination .current { background: var(--p89-accent); color:#fff; border-color:var(--p89-accent); }

.p89faq-single .p89faq-back { margin-bottom:1rem; display:inline-flex; gap:.5rem; align-items:center; color:var(--p89-accent); text-decoration:none; }
.p89faq-single h1 { color: var(--p89-text); }
.p89faq-single .entry-content { margin-top: .5rem; }
