/* About page. */
.about-page {
  --a: 1px;
  background: var(--paper);
}

.about-main {
  background: var(--paper);
}

.quote-mobile {
  display: none;
}

.about-intro {
  overflow: visible;
  background: var(--paper);
  padding:
    calc(94 * var(--a))
    var(--gutter)
    calc(302 * var(--a));
}

.about-intro-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, calc(804 * var(--a))));
  grid-template-areas:
    "heading visual"
    "copy visual";
  column-gap: calc(120 * var(--a));
  row-gap: calc(24 * var(--a));
  align-items: start;
  width: min(100%, calc(1728 * var(--a)));
  margin: 0 auto;
}

.about-heading {
  grid-area: heading;
  min-width: 0;
}

.about-kicker {
  color: #006688;
  font-size: calc(21 * var(--a));
  font-weight: 600;
  letter-spacing: calc(2.1 * var(--a));
  line-height: calc(25.2 * var(--a));
  text-transform: uppercase;
}

.about-heading h1 {
  max-width: calc(804 * var(--a));
  margin-top: calc(24 * var(--a));
  color: #002a4b;
  font-size: calc(72 * var(--a));
  line-height: calc(90 * var(--a));
}

.about-copy-text {
  grid-area: copy;
  min-width: 0;
  padding-top: calc(22.042 * var(--a));
}

.about-copy-text p {
  max-width: calc(804 * var(--a));
  color: #42474e;
  font-size: calc(24 * var(--a));
  line-height: calc(36 * var(--a));
}

.about-copy-text .about-lead {
  font-size: calc(27 * var(--a));
  line-height: calc(43.2 * var(--a));
}

.about-copy-text p + p {
  margin-top: calc(36 * var(--a));
}

.about-visual {
  grid-area: visual;
  position: relative;
  min-width: 0;
  height: calc(804 * var(--a));
  overflow: visible;
  border-radius: calc(36 * var(--a));
  background: #e5eeff;
  box-shadow: var(--shadow-visual);
}

.about-visual > img {
  width: 100%;
  height: 100%;
  border-radius: inherit;
  object-fit: cover;
  object-position: center 36%;
}

.about-visual blockquote {
  position: absolute;
  top: calc(702 * var(--a));
  left: calc(-60 * var(--a));
  z-index: 1;
  width: calc(480 * var(--a));
  border-radius: calc(24 * var(--a));
  background: #ffffff;
  box-shadow:
    0 calc(30 * var(--a)) calc(37.5 * var(--a)) calc(-7.5 * var(--a)) rgba(0, 0, 0, 0.1),
    0 calc(12 * var(--a)) calc(15 * var(--a)) calc(-9 * var(--a)) rgba(0, 0, 0, 0.1);
  color: #002a4b;
  padding:
    calc(48 * var(--a))
    calc(86 * var(--a))
    calc(48 * var(--a))
    calc(48 * var(--a));
  font-size: calc(24 * var(--a));
  font-style: italic;
  line-height: calc(36 * var(--a));
}

.about-stats-values {
  background: #e7efff;
  padding: calc(180 * var(--a)) var(--gutter);
}

.about-stats-inner {
  width: min(100%, calc(1728 * var(--a)));
  margin: 0 auto;
}

.about-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: calc(36 * var(--a));
  margin: 0;
}

.about-stats div {
  min-width: 0;
  border: calc(1.5 * var(--a)) solid rgba(255, 255, 255, 0.05);
  border-radius: calc(24 * var(--a));
  background: #ffffff;
  padding: calc(61.5 * var(--a));
  box-shadow: 0 0 calc(17 * var(--a)) rgba(111, 176, 215, 0.14);
  text-align: center;
}

.about-stats dt {
  color: #00c1fd;
  font-family: var(--font-heading);
  font-size: calc(96 * var(--a));
  font-weight: 700;
  letter-spacing: 0;
  line-height: calc(105.6 * var(--a));
  white-space: nowrap;
}

.about-stats dd {
  margin-top: calc(12 * var(--a));
  color: #154068;
  font-size: calc(24 * var(--a));
  font-weight: 400;
  letter-spacing: calc(2.4 * var(--a));
  line-height: calc(36 * var(--a));
  text-transform: uppercase;
  white-space: nowrap;
}

.about-values {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: calc(72 * var(--a));
  margin-top: calc(180 * var(--a));
  border-top: calc(1.5 * var(--a)) solid rgba(78, 148, 213, 0.6);
  padding-top: calc(181.5 * var(--a));
}

.about-values article {
  min-width: 0;
  border-radius: calc(24 * var(--a));
  background: #ffffff;
  padding:
    calc(36 * var(--a))
    calc(36 * var(--a))
    calc(98 * var(--a));
}

.about-values article:nth-child(3) {
  padding-bottom: calc(36 * var(--a));
}

.about-values img {
  width: 100%;
  height: calc(256.5 * var(--a));
  overflow: hidden;
  border-radius: calc(12 * var(--a));
  object-fit: cover;
}

.about-values h3 {
  margin-top: calc(36 * var(--a));
  color: #154068;
  font-size: calc(48 * var(--a));
  font-weight: 600;
  line-height: calc(62.4 * var(--a));
}

.about-values p {
  margin-top: calc(24 * var(--a));
  color: #154068;
  font-size: calc(24 * var(--a));
  line-height: calc(36 * var(--a));
}

@media (min-width: 1101px) and (max-width: 1919.98px) {
  .about-page {
    --a: var(--d);
  }
}

@media (max-width: 1100px) {
  .about-page {
    --a: var(--m);
  }

  .quote-pc {
    display: none;
  }

  .quote-mobile {
    display: inline;
  }

  .about-intro {
    height: auto;
    padding:
      calc(70.154 * var(--m))
      var(--gutter)
      calc(110.347 * var(--m));
  }

  .about-intro-grid {
    grid-template-columns: 1fr;
    grid-template-areas:
      "heading"
      "visual"
      "copy";
    row-gap: calc(61.538 * var(--m));
    width: min(100%, calc(673.077 * var(--m)));
  }

  .about-kicker {
    font-size: calc(30.769 * var(--m));
    font-weight: 400;
    letter-spacing: calc(3.077 * var(--m));
    line-height: calc(46.154 * var(--m));
  }

  .about-heading h1 {
    max-width: calc(696 * var(--m));
    margin-top: calc(30.769 * var(--m));
    font-size: calc(53.846 * var(--m));
    line-height: calc(67.308 * var(--m));
  }

  .about-copy-text {
    padding-top: 0;
  }

  .about-copy-text p,
  .about-copy-text .about-lead {
    max-width: none;
    font-size: calc(30.769 * var(--m));
    line-height: calc(50 * var(--m));
  }

  .about-copy-text p + p {
    margin-top: calc(50 * var(--m));
  }

  .about-visual {
    width: 100%;
    height: calc(504.808 * var(--m));
    border-radius: calc(36 * var(--m));
    box-shadow: var(--shadow-visual);
  }

  .about-visual > img {
    object-position: center 36%;
  }

  .about-visual blockquote {
    display: none;
  }

  .about-stats-values {
    background: linear-gradient(
      to bottom,
      #eff4ff 0,
      #eff4ff calc(866 * var(--m)),
      #f8f9ff calc(866 * var(--m)),
      #f8f9ff 100%
    );
    padding: calc(87 * var(--m)) var(--gutter) 0;
  }

  .about-stats-inner {
    width: min(100%, calc(673.077 * var(--m)));
  }

  .about-stats {
    display: flex;
    flex-direction: column;
    gap: 0;
    padding-top: calc(30.75 * var(--m));
  }

  .about-stats div {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: calc(15.385 * var(--m));
    border: 0;
    border-radius: 0;
    background: transparent;
    padding: 0;
    box-shadow: none;
  }

  .about-stats div:not(:last-child) {
    margin-bottom: calc(92.308 * var(--m));
    border-bottom: calc(1.923 * var(--m)) solid rgba(48, 152, 184, 0.18);
    padding-bottom: calc(92.308 * var(--m));
  }

  .about-stats dt {
    font-size: calc(74 * var(--m));
    line-height: calc(46.154 * var(--m));
  }

  .about-stats dd {
    margin-top: 0;
    color: rgba(66, 71, 78, 0.6);
    font-size: calc(30.769 * var(--m));
    letter-spacing: calc(3.077 * var(--m));
    line-height: calc(46.154 * var(--m));
  }

  .about-values {
    display: flex;
    flex-direction: column;
    gap: calc(46.154 * var(--m));
    margin-top: calc(85.019 * var(--m));
    border-top: 0;
    padding-top: 0;
  }

  .about-values article,
  .about-values article:nth-child(3) {
    border-radius: calc(24 * var(--m));
    padding:
      calc(36 * var(--m))
      calc(36 * var(--m))
      calc(98 * var(--m));
  }

  .about-values article:nth-child(3) {
    padding-bottom: calc(98 * var(--m));
  }

  .about-values img {
    height: calc(256.5 * var(--m));
    border-radius: calc(12 * var(--m));
  }

  .about-values h3 {
    margin-top: calc(36 * var(--m));
    font-size: calc(48 * var(--m));
    line-height: calc(62.4 * var(--m));
  }

  .about-values p {
    margin-top: calc(24 * var(--m));
    font-size: calc(24 * var(--m));
    line-height: calc(36 * var(--m));
  }
}

@media (max-width: 767.98px) {
  .about-copy-text p,
  .about-copy-text .about-lead,
  .about-values h3,
  .about-values p {
    overflow-wrap: break-word;
  }
}