/* 方案5: 边框下划线 */
.nav-link-5 {
    position: relative;
    color: #64748b;
    text-decoration: none;
    transition: color 0.3s ease;
}

.nav-link-5::after {
    content: '';
    position: absolute;
    width: 100%;
    height: 0;
    bottom: -2px;
    left: 0;
    border-bottom: 2px solid #993333;
    transition: all 0.3s ease;
    opacity: 1;
}

.nav-link-1 {
    position: relative;
    color: #64748b;
    text-decoration: none;
    transition: color 0.3s ease;
}

.nav-link-1:hover {
    color: #4ADE80;
}

.nav-link-1::after {
    content: '';
    position: absolute;
    width: 100%;
    height: 0;
    bottom: -2px;
    left: 0;
    border-bottom: 2px solid #4ADE80;
    transition: all 0.3s ease;
    opacity: 0;
}
.nav-link-1:hover i.bi {
    color: #4ADE80;
}
.nav-link-1:hover::after,
.nav-link-1.active::after {
    height: 2px;
    opacity: 1;
}

.nav-link-2 {
    position: relative;
    color: #64748b;
    text-decoration: none;
    transition: color 0.3s ease;
}

.nav-link-2:hover {
    color: #818CF8;
}

.nav-link-2::after {
    content: '';
    position: absolute;
    width: 100%;
    height: 0;
    bottom: -2px;
    left: 0;
    border-bottom: 2px solid #818CF8;
    transition: all 0.3s ease;
    opacity: 0;
}
.nav-link-2:hover i.bi {
    color: #818CF8;
}
.nav-link-2:hover::after,
.nav-link-2.active::after {
    height: 2px;
    opacity: 1;
}
.nav-link-3 {
    position: relative;
    color: #64748b;
    text-decoration: none;
    transition: color 0.3s ease;
}

.nav-link-3:hover {
    color: #FBBF24;
}

.nav-link-3::after {
    content: '';
    position: absolute;
    width: 100%;
    height: 0;
    bottom: -2px;
    left: 0;
    border-bottom: 2px solid #FBBF24;
    transition: all 0.3s ease;
    opacity: 0;
}
.nav-link-3:hover i.bi {
    color: #FBBF24;
}
.nav-link-3:hover::after,
.nav-link-3.active::after {
    height: 2px;
    opacity: 1;
}

.nav-link-6 {
    position: relative;
    color: #64748b;
    text-decoration: none;
    transition: color 0.3s ease;
}
.nav-link-6:hover {
    color: #22D3EE;
}

.nav-link-6::after {
    content: '';
    position: absolute;
    width: 100%;
    height: 0;
    bottom: -2px;
    left: 0;
    border-bottom: 2px solid #22D3EE;
    transition: all 0.3s ease;
    opacity: 0;
}
.nav-link-6:hover i.bi {
    color: #22D3EE;
}
.nav-link-6:hover::after,
.nav-link-6.active::after {
    height: 2px;
    opacity: 1;
}

.nav-link-7 {
    position: relative;
    color: #64748b;
    text-decoration: none;
    transition: color 0.3s ease;
}
.nav-link-7:hover {
    color: #0066cc;
}

.nav-link-7::after {
    content: '';
    position: absolute;
    width: 100%;
    height: 0;
    bottom: -2px;
    left: 0;
    border-bottom: 2px solid #0066cc;
    transition: all 0.3s ease;
    opacity: 0;
}
.nav-link-7:hover i.bi {
    color: #0066cc;
}
.nav-link-7:hover::after,
.nav-link-7.active::after {
    height: 2px;
    opacity: 1;
}



.br2:hover{
    --bs-border-opacity: 1;
    border-color: #818CF8 !important
}
.br1:hover{
    --bs-border-opacity: 1;
    border-color: #0b5ed7 !important
}
.br3:hover{
    --bs-border-opacity: 1;
    border-color: #4ADE80 !important
}
.br4:hover{
    --bs-border-opacity: 1;
    border-color: #FBBF24 !important
}

.btning:hover{
    background-color: #FBBF24!important;
    color: white!important;
}
.btninga:hover{
    background-color: #4ADE80!important;
    color: white!important;
}


.zhibaaa{
    color: #fff;background: #0f172a;
}
.zhibb{
    text-align: center; margin-bottom: 60px;
}
.zhibc{
    color: #38bdf8; font-weight: bold; letter-spacing: 2px;
}
.zhibd{
    font-size: 36px; margin: 10px 0;
}
.zhibe{
    font-size: 18px; color: #94a3b8;
}
.zhibf{
    background: #1e293b; border: 1px solid #334155; border-radius: 8px; padding: 25px;
}
.zhibg{
    display: flex; justify-content: space-between; margin-bottom: 20px;
}
.zhibh{
    background: #0ea5e9; color: #fff; padding: 2px 8px; border-radius: 4px; font-size: 12px;
}
.zhibha{
    background: #722ED1; color: #fff; padding: 2px 8px; border-radius: 4px; font-size: 12px;
}
.zhibhb{
    background: #FA8C16; color: #fff; padding: 2px 8px; border-radius: 4px; font-size: 12px;
}
.zhibhc{
    background: #52C41A; color: #fff; padding: 2px 8px; border-radius: 4px; font-size: 12px;
}


.zhibi{
    color: #94a3b8; font-size: 12px;
}
.zhibj{
    margin: 0 0 10px 0; font-size: 20px;color: white;
}
.zhibk{
    color: #F8F8FF; font-size: 14px; line-height: 1.5; margin-bottom: 20px;
}
.zhibl{
    border-top: 1px solid #334155; padding-top: 15px; display: flex; gap: 10px;
}
.zhibm{
    background: #334155; font-size: 12px; padding: 4px 8px; border-radius: 4px;color: white;
}
.zhibn{
    width: 100%; margin-top: 20px; background: transparent; border: 1px solid #38bdf8; color: #38bdf8; padding: 10px; border-radius: 6px; cursor: pointer;
}
.zhibo{

}
.yuyuyih{
    color: #0A192F!important;
}
.yuyuyiid{
    color: #DC2626
}
.yuyjklopd{
    padding-top: 100px;
}