/* Profile page calibrated for browsers at 100% zoom. */
body.is-profile #app .about-page {
  --about-nav-height: 120px !important;
  width: min(87vw, 1600px) !important;
}

body.is-profile #app .about-nav {
  height: var(--about-nav-height) !important;
  padding: 0 6.5vw 12px !important;
}
body.is-profile #app .about-nav::after { bottom: 12px !important; }

body.is-profile #app .about-hero {
  min-height: 700px !important;
  gap: 72px !important;
  padding: calc(var(--about-nav-height) + 64px) 0 84px !important;
}
body.is-profile #app .about-kicker,
body.is-profile #app .about-section-heading > span {
  font-size: 14px !important;
  line-height: 1.5 !important;
  letter-spacing: 0.12em !important;
}
body.is-profile #app .about-hero-copy h1 {
  margin: 20px 0 10px !important;
  font-size: 64px !important;
  line-height: 1.08 !important;
}
body.is-profile #app .about-hero-copy > strong {
  font-size: 30px !important;
  line-height: 1.35 !important;
}
body.is-profile #app .about-hero-copy > p {
  width: 100% !important;
  margin-top: 26px !important;
  font-size: 18px !important;
  line-height: 1.7 !important;
}
body.is-profile #app .about-hero-copy > p span { white-space: normal !important; }
body.is-profile #app .about-contact-line {
  width: 100% !important;
  gap: 28px !important;
  margin-top: 32px !important;
  padding: 18px 0 !important;
}
body.is-profile #app .about-contact-line b { font-size: 14px !important; }
body.is-profile #app .about-contact-line span { font-size: 16px !important; }
body.is-profile #app .about-portrait { width: min(72%, 360px) !important; }
body.is-profile #app .about-portrait figcaption {
  padding: 14px 2px 4px !important;
  font-size: 12px !important;
}

body.is-profile #app .about-basic { gap: 18px !important; padding: 48px 0 !important; }
body.is-profile #app .about-basic div {
  min-height: 132px !important;
  padding: 26px 24px !important;
}
body.is-profile #app .about-basic span {
  margin-bottom: 10px !important;
  font-size: 13px !important;
}
body.is-profile #app .about-basic strong { font-size: 22px !important; line-height: 1.4 !important; }

body.is-profile #app .about-section { padding: 78px 0 !important; }
body.is-profile #app .about-section-heading {
  grid-template-columns: minmax(0, .9fr) minmax(360px, 1.1fr) !important;
  gap: 48px !important;
  margin-bottom: 48px !important;
}
body.is-profile #app .about-section-heading > span { margin-bottom: 12px !important; }
body.is-profile #app .about-section-heading h2 { font-size: 34px !important; line-height: 1.25 !important; }
body.is-profile #app .about-section-heading p { font-size: 18px !important; line-height: 1.7 !important; }

body.is-profile #app .about-timeline { gap: 22px !important; }
body.is-profile #app .about-timeline::before { left: 240px !important; }
body.is-profile #app .about-timeline article {
  grid-template-columns: 210px minmax(0, 1fr) !important;
  gap: 54px !important;
  padding: 34px 38px !important;
}
body.is-profile #app .about-timeline article:nth-child(2) { margin: 0 !important; }
body.is-profile #app .about-timeline time { font-size: 16px !important; line-height: 1.5 !important; }
body.is-profile #app .about-timeline article > div {
  left: 0 !important;
  width: 100% !important;
}
body.is-profile #app .about-timeline article > div::before { left: -48px !important; }
body.is-profile #app .about-timeline article span { font-size: 22px !important; line-height: 1.4 !important; }
body.is-profile #app .about-timeline h3 {
  margin: 8px 0 16px !important;
  font-size: 20px !important;
  line-height: 1.4 !important;
}
body.is-profile #app .about-timeline ol {
  padding-left: 1.35em !important;
  font-size: 16px !important;
  line-height: 1.75 !important;
}
body.is-profile #app .about-timeline li + li { margin-top: 8px !important; }

body.is-profile #app .about-capability-grid { gap: 18px !important; }
body.is-profile #app .about-capability-grid article,
body.is-profile #app .about-ai-flow article {
  min-height: 0 !important;
  padding: 28px !important;
}
body.is-profile #app .about-capability-grid b,
body.is-profile #app .about-ai-flow article > b { font-size: 16px !important; }
body.is-profile #app .about-capability-grid h3,
body.is-profile #app .about-ai-flow h3 {
  margin: 18px 0 12px !important;
  font-size: 22px !important;
  line-height: 1.4 !important;
}
body.is-profile #app .about-capability-grid p,
body.is-profile #app .about-ai-flow p { font-size: 16px !important; line-height: 1.7 !important; }
body.is-profile #app .about-ai-flow { gap: 12px !important; }
body.is-profile #app .about-ai-flow > i { width: 28px !important; font-size: 18px !important; }
body.is-profile #app .about-ai-flow article > span {
  position: static !important;
  display: block !important;
  margin-top: 20px !important;
  padding-top: 12px !important;
  font-size: 12px !important;
}

body.is-profile #app .about-software-track {
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 18px !important;
  overflow: visible !important;
  padding: 12px 0 30px !important;
}
body.is-profile #app .about-software-item {
  min-height: 96px !important;
  gap: 16px !important;
  padding: 18px !important;
}
body.is-profile #app .about-software-item i {
  width: 52px !important;
  height: 52px !important;
  flex-basis: 52px !important;
  font-size: 18px !important;
}
body.is-profile #app .about-software-item span { font-size: 18px !important; }
body.is-profile #app .about-footer {
  padding: 52px 0 80px !important;
  font-size: 14px !important;
}

@media (max-width: 900px) {
  body.is-profile #app .about-page { --about-nav-height: 72px !important; width: calc(100% - 28px) !important; }
  body.is-profile #app .about-nav { padding: 0 14px 10px !important; }
  body.is-profile #app .about-nav::after { right: 14px !important; bottom: 10px !important; left: 14px !important; }
  body.is-profile #app .about-hero { grid-template-columns: 1fr !important; min-height: 0 !important; gap: 42px !important; padding: 112px 0 64px !important; }
  body.is-profile #app .about-hero-copy h1 { font-size: 48px !important; }
  body.is-profile #app .about-hero-copy > strong { font-size: 26px !important; }
  body.is-profile #app .about-contact-line { flex-wrap: wrap !important; gap: 12px 20px !important; }
  body.is-profile #app .about-portrait { width: min(72%, 320px) !important; justify-self: start !important; }
  body.is-profile #app .about-basic { grid-template-columns: 1fr 1fr !important; }
  body.is-profile #app .about-section { padding: 60px 0 !important; }
  body.is-profile #app .about-section-heading { grid-template-columns: 1fr !important; gap: 16px !important; }
  body.is-profile #app .about-section-heading h2 { font-size: 30px !important; }
  body.is-profile #app .about-timeline::before { display: none !important; }
  body.is-profile #app .about-timeline article { grid-template-columns: 1fr !important; gap: 16px !important; padding: 28px 24px !important; }
  body.is-profile #app .about-timeline article > div::before { display: none !important; }
  body.is-profile #app .about-capability-grid { grid-template-columns: 1fr !important; }
  body.is-profile #app .about-capability-grid article:nth-child(1) { grid-column: auto !important; }
  body.is-profile #app .about-ai-flow { grid-template-columns: 1fr !important; }
  body.is-profile #app .about-ai-flow > i { width: 100% !important; height: 22px !important; transform: rotate(90deg); }
  body.is-profile #app .about-software-track { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}

@media (max-width: 520px) {
  body.is-profile #app .about-basic,
  body.is-profile #app .about-software-track { grid-template-columns: 1fr !important; }
}
