.history-timeline-section {
    background-color: rgb(var(--color-background));
  }

  .history-timeline-container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }

  .history-timeline {
    padding: 0px 0 30px;
    width: 100%;
  }

  .history-timeline__inner {
    display: flex;
    flex-direction: column;
    gap: 0px;
  }

  /* 顶部布局：左文案右图片 */
  .history-timeline__top {
    background-color: rgb(var(--color-background));
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 1.2fr);
    gap: 0px;
    align-items: center;
    border-radius: 10px;
    overflow: hidden;
  }

  .history-timeline__content {
    width: 100%;
    height: 100%;
    padding: 50px;
  }

  .history-timeline__subtitle {
    margin: 0 0 8px;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    opacity: 0.7;
  }

  .history-timeline__title {
    margin: 0 0 14px;
  }

  .history-timeline__desc {
    margin: 0 0 36px;
    max-width: 862px;
  }

  .history-timeline__content-item {
    display: none;
  }

  .history-timeline__content-item.is-active {
    display: block;
  }

  .history-timeline__item-title {
    margin-bottom: 130px;
  }

  .history-timeline__item-text-title {
    margin-bottom: 14px;
  }

  .history-timeline__item-text {
    
  }

  .history-timeline__image {
    position: relative;
    min-height: 260px;
    aspect-ratio: 640 / 426;
    border-radius: 10px 0 0 10px;
    overflow: hidden;
  }

  .history-timeline__image-item {
    position: absolute;
    inset: 0;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.35s ease, visibility 0.35s ease;
  }

  .history-timeline__image-item.is-active {
    opacity: 1;
    visibility: visible;
  }

  .history-timeline__img-el {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 18px;
  }

  /* 底部波浪时间轴区域 */
  .history-timeline__bottom {
    margin-top: 10px;
    padding-inline: 10px;
  }

  .history-timeline__track-wrap {
    position: relative;
    padding: 40px 0 30px;
  }

  .history-timeline__wave {
    width: 100%;
    height: 120px;
    display: block;
  }

  .history-timeline__wave path {
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-dasharray: 6 6; /* 虚线效果 */
    opacity: 0.6;
  }

  /* 小车在波浪上方 */
  .history-timeline__car {
    position: absolute;
    left: 0;
    top: 0;
    /* 让变换的旋转/缩放围绕车轮附近 */
    transform-origin: 50% 85%;
    pointer-events: none;
    z-index: 5;
  }
  

  .history-timeline__car-icon,
  .history-timeline__car-icon svg {
    width: 40px;
    height: auto;
  }

  /* 年份按钮容器，JS 负责给每个按钮设置 left 位置 */
  .history-timeline__years {
    position: absolute;
    left: 0;
    top: 30px; /* 整体在波浪下方一点点，根据实际效果可以微调 */
    width: 100%;
    height: 60px;
    pointer-events: none; /* 容器不接收事件，按钮接收 */
    z-index: 3;
  }

  .history-timeline__year {
    position: absolute;
    top: 0px; /* 让文字在圆点下面一点 */
    transform: translateX(-50%);
    background: none;
    border: none;
    padding: 25px 0 0;
    cursor: pointer;
    color: inherit;
    text-align: center;
    pointer-events: auto;
    white-space: nowrap;
  }

  /* 圆点在波峰（JS 布局时会保证按钮 center 对应 crest） 
  .history-timeline__year::before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, 0);
    width: 10px;
    height: 10px;
    border-radius: 999px;
    background: currentColor;
    opacity: 0.45;
    transition: transform 0.2s ease, opacity 0.2s ease;
  }
  */

  .history-timeline__year.is-active::before {
    transform: translate(-50%, 0) scale(1.3);
    opacity: 1;
  }

  .history-timeline__year-label {
    display: inline-block;
  }

  .history-timeline__year .history-timeline__year-label {
    margin-top: 4px;
  }

  
  .history-timeline__year.is-active .history-timeline__year-point svg rect {
    fill: #5A6204;
  }

  .history-timeline__year.is-active .history-timeline__year-point svg circle {
    fill: #E9FF00;
  }

  @media screen and (max-width: 959px) {
    .history-timeline__title {
      margin: 0 0 1.87vw;
    }

    .history-timeline__desc {
      margin: 0 0 5.33vw;
    }

    .history-timeline__image {
      border-radius: 10px 10px 0 0;
    }

    .history-timeline__top {
      grid-template-columns: minmax(0, 1fr);
      gap: 0px;
    }

    .history-timeline__content {
      padding: 5.33vw 5.33vw 8.27vw 5.33vw;
    }  

    .history-timeline__item-title {
      margin-bottom: 8vw;
    }

    .history-timeline__inner {
      gap: 1vw;
    }

    .history-timeline__bottom {
      margin-top: 0px;
    }

    .history-timeline__wave {
      height: 80px;
    }

    .history-timeline__car-icon,
    .history-timeline__car-icon svg {
      width: 32px;
    }

    .history-timeline__years {
      top: 38px;
      height: 70px;
    }

    .history-timeline__year {
      padding: 12px 0 0;
    }
  }