/* palKidz's public About page (/about): legal.css's navy identity, Cairo and RTL, plus a hero,
   buttons and role cards. No script; the site's Content Security Policy applies unchanged. */
.about .hero { text-align: center; padding: 16px 0 8px; }
.about .hero img { border-radius: 22px; }
.about .hero h1 { font-size: 30px; line-height: 1.5; margin: 16px 0 8px; }
.about .lead { font-size: 18px; max-width: 680px; margin: 0 auto; }
.about .actions { margin: 24px 0 8px; display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; }
.about .button {
  display: inline-block; padding: 10px 24px; border-radius: 12px; text-decoration: none;
  border: 1px solid #6D8BA9; color: #F4F6F2; font-weight: 700;
}
.about .button.primary { background: #5BD4C4; border-color: #5BD4C4; color: #052A26; }
.about .cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; }
.about .card { margin: 0; }
.about .card h3 { margin-top: 0; color: #F6C45C; }
.about .card ul { padding-inline-start: 20px; margin: 8px 0 0; }
.about .steps li { margin-bottom: 6px; }
@media (max-width: 480px) {
  .about .hero h1 { font-size: 24px; }
  .about .lead { font-size: 16px; }
}