/* ============================================
   INTRO — opens dark, which no other page does,
   so About stands apart right away
   ============================================ */

.rb-about-intro__lede {
  color: rgba(255, 255, 255, 0.75);
  margin-top: 1rem;
}

/* ============================================
   STORY
   ============================================ */

.rb-about-story { padding-top: 5.5rem; }

/* ============================================
   BIO — heading left, copy and quick facts right
   ============================================ */

.rb-about-bio__layout {
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: 4rem;
  align-items: start;
}

.rb-about-bio h2 { max-width: 440px; }

.rb-about-bio__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 1.75rem;
}

.rb-about-bio__chips li {
  padding: 0.55rem 1.1rem;
  border: 1px solid var(--accent-strong);
  border-radius: 999px;
  background: var(--paper);
  color: var(--ink);
  font-weight: 600;
  font-size: 0.85rem;
  transition: background 0.2s ease, border-color 0.2s ease;
}

.rb-about-bio__chips li:hover { background: var(--accent-soft); }

@media (max-width: 900px) {
  .rb-about-bio__layout { grid-template-columns: 1fr; gap: 2rem; }
}

/* ============================================
   CLOSING CTA
   ============================================ */

.rb-about-cta__layout {
  max-width: 640px;
  text-align: center;
  margin: 0 auto;
}

.rb-about-cta__layout p { max-width: 480px; margin-left: auto; margin-right: auto; }

.rb-about-cta .rb-btn-row { justify-content: center; }