/* Reduce visual noise in the about story and make the reading path explicit. */
.about-v16-intro-story {
  grid-template-columns: minmax(280px, .72fr) minmax(520px, 1.28fr);
  gap: clamp(58px, 9vw, 142px);
  margin-top: 70px;
  padding-top: 32px;
}

.about-v16-intro-lead {
  max-width: 300px;
  color: #285674;
  font-size: 19px;
  line-height: 1.75;
}

.about-v16-intro-story > div { max-width: 650px; }
.about-v16-intro-story > div p { font-size: 15px; line-height: 1.9; }
.about-v16-intro-story > div p + p { margin-top: 12px; color: #7890a5; }

.about-v16-intro-method {
  position: relative;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  margin-top: 58px;
  padding: 25px 0 0 calc(min(280px, 23.7%) + clamp(58px, 9vw, 142px));
  border-top: 1px solid #c8d9e6;
}

.about-v16-intro-method::before {
  position: absolute;
  top: -2px;
  left: calc(min(280px, 23.7%) + clamp(58px, 9vw, 142px));
  width: 64px;
  height: 3px;
  content: "";
  background: #1677e8;
}

.about-v16-intro-method > div {
  min-height: 69px;
  padding: 0 22px;
  border: 0;
  border-left: 1px solid #c8d9e6;
}

.about-v16-intro-method > div:first-child { padding-left: 0; border-left: 0; }
.about-v16-intro-method > div:nth-child(2), .about-v16-intro-method > div:nth-child(3) { border-color: #c8d9e6; }
.about-v16-intro-method strong { color: #285674; font-size: 16px; }
.about-v16-intro-method span { margin-top: 7px; color: #7890a5; font-size: 12px; }

@media (max-width: 900px) {
  .about-v16-intro-story { grid-template-columns: minmax(210px, .65fr) minmax(350px, 1.35fr); gap: 42px; margin-top: 56px; }
  .about-v16-intro-method { margin-top: 48px; padding-left: calc(32% + 42px); }
  .about-v16-intro-method::before { left: calc(32% + 42px); }
  .about-v16-intro-method > div { padding: 0 14px; }
}

@media (max-width: 620px) {
  .about-v16-intro-story { grid-template-columns: 1fr; gap: 22px; margin-top: 44px; padding-top: 25px; }
  .about-v16-intro-lead { font-size: 17px; }
  .about-v16-intro-story > div p { font-size: 14px; line-height: 1.85; }
  .about-v16-intro-method { grid-template-columns: 1fr; gap: 0; margin-top: 39px; padding: 0 0 0 16px; border-top: 0; border-left: 1px solid #c8d9e6; }
  .about-v16-intro-method::before { top: 0; bottom: auto; left: -2px; width: 3px; height: 46px; }
  .about-v16-intro-method > div, .about-v16-intro-method > div:first-child { min-height: 0; padding: 17px 0 17px 19px; border: 0; border-bottom: 1px solid #d4e1eb; }
  .about-v16-intro-method > div:last-child { border-bottom: 0; }
}
