/* Quantsion About: an editorial page in normal document flow. */
.about-page {
  color: #132d58;
  background: #f7f9fc;
}
.about-shell {
  width: min(calc(100% - (112 * var(--psv-u))), (1240 * var(--psv-u)));
  margin-inline: auto;
}
.about-hero { padding-block: calc(104 * var(--psv-u)) calc(88 * var(--psv-u)); }
.about-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
  gap: calc(72 * var(--psv-u));
  align-items: center;
}
.about-eyebrow, .about-number {
  display: block;
  margin: 0 0 calc(26 * var(--psv-u));
  font: 500 calc(12 * max(var(--psv-u), var(--psv-label-floor)))/1.5 var(--psv-font-mono);
  letter-spacing: .12em;
  color: #42648e;
}
.about-page h1 {
  margin: 0;
  max-width: calc(760 * var(--psv-u));
  font: 600 calc(66 * var(--psv-u))/1.06 var(--psv-font-hero);
  letter-spacing: -.055em;
  text-wrap: balance;
  color: #132d58;
}
.about-intro {
  margin: calc(32 * var(--psv-u)) 0 0;
  font: 400 calc(19 * var(--psv-u))/1.75 var(--psv-font-sans);
  color: #3f5266;
}
.about-mission {
  margin: calc(30 * var(--psv-u)) 0 0;
  padding-left: calc(20 * var(--psv-u));
  border-left: 2px solid #338cff;
  font: 500 calc(18 * var(--psv-u))/1.65 var(--psv-font-sans);
  max-width: calc(540 * var(--psv-u));
}
.about-field {
  position: relative;
  align-self: stretch;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
  padding: calc(28 * var(--psv-u));
  background: #102645;
  border: 1px solid #24456d;
}
.about-field-mark {
  font: 500 calc(14 * var(--psv-u))/1.5 var(--psv-font-mono);
  color: #aac6e8;
  letter-spacing: .12em;
}
.about-field svg { display: block; width: 100%; height: auto; margin-block: calc(12 * var(--psv-u)) calc(28 * var(--psv-u)); }
.about-field-key {
  display: flex;
  flex-wrap: wrap;
  gap: calc(10 * var(--psv-u)) calc(18 * var(--psv-u));
  padding-top: calc(20 * var(--psv-u));
  border-top: 1px solid #325073;
  color: #c6d8ec;
  font: 400 calc(11 * max(var(--psv-u), var(--psv-label-floor)))/1.5 var(--psv-font-mono);
}
.about-field-key span::before {
  content: '';
  display: inline-block;
  width: calc(4 * var(--psv-u));
  height: calc(4 * var(--psv-u));
  background: #73b2ff;
  margin: 0 calc(7 * var(--psv-u)) calc(2 * var(--psv-u)) 0;
}
.about-section { padding-block: calc(100 * var(--psv-u)); }
.about-purpose { border-top: 1px solid #d8e1ec; }
.about-editorial {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.45fr);
  gap: calc(100 * var(--psv-u));
}
.about-editorial header { min-width: 0; }
.about-page h2 {
  margin: 0;
  font: 500 calc(42 * var(--psv-u))/1.16 var(--psv-font-hero);
  letter-spacing: -.04em;
  text-wrap: balance;
  color: inherit;
}
.about-prose { font: 400 calc(19 * var(--psv-u))/1.85 var(--psv-font-sans); color: #3f5266; }
.about-prose p { margin: 0; color: inherit; }
.about-prose p + p { margin-top: calc(24 * var(--psv-u)); }
.about-link {
  display: inline-flex;
  align-items: center;
  gap: calc(20 * var(--psv-u));
  min-height: max(44px, calc(44 * var(--psv-u)));
  max-width: 100%;
  margin-top: calc(30 * var(--psv-u));
  padding-bottom: calc(6 * var(--psv-u));
  color: inherit;
  border-bottom: 1px solid #9cafc5;
  font: 500 max(var(--psv-text-floor), calc(15 * var(--psv-u)))/1.5 var(--psv-font-sans);
  text-decoration: none;
}
.about-link > :last-child { font-size: calc(23 * var(--psv-u)); }
.about-link:hover { color: #176bc7; border-color: currentColor; }
.about-page a:focus-visible { outline: 2px solid #338cff; outline-offset: 5px; }
.about-research { background: #102645; color: #f7f9fc; }
.about-research .about-number { color: #91b3db; }
.about-research .about-prose { color: #c4d3e5; }
.about-research .about-link { border-color: #587392; }
.about-research .about-link:hover { color: #9cc8ff; }
.about-principles {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  list-style: none;
  margin: calc(64 * var(--psv-u)) 0 0;
  padding: 0;
  border-top: 1px solid #3c5471;
}
.about-principles li { padding: calc(28 * var(--psv-u)) calc(36 * var(--psv-u)) 0 0; }
.about-principles li + li { padding-left: calc(36 * var(--psv-u)); border-left: 1px solid #3c5471; }
.about-principles li > span { color: #86baff; font: 400 calc(12 * max(var(--psv-u), var(--psv-label-floor)))/1.5 var(--psv-font-mono); }
.about-principles h3 { margin: calc(14 * var(--psv-u)) 0 0; font: 500 calc(23 * var(--psv-u))/1.35 var(--psv-font-sans); color: inherit; }
.about-process {
  list-style: none;
  margin: calc(36 * var(--psv-u)) 0 0;
  padding: 0;
  counter-reset: about-step;
}
.about-process li {
  display: flex;
  align-items: center;
  gap: calc(22 * var(--psv-u));
  padding: calc(18 * var(--psv-u)) 0;
  border-top: 1px solid #d0dce8;
  color: #132d58;
  font-size: calc(17 * var(--psv-u));
  font-weight: 500;
  counter-increment: about-step;
}
.about-process li::before { content: '0' counter(about-step); font: 400 calc(12 * max(var(--psv-u), var(--psv-label-floor)))/1.5 var(--psv-font-mono); color: #5075a4; }
.about-terminal { background: #eaf0f7; border-block: 1px solid #d8e1ec; }
.about-product { margin: calc(56 * var(--psv-u)) 0 0; }
.about-product-bar {
  display: flex;
  justify-content: space-between;
  gap: calc(16 * var(--psv-u));
  padding: calc(16 * var(--psv-u)) calc(22 * var(--psv-u));
  color: #c6d8ec;
  background: #102645;
  border: 1px solid #24456d;
  font: 400 calc(12 * max(var(--psv-u), var(--psv-label-floor)))/1.5 var(--psv-font-mono);
}
.about-product img { display: block; width: 100%; height: auto; border: 1px solid #24456d; border-top: 0; }
.about-product figcaption { margin-top: calc(16 * var(--psv-u)); font: 400 calc(12 * max(var(--psv-u), var(--psv-label-floor)))/1.5 var(--psv-font-mono); color: #52647b; }
.about-company { padding-block: calc(64 * var(--psv-u)); }
.about-company-grid { display: grid; grid-template-columns: 1fr 1fr; gap: calc(80 * var(--psv-u)); }
.about-company h2 { font-size: calc(25 * var(--psv-u)); letter-spacing: -.025em; }
.about-company p { margin: calc(16 * var(--psv-u)) 0 0; color: #52647b; font: 400 max(var(--psv-text-floor), calc(15 * var(--psv-u)))/1.7 var(--psv-font-sans); }
.about-company dl { display: grid; grid-template-columns: 1fr 1fr; gap: calc(32 * var(--psv-u)); margin: 0; }
.about-company dt { color: #52647b; font: 400 calc(12 * max(var(--psv-u), var(--psv-label-floor)))/1.5 var(--psv-font-mono); }
.about-company dd { margin: calc(12 * var(--psv-u)) 0 0; }
.about-company dd a { display: inline-flex; align-items: center; gap: calc(14 * var(--psv-u)); min-height: max(44px, calc(44 * var(--psv-u))); color: #132d58; font: 500 calc(16 * var(--psv-u))/1.5 var(--psv-font-sans); text-decoration: none; }
.about-company dd a:hover { text-decoration: underline; text-underline-offset: calc(4 * var(--psv-u)); }
@media (max-width: 1050px) {
  .about-shell { width: calc(100% - 64px); }
  .about-hero { padding-block: 72px; }
  .about-hero-grid { gap: 36px; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); }
  .about-page h1 { font-size: 48px; }
  .about-field { padding: 22px; }
  .about-editorial { gap: 48px; grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr); }
  .about-page h2 { font-size: 34px; }
  .about-intro, .about-prose { font-size: 17px; }
  .about-mission { font-size: 17px; }
  .about-section { padding-block: 76px; }
  .about-principles li { padding-right: 24px; }
  .about-principles li + li { padding-left: 24px; }
  .about-principles h3 { font-size: 21px; }
  .about-company-grid { gap: 32px; }
  .about-company h2 { font-size: 23px; }
  .about-company dl { grid-template-columns: 1fr; gap: 20px; }
}
@media (max-width: 760px) {
  .about-shell { width: calc(100% - 40px); }
  .about-hero { padding-block: 52px 48px; }
  .about-hero-grid, .about-editorial, .about-company-grid { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .about-page h1 { font-size: clamp(38px, 9.8vw, 58px); letter-spacing: -.05em; }
  .about-eyebrow { margin-bottom: 22px; font-size: 11px; }
  .about-intro { margin-top: 26px; line-height: 1.8; }
  .about-mission { margin-top: 24px; padding-left: 16px; }
  .about-field { padding: 22px; }
  .about-field svg { width: min(100%, 300px); margin: -18px auto 12px; }
  .about-field-key { gap: 8px 16px; padding-top: 16px; }
  .about-section { padding-block: 58px; }
  .about-page h2 { max-width: 440px; font-size: 34px; }
  .about-number { margin-bottom: 18px; }
  .about-link { margin-top: 22px; font-size: 15px; }
  .about-principles { grid-template-columns: minmax(0, 1fr); margin-top: 36px; }
  .about-principles li, .about-principles li + li { display: grid; grid-template-columns: 28px minmax(0, 1fr); align-items: baseline; gap: 16px; border-left: 0; padding: 22px 0; border-bottom: 1px solid #3c5471; }
  .about-principles h3 { margin: 0; font-size: 21px; }
  .about-process { margin-top: 28px; }
  .about-process li { font-size: 16px; }
  .about-product { margin-top: 36px; }
  .about-product-bar { padding: 12px; font-size: 11px; }
  .about-product figcaption { font-size: 11px; }
  .about-company { padding-block: 44px; }
  .about-company h2 { font-size: 23px; }
  .about-company dl { grid-template-columns: minmax(0, 1fr); gap: 22px; }
  .about-company dd { margin-top: 4px; }
}