/* About (Jordan, 12 Nov 2026): eyebrow, title, then three short parts with section headings. The founder photo comes
   after the founding sentence: beside it at desktop width (running down beside the next part, so no gap opens
   under the short sentence), under it on a phone, never before the title. The company details close the page in a
   small card. */
.about-page { display: grid; grid-template-columns: minmax(0, 1fr); column-gap: var(--space-5); align-items: start; }
.about-page > .eyebrow { display: block; }
.about-part { margin-top: var(--space-4); }
.about-part h2 { margin: 0 0 var(--space-2); }
.about-photo { margin: var(--space-3) 0 0; width: 60%; max-width: 320px; }
.about-photo img { display: block; width: 100%; height: auto; border-radius: var(--r-tile); }
.about-photo figcaption { margin-top: 8px; font-size: 0.9rem; color: var(--ink-mute); text-wrap: balance; }
@media (min-width: 820px) {
  .about-page { grid-template-columns: minmax(0, 38em) 240px; }
  .about-page > * { grid-column: 1; }
  .about-page > .about-photo { grid-column: 2; grid-row: 4 / span 2; width: 240px; margin-top: calc(var(--space-4) + 3.2rem); }
}
.about-company { margin-top: var(--space-5); display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-5);
  background: var(--card); border: 1px solid var(--line); border-radius: var(--r-tile); padding: var(--space-3); max-width: 38em; }
.pg .about-co { margin: 0; line-height: 1.6; }
