/* Supporting pages share the homepage typography, palette, header and footer. */
.support-page, .legal-page, .tips-content {
  padding-block: 70px 85px;
}
.container--narrow, .tips-content {
  width: min(760px, calc(100% - 48px));
  margin-inline: auto;
}
.support-page h1, .legal-page h1, .tips-content h1 {
  margin: 18px 0 20px;
  font-size: clamp(34px, 4vw, 52px);
  line-height: 1.4;
}
.page-intro, .subtitle {
  max-width: 600px;
  font-size: 19px;
  color: var(--muted);
}
.contact-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  margin: 44px 0 65px;
}
.support-card {
  padding: 30px;
  border-radius: 22px;
  background: #e5ddeb;
}
.support-card:nth-child(2) { background: #f2e8c8; }
.contact-symbol { display: block; font-size: 30px; margin-bottom: 16px; }
.support-card h2 { font-size: 24px; letter-spacing: -1px; margin-bottom: 12px; }
.support-card p { color: var(--muted); margin-top: 12px; }
.support-card a { color: var(--ink); text-underline-offset: 5px; text-decoration: underline; overflow-wrap: anywhere; }
.faq { max-width: 850px; margin-inline: auto; }
.faq h2 { font-size: 32px; margin-bottom: 28px; }
.faq-item { border-top: 1px solid var(--line); }
.faq-item:last-child { border-bottom: 1px solid var(--line); }
.faq-item summary { padding: 23px 32px 23px 0; cursor: pointer; font-size: 19px; list-style: none; position: relative; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after { content: '+'; position: absolute; right: 4px; color: var(--purple); }
.faq-item[open] summary::after { content: '−'; }
.faq-item p { color: var(--muted); padding: 0 32px 24px 0; margin: 0; }
.faq-item a, .legal-page a, .tips-content a { color: var(--purple); text-decoration: underline; text-underline-offset: 3px; }
.updated { color: var(--muted); font-size: 14px; padding-bottom: 30px; margin-bottom: 30px; border-bottom: 1px solid var(--line); }
.legal-page h2, .tips-content h2 { font-family: Karla, sans-serif; font-size: 23px; font-weight: 700; letter-spacing: -.5px; margin: 35px 0 12px; }
.legal-page h3 { font-weight: 700; font-size: 18px; margin: 24px 0 10px; }
.legal-page p:not(.eyebrow), .legal-page li, .tip-section p, .tip-section li { color: var(--muted); }
.legal-page p, .tip-section p { margin-bottom: 14px; }
.legal-page ul, .tip-section ul { padding-left: 24px; }
.legal-page li, .tip-section li { margin-bottom: 8px; }
.highlight-box { background: #e5ddeb; border-radius: 20px; padding: 25px; margin-block: 30px; }
.back-link { display: inline-block; margin-top: 25px; }
@media (max-width: 760px) {
  .support-page, .legal-page, .tips-content { padding-block: 42px 60px; }
  .contact-grid { grid-template-columns: 1fr; margin-block: 30px 45px; gap: 16px; }
  .support-card { padding: 24px; }
  .support-card h2 { font-size: 23px; }
  .faq h2 { font-size: 27px; }
  .faq-item summary { font-size: 17px; }
  .page-intro, .subtitle { font-size: 17px; }
}
