/* ============================================================
   Miró — FAQs page styles (mobile-first)
   Client feedback 2026-07: plain title, no topics sidebar,
   smaller contact strip.
   ============================================================ */

/* ---------- Page title — plain white strip ---------- */
.faq-hero {
  background: var(--white);
  padding-block: clamp(32px, 5vw, 60px) clamp(8px, 1.5vw, 16px);
}
.faq-hero h1 { font-size: clamp(28px, 4.2vw, 42px); font-weight: 400; }

/* ---------- Layout — single centred column ---------- */
.faq-main { padding-block: clamp(28px, 5vw, 56px) clamp(56px, 9vw, 112px); }
.faq-layout { max-width: 860px; margin-inline: auto; }

/* ---------- Question groups ---------- */
.faq-group { scroll-margin-top: 120px; }
.faq-group + .faq-group { margin-top: clamp(44px, 7vw, 72px); }
.faq-group__head h2 { font-size: clamp(24px, 3.4vw, 30px); }
.faq-group__sub { margin-top: 6px; font-size: 16.5px; color: var(--ink-soft); }
.faq-group .accordion { margin-top: 20px; }
.faq-group .accordion__trigger { line-height: 1.35; }
.faq-group .accordion__content p { max-width: 66ch; }
.faq-group .accordion__content a {
  color: var(--navy); font-weight: 600;
  text-decoration: underline; text-underline-offset: 3px;
  text-decoration-color: var(--line);
  transition: color 0.2s var(--ease);
}
.faq-group .accordion__content a:hover { color: var(--raspberry); }

/* ---------- No-results state ---------- */
.faq-empty {
  padding: clamp(44px, 8vw, 76px) 24px;
  text-align: center;
  background: var(--white);
  border: 1px dashed var(--line); border-radius: var(--radius-lg);
}
.faq-empty__title { font-size: clamp(22px, 3vw, 27px); color: var(--navy); }
.faq-empty__hint { margin: 10px auto 0; max-width: 44ch; }
.faq-empty__links {
  margin-top: 18px;
  display: flex; flex-wrap: wrap; gap: 4px 28px; justify-content: center;
}

/* ---------- Contact strip — compact (client feedback) ---------- */
.faq-contact {
  text-align: center;
  background: var(--cream-soft);
  padding-block: clamp(32px, 5vw, 56px);
}
.faq-contact h2 { font-size: clamp(24px, 3.4vw, 32px); }
.faq-contact__ctas {
  display: flex; flex-direction: column; gap: 12px;
  margin: 24px auto 0; max-width: 420px;
}
.faq-contact__meta {
  margin-top: 22px;
  font-size: 13.5px; letter-spacing: 0.04em; color: var(--ink-soft);
}
.faq-contact__meta a {
  display: inline-block; padding: 12px 4px; margin: -12px -2px;
  font-weight: 600; color: var(--navy);
  transition: color 0.2s var(--ease);
}
.faq-contact__meta a:hover { color: var(--raspberry); }

/* ---------- 600px+ ---------- */
@media (min-width: 600px) {
  .faq-contact__ctas { flex-direction: row; justify-content: center; max-width: none; }
}

/* ---------- 900px+ ---------- */
@media (min-width: 900px) {
  .faq-group { scroll-margin-top: 108px; }
  .faq-group .accordion__trigger { font-size: 18px; padding: 22px 4px; }
}