/* ===== JIACHENG — Development History / timeline (theme-matched) ===== */
.ly_history_dev{
  --h-blue:#05479A;
  --h-blue-hi:#095AC2;
  --h-ink:#1f2328;
  --h-body:#333333;
  --h-line:#E5E9EF;
  --h-ease:cubic-bezier(.22,.61,.36,1);
  padding-top:30px;
  padding-bottom:30px;
  background:#FFFFFF;
}
.ly_history_dev *{box-sizing:border-box;}
.ly_history_dev .wide{width:1440px;margin:0 auto;padding:0;}
.ly_history_dev .wide .section{box-sizing:border-box;margin:0 auto;}

/* ---------- head ---------- */
.his_head{text-align:center;}
.his_title{color:#1f2328;font-size:42px;line-height:1.1;font-family:Oswald-Regular,Oswald,Arial,sans-serif;}
.his_title h2{margin:0;font:inherit;font-weight:400;color:inherit;}
.his_subtitle{
  color:#333333;font-family:Opensans-Regular,Open Sans,Arial,sans-serif;
  font-size:16px;line-height:1.8;margin-top:20px;
  max-width:820px;margin-left:auto;margin-right:auto;
}

/* ---------- axis ---------- */
.his_list{
  list-style:none;margin:70px 0 0;padding:10px 0 0;position:relative;
}
.his_list::before{
  content:"";position:absolute;left:50%;top:0;bottom:0;width:1px;
  transform:translateX(-50%);
  background:linear-gradient(180deg,rgba(229,233,239,0) 0%,var(--h-line) 6%,var(--h-line) 94%,rgba(229,233,239,0) 100%);
}

.his_item{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) 150px minmax(0,1fr);
  align-items:start;
  padding-bottom:46px;
}
.his_item:last-child{padding-bottom:6px;}
.his_rail{grid-area:1 / 2;display:flex;justify-content:center;}
.his_item:nth-child(odd) .his_card{grid-area:1 / 1;text-align:right;}
.his_item:nth-child(even) .his_card{grid-area:1 / 3;text-align:left;}

/* connector: draws outward from the axis toward the card on hover */
.his_item::before{
  content:"";position:absolute;top:19px;height:1px;width:32px;
  background:var(--h-line);
  transition:background-color .35s ease,transform .45s var(--h-ease);
}
.his_item:nth-child(odd)::before{right:calc(50% + 43px);transform-origin:right center;}
.his_item:nth-child(even)::before{left:calc(50% + 43px);transform-origin:left center;}

/* ---------- year pill ---------- */
.his_year{
  display:flex;align-items:center;justify-content:center;
  width:86px;height:38px;border-radius:999px;
  background:#FFFFFF;border:1px solid var(--h-line);
  font-family:Oswald-Regular,Oswald,Arial,sans-serif;
  font-size:18px;line-height:1;letter-spacing:.02em;
  color:var(--h-blue);
  transition:background-color .35s ease,border-color .35s ease,color .35s ease,
             box-shadow .35s ease,transform .45s var(--h-ease);
}
.his_item.is-current .his_year{
  background:var(--h-blue);border-color:var(--h-blue);color:#FFFFFF;
  box-shadow:0 0 0 6px rgba(5,71,154,.10);
}

/* ---------- card ---------- */
.his_card{
  position:relative;
  padding-top:8px;
  transition:transform .45s var(--h-ease);
}
.his_item:nth-child(odd):hover .his_card{transform:translateX(6px);}
.his_item:nth-child(even):hover .his_card{transform:translateX(-6px);}

/* blue edge that grows on hover, on the side facing the axis */
.his_card::after{
  content:"";position:absolute;top:0;bottom:0;width:2px;border-radius:2px;
  background:var(--h-blue);
  transform:scaleY(0);transform-origin:bottom center;
  transition:transform .45s var(--h-ease);
}
.his_item:nth-child(odd) .his_card::after{right:0;}
.his_item:nth-child(even) .his_card::after{left:0;}

.his_item:hover::before{background:var(--h-blue);}

.his_label{
  margin:0 0 10px;font-weight:700;
  font-family:Opensans-Bold,Opensans-Regular,"Open Sans",Arial,sans-serif;
  font-size:16px;line-height:1.5;color:var(--h-ink);
  transition:color .3s ease;
}
.his_text{
  color:var(--h-body);font-family:Opensans-Regular,Open Sans,Arial,sans-serif;
  font-size:14px;line-height:1.875;
}

/* card hover: tint + edge bar + label colour */
.his_item:nth-child(odd):hover .his_card{background:linear-gradient(90deg,rgba(5,71,154,0) 40%,rgba(5,71,154,.045) 100%);}
.his_item:nth-child(even):hover .his_card{background:linear-gradient(90deg,rgba(5,71,154,.045) 0%,rgba(5,71,154,0) 60%);}
.his_item:nth-child(odd) .his_card{padding-right:20px;}
.his_item:nth-child(even) .his_card{padding-left:20px;}

.his_item:hover .his_card::after{transform:scaleY(1);}
.his_item:hover .his_label{color:var(--h-blue);}

/* year reacts when hovering anywhere in the row */
.his_item:hover .his_year{
  background:var(--h-blue);border-color:var(--h-blue);color:#FFFFFF;
  box-shadow:0 0 0 6px rgba(5,71,154,.10);
  transform:scale(1.04);
}

/* the is-current row keeps its filled pill */
.his_item.is-current:hover .his_year{background:var(--h-blue-hi);border-color:var(--h-blue-hi);}

/* ---------- responsive (same breakpoints as the theme) ---------- */
@media screen and (max-width:1480px){
  .ly_history_dev .wide{width:96%;box-sizing:border-box;}
}
@media screen and (max-width:1000px){
  .ly_history_dev{padding-top:40px;padding-bottom:50px;}
  .ly_history_dev .wide{width:98%;}
  .ly_history_dev .wide .section{padding-left:3%;padding-right:3%;}

  .his_title{font-size:28px;}
  .his_subtitle{font-size:14px;line-height:1.8;}
  .his_list{margin-top:34px;padding-top:0;}
  .his_list::before{display:none;}

  .his_item{
    display:block;padding:0 0 26px;margin-bottom:26px;
    border-bottom:1px solid #EEF1F5;
  }
  .his_item:last-child{border-bottom:0;margin-bottom:0;padding-bottom:0;}
  .his_item::before{display:none;}

  .his_rail{display:block;}
  .his_year{
    width:auto;height:auto;min-width:0;padding:5px 14px;
    display:inline-flex;font-size:15px;margin-bottom:14px;
  }
  .his_item.is-current .his_year{box-shadow:none;}

  .his_item:nth-child(odd) .his_card,
  .his_item:nth-child(even) .his_card{text-align:left;padding:0;}
  .his_item:nth-child(odd):hover .his_card,
  .his_item:nth-child(even):hover .his_card{transform:none;}
  .his_card::after{display:none;}
  .his_item:nth-child(odd):hover .his_card, .his_item:nth-child(even):hover .his_card{background:transparent;}
  .his_item:hover .his_year{transform:none;box-shadow:none;}
  .his_label{font-size:15px;}
  .his_text{font-size:14px;line-height:1.8;}
}
@media (prefers-reduced-motion:reduce){
  .his_item::before,.his_year,.his_card,.his_card::after,.his_label{transition:none !important;}
  .his_item:hover .his_card{transform:none !important;}
}