/* ==========================================================================
   KlepeTo — caste-dotazy.css
   Sekce specifické pro podstránku Časté dotazy. Accordion, section, page-hero
   a cta-band jsou sdílené v global.css.
   ========================================================================== */

/* --- 1. Rychlá navigace v hero -----------------------------------------
   Drží stejný tvar jako ikonový přehled na ostatních podstránkách (mřížka
   2 × 2 pod textem), ale místo popisků nese odkazy na skupiny otázek.
   Rodič sem často přichází rovnou z vyhledávače s jednou konkrétní obavou. */
.faq-jump {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.2rem;
  margin-top: 3rem;
}
.faq-jump a {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1.3rem 1.6rem;
  border-radius: var(--radius-card);
  background: var(--color-mist);
  color: var(--color-ink);
  text-decoration: none;
  font-family: var(--font-heading);
  font-weight: 600;
  font-size: 1.5rem;
  line-height: 1.3;
  transition: background var(--transition), transform var(--transition);
}
.faq-jump a::before {
  content: "";
  width: 1rem;
  height: 1rem;
  border-radius: var(--blob);
  background: var(--jump-tint, var(--tint-gold));
  flex: none;
}
.faq-jump a:hover {
  background: var(--tint-sun);
  transform: translateY(-2px);
}
.faq-jump li:nth-child(1) a { --jump-tint: var(--tint-sky); }
.faq-jump li:nth-child(2) a { --jump-tint: var(--tint-sage); }
.faq-jump li:nth-child(3) a { --jump-tint: var(--tint-gold); }
.faq-jump li:nth-child(4) a { --jump-tint: var(--tint-rose); }

@media (max-width: 520px) {
  .faq-jump {
    grid-template-columns: 1fr;
  }
}

/* --- 2. až 4. Skupiny otázek -------------------------------------------
   Nadpis skupiny je blíž k accordionu než běžný section__head, ať drží
   viditelně pohromadě se svými otázkami. */
.faq-group__head {
  margin-bottom: 2.4rem;
}

/* odstavec, který v odpovědi navazuje pod výčtem s puntíky */
.accordion__body .framework-list + p {
  margin-top: 1.8rem;
}

/* --- 5. Reference: jediná otázka, která nepatří do accordionu ----------
   Je to můstek k akci, ne obava k rozkliknutí, proto stojí otevřeně. */
.proof-note {
  display: grid;
  grid-template-columns: 6.4rem minmax(0, 1fr);
  gap: 2rem;
  align-items: start;
  max-width: var(--wrap-text);
}
.proof-note p {
  line-height: 1.55;
}
.proof-note p + p {
  margin-top: 1.2rem;
}
@media (max-width: 620px) {
  .proof-note {
    grid-template-columns: 1fr;
    gap: 1.6rem;
  }
}