/* About content sizing is scoped separately from the shared header and footer. */
/* About reference: measurements scale from the 1486.4px-wide supplied layout. */
.about-page {
  background: #fff;
}

.about-page::before {
  display: none;
}

.about-main {
  zoom: 0.8;
  --about-unit: calc(80vw / 1858);
  --about-ink: #060e30;
  --about-accent: #00b5df;
  background: #fff;
  color: var(--about-ink);
  font-family: "Segoe UI", Arial, sans-serif;
  padding-bottom: calc(36 * var(--about-unit));
}

.about-eyebrow {
  display: flex;
  align-items: center;
  gap: calc(26 * var(--about-unit));
  margin: 0;
  color: #606b7d;
  font-size: calc(20 * var(--about-unit));
  line-height: 1.5;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}

.about-eyebrow::before {
  content: "";
  flex: 0 0 calc(54 * var(--about-unit));
  height: calc(3 * var(--about-unit));
  background: var(--about-accent);
}

/* Introduction and experience band: 737.6px reference. */
.about-intro, .about-experience { --intro-unit: calc(80vw / 922); }
.about-intro {
  margin: 0 calc(33 * var(--intro-unit)) calc(24 * var(--intro-unit));
  padding: calc(45 * var(--intro-unit)) calc(6 * var(--intro-unit)) calc(35 * var(--intro-unit));
  border-bottom: 0.8px solid #dce3eb;
}
.about-intro .about-eyebrow { gap: calc(16 * var(--intro-unit)); color: #101d40; font-size: calc(10 * var(--intro-unit)); letter-spacing: .23em; }
.about-intro .about-eyebrow::before { flex-basis: calc(31 * var(--intro-unit)); height: calc(2 * var(--intro-unit)); }
.about-intro-grid { display: grid; grid-template-columns: 54% minmax(0, 1fr); gap: calc(38 * var(--intro-unit)); margin-top: calc(22 * var(--intro-unit)); align-items: start; }
.about-intro h1 { margin: 0; font-size: calc(48 * var(--intro-unit)); font-weight: 600; line-height: 1.08; letter-spacing: -.05em; }
.about-intro h1 span { color: var(--about-accent); }
.about-intro-copy { margin: calc(2 * var(--intro-unit)) 0 0; color: #606980; font-size: calc(14 * var(--intro-unit)); line-height: 1.5; letter-spacing: -.015em; }
.about-experience { display: grid; grid-template-columns: 39.4% minmax(0, 1fr); padding: calc(34 * var(--intro-unit)) calc(46 * var(--intro-unit)); background: #eaf5f9; }
.about-experience-stat { border-right: 0.8px solid #c4dbe6; padding: 0 calc(32 * var(--intro-unit)) calc(8 * var(--intro-unit)) 0; }
.about-experience-number { margin: 0; font-size: calc(128 * var(--intro-unit)); font-weight: 400; line-height: .94; letter-spacing: -.055em; }
.about-experience-label { margin: calc(1 * var(--intro-unit)) 0 0 calc(7 * var(--intro-unit)); font-size: calc(12 * var(--intro-unit)); line-height: 1.5; font-weight: 600; letter-spacing: .21em; text-transform: uppercase; }
.about-experience-content { padding: calc(14 * var(--intro-unit)) 0 0 calc(62 * var(--intro-unit)); }
.about-experience h2 { margin: 0 0 calc(16 * var(--intro-unit)); font-size: calc(30 * var(--intro-unit)); line-height: 1.3; font-weight: 600; letter-spacing: -.045em; }
.about-experience-content p { margin: 0; color: #4d5d77; font-size: calc(16 * var(--intro-unit)); line-height: 1.5; }

/* Values reference is 1232px wide; preserve its spacing and column positions. */
.about-values {
  --values-unit: calc(80vw / 1540);
  padding: calc(48 * var(--values-unit)) calc(92 * var(--values-unit)) 0;
}

.about-values h2 {
  margin: calc(12 * var(--values-unit)) 0 calc(36 * var(--values-unit));
  font-size: calc(64 * var(--values-unit));
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -0.045em;
}

.about-values h2 span { color: var(--about-accent); }

.about-values-grid {
  display: grid;
  grid-template-columns: 436fr 502fr 418fr;
}

.about-value {
  min-width: 0;
  padding: calc(12 * var(--values-unit)) calc(60 * var(--values-unit)) calc(4 * var(--values-unit)) 0;
}

.about-value + .about-value {
  border-left: 1.6px solid #dce5ee;
  padding-left: calc(76 * var(--values-unit));
}

.about-value:last-child { padding-right: 0; }

.about-value h3 {
  margin: 0 0 calc(14 * var(--values-unit));
  font-size: calc(40.8 * var(--values-unit));
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: -0.04em;
}

.about-value p {
  margin: 0;
  color: #7e8b9e;
  font-size: calc(27.6 * var(--values-unit));
  line-height: 1.4;
  letter-spacing: -0.02em;
}

@media (max-width: 767px) {
  .about-values { padding: 35.2px 19.2px 0; }
  .about-values h2 { margin: 12.8px 0 22.4px; font-size: 30px; }
  .about-values-grid { grid-template-columns: 1fr; }
  .about-value { padding: 0 0 19.2px; }
  .about-value + .about-value { border-left: 0; border-top: 0.8px solid #dce5ee; padding: 19.2px 0; }
  .about-value:last-child { padding-bottom: 0; }
  .about-value h3 { margin-bottom: 8px; font-size: 24px; }
  .about-value p { font-size: 15.64px; line-height: 1.55; }
  .about-main { padding-bottom: 32px; }
  .about-eyebrow { gap: 12.8px; font-size: 8.8px; }
  .about-eyebrow::before { flex-basis: 25.6px; height: 1.6px; }
  .about-intro { margin: 0 19.2px 19.2px; padding: 28.8px 0 22.4px; }
  .about-intro .about-eyebrow { gap: 12.8px; font-size: 8px; }
  .about-intro .about-eyebrow::before { flex-basis: 24.8px; height: 1.6px; }
  .about-intro-grid { grid-template-columns: 1fr; gap: 19.2px; margin-top: 17.6px; }
  .about-intro h1 { font-size: clamp(27.2px, 5.04vw, 38.4px); }
  .about-intro-copy { margin: 0; font-size: 12.8px; }
  .about-experience { grid-template-columns: 1fr; padding: 24px 19.2px; }
  .about-experience-stat { border-right: 0; border-bottom: 0.8px solid #c4dbe6; padding: 0 0 19.2px; }
  .about-experience-number { font-size: 86.4px; }
  .about-experience-label { margin: 6.4px 0 0; font-size: 8.8px; }
  .about-experience-content { padding: 19.2px 0 0; }
  .about-experience h2 { margin-bottom: 12.8px; font-size: 22.4px; }
  .about-experience-content p { font-size: 12.8px; }
}
