/* About follows the homepage brand palette, not either product's theme. */
@font-face {
  font-family: 'Sora'; font-style: normal; font-weight: 100 800; font-display: swap;
  src: url('/assets/fonts/sora-latin.woff2') format('woff2');
}
.about-page {
  --display: 'Sora', ui-sans-serif, system-ui, sans-serif;
  --bg: #0c0e12; --maxw: 1380px;
}
.about-page::before { opacity: .018; }
.about-page .site-header { background: #0c0e12e8; border-bottom: 1px solid #ffffff12; }
.about-page .site-footer { background: #0c0e12; border-top-color: var(--line); }
.about-page .brand-wm { font-family: var(--display); letter-spacing: 0; }
.about-page .eyebrow { color: #939eac; font-family: var(--body); font-weight: 500; letter-spacing: .11em; }
.about-page h1, .about-page h2, .about-page h3 { color: #f3f5f8; font-weight: 650; letter-spacing: -.035em; line-height: 1.15; }
.about-intro { padding-top: clamp(3rem, 7vw, 6rem); }
.about-intro-grid { display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(2rem, 6vw, 6rem); margin-top: 2rem; }
.about-intro-grid > * { min-width: 0; }
.about-page h1 { max-width: 10ch; font-size: clamp(2.7rem, 5.4vw, 4.85rem); }
.about-role { margin-top: 1.6rem; color: #9fa9b7; font-size: 1.15rem; }
.about-text-link { display: inline-flex; align-items: center; gap: .8rem; color: var(--accent-bright); }
.about-text-link:hover { color: #fff; }
.about-intro .about-text-link { margin-top: 1.5rem; --link-color: var(--audio-link); --link-active-color: var(--audio-link-active); }
.about-bio { padding-top: .35rem; }
.about-bio p { color: #d4dbe5; font-size: 1.15rem; line-height: 1.75; }
.about-bio p + p { margin-top: 1.25rem; }
.about-products { padding-block: clamp(3rem, 6vw, 5rem); }
.about-page h2 { font-size: clamp(1.8rem, 3.2vw, 2.75rem); margin-top: 1rem; }
.about-product-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; margin-top: 2.5rem; }
.about-product { display: flex; flex-direction: column; align-items: flex-start; padding: clamp(1.5rem, 3vw, 2.5rem); background: #ffffff03; border: 1px solid var(--line); border-radius: 12px; }
.about-product h3 { font-size: 1.6rem; }
.about-product p { margin-block: 1.25rem 2rem; max-width: 47ch; color: #a0abba; line-height: 1.75; }
.about-page .btn-primary { margin-top: auto; background: #e4ebf2; border-color: #ffffff22; color: #18212b; box-shadow: none; font-family: var(--display); font-size: .8rem; font-weight: 600; border-radius: 6px; }
.about-page .btn-primary[href="/intercom/"] { background: #dedbea; }
.about-page .btn-primary:is(:hover, :focus-visible) { background: #fff; transform: none; }
.about-contact { display: flex; justify-content: space-between; align-items: center; gap: 2rem; padding-bottom: clamp(3rem, 6vw, 5rem); }
.about-contact > div { max-width: 43rem; }
.about-contact p:not(.eyebrow) { max-width: 56ch; margin-top: 1.25rem; color: #a0abba; }
.about-contact > a { flex-shrink: 0; }
@media (max-width: 800px) {
  .about-intro-grid, .about-product-grid { grid-template-columns: 1fr; }
  .about-contact { flex-direction: column; align-items: flex-start; }
}