#achievement {
  --achievement-blue-width: calc(50% + 558 * var(--lp-unit));
  /* Cover the artwork's fixed stripe; the lead below owns its background. */
  background-image: linear-gradient(135deg, #4fafde, #0084fd), url(../img/achieve_bg.jpg);
  background-size: var(--achievement-blue-width) 100%, calc(2000 * var(--lp-unit)) auto;
  background-position: left top, center top;
  background-repeat: no-repeat;
}

#achievement .lead {
  height: auto;
  margin: calc(32 * var(--lp-unit)) 0;
  padding: 12px 24px;
  background: linear-gradient(to right, #1b73df var(--achievement-blue-width), transparent var(--achievement-blue-width));
  line-height: 1.7;
}

@media (width < 768px) {
  #achievement {
    --achievement-blue-width: 96%;
    background-image: linear-gradient(135deg, #4fafde, #0084fd), url(../img/achieve_bg_sp.jpg);
    background-size: var(--achievement-blue-width) 100%, 100% auto;
  }

  #achievement .lead {
    margin-block: 24px;
    padding: 16px calc(4% + 12px) 16px 12px;
    font-size: clamp(12px, 3.6vw, 22px);
    letter-spacing: .06em;
  }
}

#achievement .num .achievement_stat {
  position: relative;
  container-type: inline-size;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  aspect-ratio: 500 / 160;
  padding: 0;
  background: url(../img/achievement-laurel.webp) no-repeat center / 100% 100%;
  color: #fcee86;
  font-weight: 700;
}

#achievement .achievement_stat_line {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: .7cqi;
  width: 78%;
  margin: 0;
  line-height: 1;
  letter-spacing: 0;
  white-space: nowrap;
}

#achievement .achievement_stat_period {
  align-self: center;
  writing-mode: vertical-rl;
  text-orientation: upright;
  font-size: 6.4cqw;
  line-height: 1;
  letter-spacing: .06em;
}

#achievement .achievement_stat_value {
  font-size: 18cqi;
  font-weight: 800;
  font-variant-numeric: lining-nums tabular-nums;
  line-height: 1;
  letter-spacing: -.05em;
}

#achievement .achievement_stat_unit {
  font-size: 7.5cqi;
  line-height: 1;
  letter-spacing: 0;
}

#achievement .achievement_stat_magnitude {
  font-size: 11cqi;
  line-height: 1;
}

#achievement .achievement_stat_caption {
  margin: 3.5cqi 0 0;
  font-size: 7.5cqi;
  line-height: 1.2;
  letter-spacing: .02em;
}

#achievement .achievement_stat[data-period="annual"] .achievement_stat_unit {
  font-size: 7cqi;
}