/**
 * Page Template — Páginas estáticas genéricas
 */

/* ── Header ──────────────────────────────────── */

.page-header {
  background-color: var(--grey-10);
  padding: 200px 0 80px;
}

.page-header__title {
  color: var(--white);
  margin-bottom: 0;
}

/* ── Body Content ────────────────────────────── */

.page-body {
  padding: 140px 0;
}

.page-body__content {
  max-width: 1162px;
  margin-left: auto;
  margin-right: auto;
}

/* Parágrafos e listas */
.page-body__content p,
.page-body__content li {
  font-family: var(--font-family-primary);
  font-weight: var(--font-weight-medium);
  font-size: clamp(18px, 1.146vw, 22px);
  line-height: 1.15;
  letter-spacing: 0.11px;
  color: var(--grey-10);
  margin-bottom: 1.5em;
}

/* H2 — título de seção principal */
.page-body__content h2 {
  color: var(--grey-10);
  margin-top: 120px;
  margin-bottom: 40px;
}

.page-body__content h2:first-child {
  margin-top: 0;
}

/* H3 — subtítulo */
.page-body__content h3 {
  color: var(--grey-10);
  margin-top: 80px;
  margin-bottom: 28px;
}

/* H4 */
.page-body__content h4 {
  color: var(--grey-10);
  margin-top: 56px;
  margin-bottom: 20px;
}

.page-body__content strong {
  font-weight: var(--font-weight-bold);
}

.page-body__content ul,
.page-body__content ol {
  padding-left: 1.5em;
  margin-bottom: 1.5em;
}

/* ── Responsivo ───────────────────────────────── */

@media (max-width: 1024px) {
  .page-header {
    padding: 160px 0 64px;
  }

  .page-body {
    padding: 80px 0;
  }
}

@media (max-width: 600px) {
  .page-header {
    padding: 120px 0 48px;
  }

  .page-body {
    padding: 64px 0;
  }
}