/* Muninn FAQ — light theme, matches site.css tokens.
   Styles the existing faq.html markup + faq.js interaction.
   Visual polish to fully match the marketing pages is a follow-up. */

.faq{max-width:860px;margin:0 auto;padding:72px 24px 96px}

.faq .section__label{
  font-family:var(--font-mono);font-size:12px;font-weight:500;letter-spacing:0.16em;
  text-transform:uppercase;color:var(--accent-ink);margin:0 0 10px}
.faq .section__heading{
  font-family:var(--font-display);font-weight:400;font-size:clamp(34px,5vw,52px);
  line-height:1.05;color:var(--ink);margin:0 0 14px;letter-spacing:-0.01em}
.faq__intro{color:var(--ink-soft);font-size:17px;line-height:1.6;max-width:60ch;margin:0 0 36px}

/* Search */
.faq__search{margin:0 0 34px}
.faq__search input{
  width:100%;box-sizing:border-box;font-family:var(--font-body);font-size:16px;color:var(--ink);
  background:var(--paper-2);border:1px solid var(--rule);border-radius:12px;padding:14px 18px;
  transition:border-color .18s,box-shadow .18s}
.faq__search input::placeholder{color:var(--ink-faint)}
.faq__search input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}

/* Overview: section tiles */
.faq__tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px}
.faq__tiles[hidden]{display:none}
.faq__tile{
  text-align:left;cursor:pointer;background:var(--paper-2);border:1px solid var(--rule);
  border-radius:14px;padding:20px 20px 18px;font-family:var(--font-body);
  transition:transform .15s,border-color .2s,box-shadow .2s}
.faq__tile:hover{transform:translateY(-2px);border-color:var(--accent);
  box-shadow:0 14px 34px oklch(0 0 0 /.45)}
.faq__tile-name{font-size:17px;font-weight:600;color:var(--ink);margin-bottom:6px;line-height:1.25}
.faq__tile-count{font-family:var(--font-mono);font-size:11.5px;letter-spacing:0.04em;
  text-transform:uppercase;color:var(--ink-mute)}

/* Section / search results */
.faq__content[hidden]{display:none}
.faq__back{
  display:inline-flex;align-items:center;cursor:pointer;background:none;border:none;padding:6px 0;
  font-family:var(--font-mono);font-size:12.5px;letter-spacing:0.05em;text-transform:uppercase;
  color:var(--accent-ink);margin-bottom:18px}
.faq__back:hover{color:var(--accent)}
.faq__current-section{
  font-family:var(--font-display);font-weight:400;font-size:28px;color:var(--ink);margin:0 0 8px}
.faq__current-section[hidden]{display:none}
.faq__no-results{color:var(--ink-mute);font-size:16px;padding:18px 0}
.faq__no-results[hidden]{display:none}

/* Groups + items */
.faq__group{margin-bottom:8px}
.faq__group[hidden]{display:none}
.faq__group-heading{
  font-family:var(--font-mono);font-size:12px;font-weight:600;letter-spacing:0.12em;
  text-transform:uppercase;color:var(--ink-mute);margin:28px 0 6px}
.faq--section .faq__group-heading,.faq--searching .faq__group-heading:first-of-type{margin-top:4px}

.faq__item{border-bottom:1px solid var(--rule-2)}
.faq__item[hidden]{display:none}
.faq__item summary{
  list-style:none;cursor:pointer;display:flex;align-items:flex-start;gap:14px;
  padding:18px 0;font-size:16.5px;font-weight:500;color:var(--ink);line-height:1.45}
.faq__item summary::-webkit-details-marker{display:none}
.faq__item summary::before{
  content:"+";flex:0 0 auto;font-family:var(--font-mono);font-size:18px;line-height:1.3;
  color:var(--accent-ink);width:16px;text-align:center;transition:transform .2s}
.faq__item[open] summary::before{content:"–"}
.faq__item summary:hover{color:var(--accent-ink)}
.faq__answer{padding:0 0 20px 30px}
.faq__answer p{color:var(--ink-soft);font-size:15.5px;line-height:1.75;margin:0 0 12px}
.faq__answer p:last-child{margin-bottom:0}
.faq__answer strong{color:var(--ink);font-weight:600}

@media(max-width:560px){
  .faq{padding:48px 18px 72px}
  .faq__tiles{grid-template-columns:1fr}
}