/* About page — design: About.dc.html. Shares .bp/.bpl/.crumb from blog.css, .page-hero from site.css. */
.ab-eyebrow { margin: 0; font-family: "IBM Plex Mono", monospace; font-size: 13px; letter-spacing: 0.12em; color: var(--blue); text-transform: uppercase; }
.ab-eyebrow--orange { color: #FF8A57; }
.ab-mono { font-family: "IBM Plex Mono", monospace; font-size: 12px; color: #6A7490; }
.ab-code { font-family: "IBM Plex Mono", monospace; font-size: 13px; font-weight: 600; color: #FF6A2B; }
.ab-t { font-family: Archivo, sans-serif; font-weight: 700; font-size: 20px; line-height: 1.25; color: var(--navy); }
.ab-t--lg { font-size: 22px; }
.ab-d { font-size: 14px; line-height: 1.6; color: #4A5570; }
.ab-d--lg { font-size: 15px; }
.ab-p { margin: 0; font-size: 17px; line-height: 1.65; color: #4A5570; }
.ab-p--sm { font-size: 16px; line-height: 1.6; }
.ab-sec { padding: 88px var(--pad); }
.ab-sec h2 { margin: 0; font-family: Archivo, sans-serif; font-weight: 700; font-size: 42px; line-height: 1.1; letter-spacing: -0.01em; color: var(--navy); }
.ab-sec .sec-head { margin-bottom: 36px; }
.ab-grid4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }

.ab-btn { font-weight: 600; font-size: 16px; padding: 15px 26px; border-radius: 4px; display: inline-flex; align-items: center; gap: 10px; }
.ab-btn--blue { background: var(--blue); color: #fff; }
.ab-btn--blue:hover { background: #fff; color: var(--navy); }
.ab-btn--ghost { border: 1px solid #3A4B7A; color: #fff; }
.ab-btn--ghost:hover { background: #fff; color: var(--navy); }
.ab-btn--navy { background: var(--navy); color: #fff; font-size: 15px; padding: 14px 22px; }
.ab-btn--navy:hover { background: var(--blue); color: #fff; }
.ab-btn--line { border: 1px solid #C9D1E3; color: var(--navy); font-size: 15px; padding: 13px 20px; background: #fff; }
.ab-btn--line:hover { border-color: var(--navy); color: var(--navy); }
.ab-hiring { font-family: "IBM Plex Mono", monospace; font-size: 10px; color: #fff; background: #C2410C; padding: 2px 6px; border-radius: 3px; }

/* hero */
.ab-hero { padding: 64px var(--pad) 28px; display: flex; flex-direction: column; gap: 48px; }
.ab-hero__row { display: flex; gap: 56px; align-items: center; }
.ab-hero__text { flex: 1 1 0; display: flex; flex-direction: column; gap: 24px; }
.ab-hero h1 { margin: 0; font-family: Archivo, sans-serif; font-weight: 800; font-size: 58px; line-height: 1.04; letter-spacing: -0.015em; color: #fff; }
.ab-hero__intro { margin: 0; font-size: 18px; line-height: 1.6; color: #C3CCE2; max-width: 540px; }
.ab-hero__ctas { display: flex; flex-wrap: wrap; gap: 14px; padding-top: 4px; }
.ab-fig { margin: 0; width: 540px; flex-shrink: 0; background: #0F1D42; border: 1px solid #2A3D75; border-radius: 6px; overflow: hidden; display: flex; flex-direction: column; }
.ab-fig__bar { height: 38px; display: flex; align-items: center; justify-content: space-between; padding: 0 16px; border-bottom: 1px solid #2A3D75; font-family: "IBM Plex Mono", monospace; font-size: 12px; color: #A9B4CF; }
.ab-fig svg { display: block; }
.ab-fig figcaption { border-top: 1px solid #2A3D75; padding: 12px 16px; font-size: 13px; line-height: 1.5; color: #C3CCE2; }
.ab-hero__foot { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; flex-wrap: wrap; }
.ab-hero__sectors { font-family: "IBM Plex Mono", monospace; font-size: 11px; color: #5C6B93; }
.ab-titleblock { display: flex; border: 1px solid #2E3F6E; font-family: "IBM Plex Mono", monospace; font-size: 11px; color: #A9B4CF; }
.ab-titleblock span { padding: 8px 14px; border-right: 1px solid #2E3F6E; }
.ab-titleblock span:last-child { border-right: 0; }

/* 01 */
.ab-who { display: flex; gap: 64px; }
.ab-who__text { flex: 1 1 0; display: flex; flex-direction: column; gap: 22px; }
.ab-table { width: 520px; flex-shrink: 0; align-self: flex-start; border: 1px solid #D5DCEA; border-radius: 6px; overflow: hidden; }
.ab-table__head, .ab-table__row { display: grid; grid-template-columns: 150px 1fr; }
.ab-table__head { background: var(--navy); color: #fff; font-family: "IBM Plex Mono", monospace; font-size: 12px; letter-spacing: 0.06em; }
.ab-table__head span { padding: 14px 20px; }
.ab-table__row { border-top: 1px solid #E3E8F2; font-size: 14px; line-height: 1.5; }
.ab-table__row span { padding: 16px 20px; color: #4A5570; }
.ab-table__row span:first-child { font-family: Archivo, sans-serif; font-weight: 700; color: var(--navy); }

/* 02 */
.ab-vm { display: flex; flex-direction: column; gap: 36px; }
.ab-vm__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.ab-vm__card { border-radius: 6px; padding: 34px 36px; display: flex; flex-direction: column; gap: 16px; min-height: 250px; }
.ab-vm__card--light { background: #fff; border: 1px solid #D5DCEA; }
.ab-vm__k { font-family: "IBM Plex Mono", monospace; font-size: 12px; letter-spacing: 0.12em; color: var(--blue); }
.ab-vm__k--orange { color: #FF8A57; }
.ab-vm__t { font-family: Archivo, sans-serif; font-weight: 700; font-size: 32px; line-height: 1.15; color: var(--navy); }
.ab-vm__d { font-size: 15px; line-height: 1.6; color: #4A5570; }
.ab-vm__card.bp .ab-vm__t { color: #fff; }
.ab-vm__card.bp .ab-vm__d { color: #C3CCE2; }

/* 03 */
.ab-why__head { display: flex; gap: 64px; align-items: flex-end; margin-bottom: 40px; }
.ab-why__head > div { flex: 1 1 0; display: flex; flex-direction: column; gap: 14px; }
.ab-why__head blockquote { margin: 0; width: 560px; flex-shrink: 0; border-top: 2px solid #FF6A2B; padding-top: 16px; font-size: 18px; line-height: 1.6; color: var(--navy); }
.ab-why__item { display: flex; flex-direction: column; gap: 12px; border-top: 2px solid var(--navy); padding-top: 20px; }

/* 04 */
.ab-values { display: flex; flex-direction: column; gap: 12px; }
.ab-values h2 { margin-bottom: 28px; }
.ab-value { background: #fff; border: 1px solid #D5DCEA; border-radius: 6px; padding: 24px 22px; display: flex; flex-direction: column; gap: 14px; min-height: 200px; }
.ab-value__top { display: flex; justify-content: space-between; align-items: center; color: var(--blue); }
.ab-value .ab-t { font-size: 21px; }

/* 05 */
.ab-marks { border-top: 1px solid #E3E8F2; }
.ab-marks__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.ab-mark { background: #fff; border: 1px solid #D5DCEA; border-radius: 6px; overflow: hidden; display: flex; flex-direction: column; }
.ab-mark__anim { border-bottom: 1px solid #E3E8F2; }
.ab-mark__anim svg { display: block; }
.ab-mark__body { padding: 14px 16px 16px; display: flex; flex-direction: column; gap: 8px; flex-grow: 1; }
.ab-mark__title { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.ab-mark__title span:first-child { font-family: Archivo, sans-serif; font-weight: 700; font-size: 16px; color: var(--navy); }
.ab-mark__title .ab-mono { font-size: 10px; white-space: nowrap; }
.ab-mark .ab-d { font-size: 13px; line-height: 1.5; }
.ab-mark__eq { margin-top: auto; font-family: "IBM Plex Mono", monospace; font-size: 12px; color: var(--navy); background: #F4F6FA; border: 1px solid #E3E8F2; padding: 7px 9px; border-radius: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ab-mark.ab-mark--link { background-color: var(--navy); background-image: linear-gradient(rgba(130,160,255,.10) 1px, transparent 1px), linear-gradient(90deg, rgba(130,160,255,.10) 1px, transparent 1px), linear-gradient(rgba(130,160,255,.04) 1px, transparent 1px), linear-gradient(90deg, rgba(130,160,255,.04) 1px, transparent 1px); background-size: 120px 120px, 120px 120px, 24px 24px, 24px 24px; }
.ab-mark--link { border: 0; padding: 22px; justify-content: space-between; color: #fff; min-height: 240px; }
.ab-mark--link:hover { color: #fff; }
.ab-mark--link .ab-code { font-size: 11px; letter-spacing: 0.1em; color: #FF8A57; font-weight: 400; }
.ab-mark--link__t { font-family: Archivo, sans-serif; font-weight: 700; font-size: 20px; line-height: 1.25; }
.ab-mark--link__go { font-size: 14px; font-weight: 600; }
.ab-mark--link:hover .ab-mark--link__go { color: #FF8A57; }

/* 06 */
.ab-goals__line { position: relative; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
.ab-goals__line::before { content: ""; position: absolute; left: 7px; right: 7px; top: 7px; height: 2px; background: var(--navy); }
.ab-goal { position: relative; display: flex; flex-direction: column; gap: 12px; }
.ab-goal__dot { width: 16px; height: 16px; border-radius: 50%; background: #fff; border: 2px solid #FF6A2B; }
.ab-goal__meta { display: flex; justify-content: space-between; }

/* 07 */
.ab-people { display: flex; gap: 56px; align-items: flex-start; }
.ab-people__photo { width: 560px; aspect-ratio: 560 / 400; flex-shrink: 0; border-radius: 8px; overflow: hidden; display: flex; align-items: flex-end; background-color: #DCE2EE; background-image: repeating-linear-gradient(135deg, rgba(14,21,38,.06) 0 10px, transparent 10px 20px); }
.ab-people__photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
.ab-people__photo span { padding: 14px 18px; font-family: "IBM Plex Mono", monospace; font-size: 11px; color: #4A5570; }
.ab-people__text { flex: 1 1 0; display: flex; flex-direction: column; gap: 20px; }
.ab-note { margin: 0; border-left: 3px solid #FF6A2B; padding: 2px 0 2px 22px; display: flex; flex-direction: column; gap: 14px; }
.ab-note p { margin: 0; font-size: 17px; line-height: 1.7; color: #1D2740; }
.ab-note p:first-child { font-family: Archivo, sans-serif; font-weight: 600; font-size: 20px; line-height: 1.45; color: var(--navy); }
.ab-sign { display: flex; align-items: center; gap: 16px; }
.ab-sign__line { width: 36px; height: 2px; background: var(--navy); }
.ab-sign > div { display: flex; flex-direction: column; gap: 3px; }
.ab-sign__name { font-family: Archivo, sans-serif; font-weight: 700; font-size: 18px; color: var(--navy); }
.ab-sign__li { margin-left: auto; font-size: 14px; font-weight: 600; color: var(--blue); }
.ab-rows { border-top: 1px solid #C9D1E3; }
.ab-rows > div { display: grid; grid-template-columns: 170px 1fr; padding: 12px 0; border-bottom: 1px solid #C9D1E3; font-size: 14px; color: var(--navy); }
.ab-rows .ab-mono { font-size: 11px; letter-spacing: 0.06em; padding-top: 2px; }

/* 08 */
.ab-facts { display: flex; gap: 64px; }
.ab-facts__text { width: 380px; flex-shrink: 0; display: flex; flex-direction: column; gap: 18px; }
.ab-facts__grid { flex-grow: 1; align-self: flex-start; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid #D5DCEA; border-left: 1px solid #D5DCEA; }
.ab-facts__grid > div { border-right: 1px solid #D5DCEA; border-bottom: 1px solid #D5DCEA; padding: 16px 20px; display: flex; flex-direction: column; gap: 6px; font-size: 15px; color: var(--navy); }
.ab-facts__grid .ab-mono { font-size: 11px; letter-spacing: 0.06em; }

/* CTA */
.ab-cta { background-color: var(--blue); padding: 88px var(--pad); display: flex; align-items: center; justify-content: space-between; gap: 64px; }
.ab-cta > div:first-child { display: flex; flex-direction: column; gap: 16px; color: #fff; max-width: 680px; }
.ab-cta h2 { margin: 0; font-family: Archivo, sans-serif; font-weight: 800; font-size: 46px; line-height: 1.08; color: #fff; }
.ab-cta p { margin: 0; font-size: 17px; line-height: 1.6; color: #DCE4FF; }
.ab-cta .ab-eyebrow--orange { color: #FFC8A8; }
.ab-cta__btns { display: flex; flex-direction: column; gap: 12px; width: 300px; flex-shrink: 0; }
.ab-cta__btns a { text-align: center; font-weight: 600; font-size: 16px; padding: 16px 0; border-radius: 4px; }
.ab-cta__main { background: #fff; color: var(--navy); }
.ab-cta__main:hover { background: var(--navy); color: #fff; }
.ab-cta__sec { border: 1px solid rgba(255,255,255,.55); color: #fff; }
.ab-cta__sec:hover { background: #fff; color: var(--navy); }

@media (max-width: 1240px) {
  .ab-hero__row, .ab-who, .ab-why__head, .ab-people, .ab-facts, .ab-cta { flex-direction: column; align-items: stretch; }
  .ab-fig, .ab-table, .ab-why__head blockquote, .ab-people__photo, .ab-facts__text, .ab-cta__btns { width: auto; }
  .ab-grid4, .ab-marks__grid, .ab-goals__line { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ab-goals__line::before { display: none; }
}
@media (max-width: 700px) {
  .ab-hero h1 { font-size: 38px; }
  .ab-sec h2, .ab-cta h2 { font-size: 30px; }
  .ab-grid4, .ab-marks__grid, .ab-goals__line, .ab-vm__grid, .ab-facts__grid { grid-template-columns: 1fr; }
  .ab-titleblock { flex-wrap: wrap; }
}
