/* About us page (Figma: About us / Desktop 138:6473, Tablet 138:6717, Phone 138:6979). */

/* This page's footer has no CTA band (Figma footer instance is 965px tall). */
.no-cta .cta-band { display: none; }
.no-cta .site-footer > .rule-t { border-top: 0; }

.h1-lg { font-weight: 500; font-size: 40px; line-height: 40px; letter-spacing: -.4px; }

/* 1400 frame with a dot grid around a centred 920px column */
.about-page { padding: 0 95px; background-image: radial-gradient(circle, var(--surface-primary) .9px, transparent 1.2px); background-size: 8px 8px; }
.about-page .inner { max-width: 920px; margin: 0 auto; overflow: hidden; background: var(--bg-primary); border-left: 1px solid var(--border-primary); border-right: 1px solid var(--border-primary); }

.a-head { padding: 40px 40px 39px; border-bottom: 1px solid var(--border-primary); }

/* Section shell: a label tab on a third of the width, then content */
.a-sec { padding: 40px 0; }
.sec-label { width: 33.3333%; padding: 16px 40px 15px; border-bottom: 1px solid var(--border-primary); }

/* Origins */
.story { padding: 40px; }
.story p { max-width: 532px; }
.story p + p { margin-top: 20px; }
.facts { display: flex; align-items: flex-start; gap: 8px; padding: 40px; }
.facts .raised { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: 8px; }
.facts dl { margin: 0; display: flex; flex-direction: column; align-items: flex-end; gap: 8px; white-space: nowrap; }
.facts dl div { display: flex; align-items: center; gap: 8px; }
.facts dd { margin: 0; }

/* Team: person cards (moved from the homepage) */
.team-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; padding: 40px 40px 0; }
.advised { max-width: 560px; padding: 24px 40px 40px; }
.person { display: flex; flex-direction: column; gap: 4px; padding: 28px; border: 1px solid var(--border-primary); border-radius: 16px; background: var(--surface-primary); }
.person ul { margin: 16px 0 0; padding-left: 18px; display: flex; flex-direction: column; gap: 8px; }
.person.advisors ul { list-style: none; padding: 0; gap: 14px; }
.person.advisors b { font-weight: 500; color: var(--text-primary); }
.person .more { margin-top: 20px; }

/* Recognition */
.rec-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; padding: 40px; }
.rec-grid > div { display: flex; flex-direction: column; gap: 6px; }

/* Talk to us */
.a-actions { display: flex; flex-wrap: wrap; gap: 12px; padding: 0 40px 40px; }

/* Trusted by: a short rule over the caption, then a ticker */
.a-logos .lead-wrap { display: flex; }
.a-logos .lead { padding: 40px 40px 0; border-top: 1px solid var(--border-primary); }
.a-logos .row { padding: 36px 0 42px; border-bottom: 1px solid var(--border-primary); overflow: hidden; }
.a-logos .row .track { width: max-content; gap: 46px; align-items: center; justify-content: flex-start; animation: marquee 30s linear infinite; }
.a-logos .row .track > img { width: 137px; height: auto; flex: none; }
.a-logos .row .track [aria-hidden] { display: block; }

/* Milestones timeline: 23px tick pitch, scrolled with the arrows */
.tl { display: flex; flex-direction: column; gap: 32px; padding: 40px 40px 0 32px; }
.tl-view { overflow: visible; }
.tl-track { position: relative; display: flex; align-items: center; gap: 22px; height: 94px; padding-bottom: 74px; transition: transform .35s ease; }
.tick { position: relative; flex-shrink: 0; width: 1px; height: 16px; background: var(--border-primary); }
.tick.major { height: 20px; margin-left: -6px; background: #001441; }
.tick.major:first-child { margin-left: 0; }
.tick .ms { position: absolute; left: 0; top: 44px; display: flex; flex-direction: column; gap: 2px; white-space: nowrap; }
.tl-nav { display: flex; gap: 8px; }
.tl-nav .pill-icon { width: 55px; transition: background-color .2s, opacity .2s; }
.tl-nav .pill-icon:hover { background: var(--border-secondary); }
.tl-nav .pill-icon:disabled { cursor: default; }

/* Team */
.team .grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 40px 20px; padding: 40px 44px; }
.member { margin: 0; display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center; }
.member .pic { width: 100%; height: 217px; display: flex; align-items: flex-end; justify-content: center; overflow: hidden; border-top: 1px solid var(--border-primary); border-bottom: 1px solid var(--border-primary); background-image: radial-gradient(circle, var(--surface-primary) .9px, transparent 1.2px); background-size: 8px 8px; }
.member .pic img { flex-shrink: 0; width: 201px; height: 201px; max-width: none; object-fit: cover; transition: transform .3s ease; }
.member:hover .pic img { transform: scale(1.04); transform-origin: bottom center; }
.member figcaption, .member .cap { display: flex; flex-direction: column; align-items: center; gap: 2px; white-space: nowrap; }
.member .nm { font-size: 16px; line-height: 24px; }
.member.open:hover .nm { color: var(--text-secondary); }

/* ---------- Tablet (810) ---------- */
@media (max-width: 1199px) {
  .about-page { padding: 0 5px; border: 0; }
  .about-page .inner { max-width: none; }
  .member .pic { height: 187px; }
  .member .pic img { width: 170px; height: 170px; }
  .h1-lg { font-size: 32px; line-height: 34px; letter-spacing: -.32px; }
  .display-h3 { font-size: 36px; line-height: 40px; }
  .team .grid { padding: 40px; gap: 40px 12px; }
  .rec-grid { grid-template-columns: 1fr 1fr; }
}

/* ---------- Phone (390) ---------- */
@media (max-width: 809px) {
  .about-page { padding: 0; }
  .about-page .inner { border: 0; }
  .a-head { padding: 32px 20px 31px; }
  .member .pic { height: 184px; }
  .member .pic img { width: 168px; height: 168px; }
  .sec-label { width: 50%; padding: 16px 20px 15px; }
  .story { padding: 20px; }
  .facts { flex-direction: column; gap: 20px; padding: 20px; }
  .facts dl { align-items: flex-start; }
  .facts { gap: 24px; }
  .a-logos .lead-wrap { display: block; }
  .a-logos .lead { padding: 40px 20px 0; }
  .tl { padding: 20px 20px 0; }
  .team .grid { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 20px; }
  .team-grid { grid-template-columns: 1fr; padding: 20px 20px 0; }
  .advised { padding: 20px; }
  .rec-grid { grid-template-columns: 1fr; padding: 20px; }
  .a-actions { padding: 0 20px 20px; }
}
@media (prefers-reduced-motion: reduce) { .a-logos .row .track { animation: none; } }
