.btn {
  font-family:var(--ff-body);
}

/* CTA 按钮样式 */
.section-title.has-cta .btn{
  /* 固定尺寸 */
  width: 130px;
  height: 40px;

  /* 与库里统一的外观尺寸 */
  border-radius: 5px;         /* 同 custom-btn */
  padding: 0 25px;            /* 左右 25px，垂直用高度居中 */

  /* 保持我们原来的布局与切换动画 */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.2rem;
  font-weight: 700;
  white-space: nowrap;
  line-height: 1;
  position: relative;
  overflow: hidden;
  color: #fff;
  text-decoration: none;
  background: #b621fe;
  cursor:pointer;
  border:1px solid rgba(255,255,255,.55);   /* ← 细白边 */
  box-shadow:inset 2px 2px 2px 0px rgba(255,255,255,.5),
   7px 7px 20px 0px rgba(0,0,0,.1),
   4px 4px 5px 0px rgba(0,0,0,.1);
  outline: none;
  z-index: 0;
}
.section-title.has-cta .btn::after{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:0%;
  height:100%;
  background:#663dff;
  z-index:-1;
  border-radius: 5px;
  box-shadow:inset 2px 2px 2px 0px rgba(255,255,255,.5),
   7px 7px 20px 0px rgba(0,0,0,.1),
   4px 4px 5px 0px rgba(0,0,0,.1);
  transition: width .3s ease;
}
.section-title.has-cta .btn:hover::after{ width:100%; }

/* Explore / 箭头切换 */
.section-title.has-cta .btn .text,
.section-title.has-cta .btn .arrows{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  transition: transform .4s ease, opacity .4s ease;
}
.section-title.has-cta .btn .text{ opacity:1; transform:translateX(0%); }
.section-title.has-cta .btn .arrows{ opacity:0; transform:translateX(-120%); color:#fff; }
.section-title.has-cta .btn:hover .text{ opacity:0; transform:translateX(120%); }
.section-title.has-cta .btn:hover .arrows{ opacity:1; transform:translateX(0%); }

/* 标题行整体布局 */
.section-title.has-cta{
  display:flex;
  align-items:center;
  justify-content:space-between;  /* 左文字，右按钮 */
  gap:12px;
  position:relative;
  margin: 2rem 0 .75rem;
}
.section-title.has-cta::after{
  content:"";
  position:absolute;
  left:0; right:0; bottom:-6px;
  height:4px;
  background: linear-gradient(90deg, var(--brand-purple,#7c3aed), #a78bfa);
  border-radius:3px;
}

/* 标题文字块：居中 + 限宽 */
.section-title.has-cta > span{
  flex:1 1 auto;
  margin:0;
  text-align:left;
  word-break:break-word;
}

/* 小屏适配 */
@media (max-width: 640px){
  .section-title.has-cta > span{
    max-width:min(90vw, 520px);
  }
}