/* „Jak liczymy ceny” i „Prywatność” (PL i EN) — pytania czytelnika z odpowiedzią od pierwszego słowa.
   Pytanie po lewej, odpowiedź po prawej, wiersze z linią włosową — jak strona Dane aplikacji
   (DESIGN §4). Tytuł na pasie tła, bez wstępu pod H1. */

.head {
  padding-top: 48px;
  padding-bottom: 40px;
}

.head h1 {
  font-size: var(--text-figure); /* 40 px — tytuł podstrony, mniejszy niż H1 strony głównej */
  line-height: 1.1;
  letter-spacing: -0.02em;
}

/* Data stanu pod H1 — tylko strona „Prywatność” (wymagana przy informacji RODO). */
.head .stan {
  margin-top: 12px;
  color: var(--color-ink-3);
}

.qa {
  padding-block: 20px;
  border-bottom: 1px solid var(--color-rule);
}

/* pierwsze pytanie zaczyna się na granicy pasa — kreskę nad nim zastępuje zmiana tonu */
.qa:first-child {
  padding-top: 32px;
}

.qa h2 {
  grid-column: 1 / span 4;
  font-size: var(--text-lead-lg);
  font-weight: 500;
  line-height: 1.4;
}

.qa .a {
  grid-column: 5 / span 7;
  max-width: 68ch;
}

.qa .a > * + * {
  margin-top: 8px;
}

.qa ul {
  padding-left: 1.25em;
}

.qa li + li {
  margin-top: 4px;
}

@media (max-width: 1023.98px) {
  .qa h2,
  .qa .a {
    grid-column: 1 / -1;
  }

  .qa .a {
    margin-top: 8px;
  }
}

@media (max-width: 639.98px) {
  .head {
    padding-top: 32px;
    padding-bottom: 24px;
  }

  .head h1 {
    font-size: 2.125rem; /* 34 px — jak H1 strony głównej na telefonie */
  }

  .qa h2 {
    font-size: var(--text-lead);
  }
}