.geo-explore-btn {
    position: relative;
    display: flex;
    align-items: center;
    gap: 32px;
    font-size: 16px;
    font-weight: 500;
    text-decoration: none;
    transition: all 0.2s ease;
    cursor: pointer;
    border: 1px solid rgba(51, 51, 51, 1);
    border-radius: 40px;
    padding: 9px;
    padding-left: 30px;
    z-index: 2;
}

.geo-explore-btn::before {
    content: '';
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    /* 横向蓝色渐变，和你图片完全一致 */
    background: linear-gradient(-135deg, rgba(15, 184, 246, 1) 0%, rgba(0, 80, 245, 1) 100%) !important;
    border-radius: inherit;
    z-index: -1;
    opacity: 0;
    /* 常驻显示，不是hover才出 */
    transition: none;
}
/* 内部白色填充，形成空心边框 */
.geo-explore-btn::after {
  content: '';
  position: absolute;
  top: 1px;
  left: 1px;
  right: 1px;
  bottom: 1px;
  background: #fff;
  border-radius: inherit;
  z-index: -1;
}
.swiper-button-prev-tech,
.swiper-button-next-tech {
    width: 48px;
    height: 48px;
    border: none;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    /* 箭头样式基础（根据实际箭头标签调整，这里假设是span/::after） */
    color: #ffffff;
    /* 箭头白色 */
    font-size: 16px;
    /* 箭头大小 */
    font-weight: bold;
    /* 清除默认swiper按钮样式（如果用swiper插件） */
    background-image: none !important;
    outline: none;
    background: #18181B;
    pointer-events: auto;
    user-select: none;
    /* 标准属性 */
    -webkit-user-select: none;
    /* Safari 和 Chrome */
    -moz-user-select: none;
    /* Firefox */
    -ms-user-select: none;
}
.geo-explore-btn:hover{
    border-color: rgb(255, 255, 255,0.1);
}
.geo-explore-btn:hover::before {
    opacity: 1;
}
 .geo-explore-btn:hover .swiper-button-prev-tech {
    background: linear-gradient(135deg, rgba(15, 184, 246, 1) 0%, rgba(0, 80, 245, 1) 100%) !important;
}

.geo-explore-btn .swiper-button-prev-tech {
    width: 42px;
    height: 42px;
}

@media (max-width: 768px) {

    .swiper-button-prev-tech,
    .swiper-button-next-tech {
        width: 40px;
        height: 40px;
    }
}

@media (max-width: 480px) {

    .swiper-button-prev-tech,
    .swiper-button-next-tech {
        width: 36px;
        height: 36px;
    }
}

/* 左侧上一页按钮 - 蓝青渐变 */
.swiper-button-tech-active {
    background: linear-gradient(135deg, rgba(15, 184, 246, 1) 0%, rgba(0, 80, 245, 1) 100%) !important;
    /* 左浅蓝右深蓝渐变，匹配图片 */
}

.swiper-button-prev-tech:hover,
.swiper-button-next-tech:hover {
    transform: scale(1.1);
    box-shadow: 0 4px 12px rgba(37, 99, 235, 0.4);
}

.swiper-button-prev-tech:active,
.swiper-button-next-tech:active {
    transform: scale(0.95);
}

.swiper-button-prev-tech svg,
.swiper-button-next-tech svg {
    width: 24px;
    height: 24px;
}

@media (max-width: 480px) {

    .swiper-button-prev-tech svg,
    .swiper-button-next-tech svg {
        width: 18px;
        height: 18px;
    }
}
@media (max-width: 768px) {
    .geo-explore-btn {
        /* 缩小字体，适配小屏 */
        font-size: 14px;
        /* 减小内边距，避免按钮过宽 */
        
        /* padding-left: 24px; */
        /* 减小内部元素间距 */
        gap: 20px;
        /* 按钮宽度撑满容器（可选，根据布局调整） */
        /* width: 25%; */
        /* 居中对齐文字（可选） */
        justify-content: center;
    }
}

/* 小屏手机（480px及以下） */
@media (max-width: 480px) {
    .geo-explore-btn {
        /* width: 36%; */
        /* 进一步缩小字体 */
        font-size: 12px;
        /* 更小的内边距 */
        padding: 7px;
        padding-left: 20px;
        /* 最小化内部间距 */
        gap: 16px;
        /* 圆角适度减小，更适配小屏视觉 */
        border-radius: 30px;
    }

    /* 同步调整伪元素的内边距，保证空心边框效果一致 */
    .geo-explore-btn::after {
        top: 1px;
        left: 1px;
        right: 1px;
        bottom: 1px;
    }
}