/* =========================================================
   Cars & Care · faq.css
   Kun til faq.html. Bruger kun tokens og temavariabler fra site.css.
   ========================================================= */

/* ---------- Sidehoved: emnerne som en liste med hårstreger til højre ---------- */
.faq-head .page-head__grid { align-items: center; }
.faq-topics__label { margin-bottom: var(--space-3); }
.faq-topics .link-list a { min-height: 60px; }
.faq-topics .link-list small { color: var(--c-subtle-dark); }

/* ---------- Spørgsmål og svar ---------- */
.faq-tools { margin-bottom: var(--space-7); padding-bottom: var(--space-5); border-bottom: 1px solid var(--line); }
.faq-tools .ph-note { margin-top: 0; }
.faq-tools .btn { flex: none; }
/* Én hårstreg pr. emne: gruppens egen streg erstatter harmonikaens øverste streg */
.faq-group .accordion { border-top: 0; }
.faq-group .accordion__item:first-child .accordion__trigger { padding-top: .35rem; min-height: 52px; }
.faq-group__count { margin-top: var(--space-2); font-size: var(--fs-small); color: var(--fg-muted); }
.faq-group__head .ph-note { margin-top: var(--space-4); max-width: 18rem; }
/* Svarene: lister, links og meddelelser inde i panelet */
.accordion__panel .link { margin-top: var(--space-4); }
.accordion__panel .notice { margin-top: var(--space-4); }
.accordion__panel .notice__text a { color: var(--link); font-weight: 650; text-decoration: underline; text-underline-offset: .28em; text-decoration-thickness: 1px; }
.accordion__panel strong { color: var(--fg); font-weight: 650; }

/* ---------- Fandt du ikke svaret ---------- */
.faq-help .cta-band__text a { white-space: nowrap; }

/* ---------- Trykflade ----------
   Selvstændige tekstlinks er kun ca. 24 px høje. En usynlig flade på 44 px gør dem lette
   at ramme på en telefon uden at flytte layoutet. Til ejer: kandidat til site.css. */
.accordion__panel .link { position: relative; }
.accordion__panel .link::after { content: ""; position: absolute; left: -4px; right: -4px; top: 50%; height: max(44px, 100%); transform: translateY(-50%); }

@media (max-width: 640px) {
  .faq-tools { flex-direction: column; align-items: stretch; }
  .faq-tools .btn { width: 100%; }
  .faq-group__head .ph-note { max-width: none; }
}