/* „Jak liczymy ceny” (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). Bez wstępu pod H1. */

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

.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;
}

/* kreska nad pierwszym pytaniem — na elemencie w kolumnie treści, nie na .wrap (ten ma marginesy) */
.qa:first-child {
  border-top: 1px solid var(--color-rule);
}

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

.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 / -1;
  max-width: 62ch;
}

.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);
  }
}