#main.route-about { width: 100%; max-width: none; padding: 0; }
.about-page .page-width { width: 100%; max-width: var(--page-width); padding-inline: var(--space-7); }
.about-content { display: flex; flex-direction: column; gap: 40px; padding-block: 16px 56px; }
.about-intro, .about-section, .about-section-intro, .about-page .about-panel { display: flex; flex-direction: column; }
.about-intro { gap: 12px; max-width: 820px; }
.about-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 6px; }
.about-section { gap: 16px; }
.about-section-intro { max-width: 760px; gap: 6px; }
.about-work-map { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr)); gap: 16px; }
.about-page .about-panel { gap: 14px; padding: var(--space-7); min-width: 0; }
.about-panel-heading { display: flex; align-items: center; gap: 12px; }
.about-panel-heading h3 { min-width: 0; }
.about-server .feature-list svg { color: var(--blue-ink); }
.about-never .feature-list svg { color: var(--coral-ink); }
.about-ad-note { background: var(--panel); }
.about-safeguards .list-row-title, .about-availability .list-row-title { font-size: 16px; line-height: 1.5; letter-spacing: normal; }
.about-availability .list-row { flex-wrap: wrap; }
.about-availability .list-row-body { flex-basis: 240px; }
.about-availability .tool-icon { width: 44px; height: 44px; border-radius: var(--radius-control); }
.about-availability .tool-icon svg { width: 22px; height: 22px; }
.about-status-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(320px, 100%), 1fr)); gap: 16px; }
.about-page .def-list { grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr)); }
.about-page .link { display: inline-flex; align-items: center; min-height: 44px; align-self: flex-start; }
@container page (max-width: 760px) {
  .about-page .page-width { padding-inline: var(--space-4); }
  .about-page .about-panel { padding: var(--space-5); }
  .about-availability .list-row-body { flex-basis: calc(100% - 60px); }
  .about-availability .status { margin-left: 60px; }
  .about-actions { flex-direction: column; align-items: stretch; }
}
