/* 文章内容图片居中 */
.prose img {
    margin-left: auto;
    margin-right: auto;
    display: block;
}

/* 导航栏新设计 */
.glass-nav {
    /* 检察蓝标准色 */
    background: #0056b3;
    /* 微妙的渐变增加质感 */
    background: linear-gradient(180deg, #0056b3 0%, #004494 100%);
    box-shadow: 0 4px 20px rgba(0, 50, 100, 0.2);
    border-top: 1px solid rgba(255, 255, 255, 0.15);
    border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}

.nav-item {
    position: relative;
    transition: all 0.3s ease;
}

/* 导航项间隔线 */
.nav-item:not(:last-child)::after {
    content: '';
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 24px;
    background: linear-gradient(to bottom, rgba(255,255,255,0), rgba(255,255,255,0.4) 50%, rgba(255,255,255,0));
    pointer-events: none;
}

/* 导航项悬停背景 */
.nav-item:hover {
    background: linear-gradient(180deg, rgba(255,255,255,0.1) 0%, rgba(255,255,255,0.05) 100%);
}

/* 导航链接文字 */
.nav-link-glow {
    position: relative;
    text-shadow: 0 1px 2px rgba(0,0,0,0.5);
    transition: color 0.3s ease;
}
.nav-item:hover .nav-link-glow {
    color: #fff;
    text-shadow: 0 0 8px rgba(255,255,255,0.6);
}

/* 底部光效条 */
.nav-item::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background: #fbbf24;
    transform: scaleX(0);
    transform-origin: center;
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 -2px 8px rgba(251, 191, 36, 0.6);
    z-index: 20;
}

.nav-item:hover::before,
.nav-item.active::before {
    transform: scaleX(1);
}

/* 下拉菜单美化 */
.nav-item ul {
    border: none !important;
    border-top: 3px solid #1c528a !important;
    background: rgba(255, 255, 255, 0.98);
    box-shadow: 0 10px 25px rgba(0,0,0,0.15);
    border-radius: 0 0 8px 8px;
    padding-top: 8px;
    padding-bottom: 8px;
}
.nav-item ul li a {
    border-left: 4px solid transparent;
}
.nav-item ul li a:hover {
    border-left-color: #1c528a;
    background-color: rgba(28, 82, 138, 0.05);
    color: #1c528a;
    padding-left: 1.5rem; /* pl-6 equivalent */
}

/* Banner 顶部阴影 */
.banner-overlay-gradient {
    background: linear-gradient(to bottom, rgba(0,0,0,0.3), transparent);
}

/* 文字描边效果 */
.text-stroke-white {
    text-shadow: 0 2px 4px rgba(255, 255, 255, 0.8);
}
.text-stroke-strong {
    text-shadow: 0 1px 3px rgba(255, 255, 255, 0.9), 0 0 10px rgba(255,255,255,0.5);
}

/* 快捷导航 - 3D连接杆特效 (保留核心CSS) */
.nav-item-rod {
    position: relative;
    z-index: 5;
}
/* 仅在桌面端显示连接杆 */
@media (min-width: 993px) {
    .nav-item-rod::after {
        content: '';
        position: absolute;
        left: 18px; top: 50%;
        transform: translate(-50%, -50%);
        width: 11px; height: 11px;
        background: radial-gradient(circle at 50% 50%, #666 0%, #444 60%, #333 100%);
        border: 2px solid #fff;
        border-radius: 50%;
        box-shadow: 0 1px 4px rgba(0,0,0,0.3), inset 0 1px 2px rgba(255,255,255,0.2);
        z-index: 9;
        pointer-events: none;
    }
    .nav-item-rod:nth-child(odd)::before {
        content: '';
        position: absolute;
        left: 14px; top: calc(50% - 3px);
        width: 8px;
        height: 70px; /* 52px card + 17px gap + 1px increase */
        background: linear-gradient(to right, #dcdcdc, #ffffff 40%, #ffffff 60%, #dcdcdc);
        border-radius: 4px;
        box-shadow: 2px 0 5px rgba(0,0,0,0.2), inset 0 -1px 0 rgba(0,0,0,0.1);
        z-index: 10;
        pointer-events: none;
    }
    .nav-item-rod:nth-child(odd) { z-index: 6; }
}

/* 快速链接光感动画 */
@keyframes shimmer {
    0% { transform: translateX(-100%); }
    100% { transform: translateX(100%); }
}

.quick-link-btn {
    position: relative;
    overflow: hidden;
    transform: translateY(0);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.quick-link-btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 15px rgba(0,0,0,0.3);
    filter: brightness(1.1);
}
.quick-link-btn:active {
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(0,0,0,0.2);
}
.quick-link-btn::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to right, transparent, rgba(255,255,255,0.4), transparent);
    transform: translateX(-100%);
    transition: none;
    z-index: 1;
    pointer-events: none;
}
.quick-link-btn:hover::after {
    animation: shimmer 0.6s ease-in-out;
}

/* 快捷导航颜色渐变与文字描边 */
.bg-gradient-orange { background: linear-gradient(to bottom, #ff8c00, #ff4500); }
.text-shadow-orange { text-shadow: 1px 1px 0 #b33000, -1px -1px 0 #b33000, 1px -1px 0 #b33000, -1px 1px 0 #b33000; }

.bg-gradient-yellow { background: linear-gradient(to bottom, #f1c40f, #f39c12); }
.text-shadow-yellow { text-shadow: 1px 1px 0 #b06100, -1px -1px 0 #b06100, 1px -1px 0 #b06100, -1px 1px 0 #b06100; }

.bg-gradient-lime { background: linear-gradient(to bottom, #add100, #7b920a); }
.text-shadow-lime { text-shadow: 1px 1px 0 #4a5e00, -1px -1px 0 #4a5e00, 1px -1px 0 #4a5e00, -1px 1px 0 #4a5e00; }

.bg-gradient-green { background: linear-gradient(to bottom, #2ecc71, #27ae60); }
.text-shadow-green { text-shadow: 1px 1px 0 #196f3d, -1px -1px 0 #196f3d, 1px -1px 0 #196f3d, -1px 1px 0 #196f3d; }

.bg-gradient-cyan { background: linear-gradient(to bottom, #00c6ff, #0072ff); }
.text-shadow-cyan { text-shadow: 1px 1px 0 #004080, -1px -1px 0 #004080, 1px -1px 0 #004080, -1px 1px 0 #004080; }

.bg-gradient-blue { background: linear-gradient(to bottom, #3498db, #2980b9); }
.text-shadow-blue { text-shadow: 1px 1px 0 #154360, -1px -1px 0 #154360, 1px -1px 0 #154360, -1px 1px 0 #154360; }

/* 社交图标光泽 */
.social-icon-shine::after {
    content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 50%;
    background: linear-gradient(to bottom, rgba(255,255,255,0.3), transparent);
    pointer-events: none;
}

/* 解决移动端横向滚动条 */
.no-horizontal-scroll, html, body, #app {
    overflow-x: hidden;
    max-width: 100%;
}
.scrollbar-hide::-webkit-scrollbar { display: none; }
.scrollbar-hide { -ms-overflow-style: none; scrollbar-width: none; }

/* 手机端优化：二级页顶部标签滚动与触控面积 */
@media (max-width: 992px) {
  nav.items-end.flex { overflow-x: auto; gap: 8px; }
  a.rounded-t-md { min-width: 120px; display: inline-flex; flex-shrink: 0; }
}

/* 手机端优化：卡片密度与排版（通用） */
@media (max-width: 992px) {
  article .p-6 { padding: 1rem; }
  article .text-2xl { font-size: 1.5rem; }
}

/* 照片平滑渲染，减少缩放锯齿 */
.photo-smooth {
  image-rendering: auto;
  -webkit-optimize-contrast: auto;
  backface-visibility: hidden;
  transform: translateZ(0);
}

/* 二维码锐化 */
.qr-sharp {
  image-rendering: pixelated;
  image-rendering: crisp-edges;
  transform: translateZ(0);
}

/* 恢复桌面端的阶梯式宽度设计 */
@media (min-width: 992px) {
    .item-01 { width: 196px !important; }
    .item-02 { width: 213px !important; }
    .item-03 { width: 230px !important; }
    .item-04 { width: 247px !important; }
    .item-05 { width: 265px !important; }
    .item-06 { width: 281px !important; }
    
    /* 针对特定项的文字微调 */
    .item-02 .text-content { font-size: 13px; margin-top: -2px; }
}

/* 入场动画 */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.animate-fade-in-up {
    animation: fadeInUp 0.8s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
}

@keyframes fadeInDown {
    from {
        opacity: 0;
        transform: translate3d(0, -20px, 0);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}
.animate-fade-in-down {
    animation: fadeInDown 0.5s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
}

/* 顺序延迟动画 (Main Content) */
.stagger-1 { animation-delay: 0.1s; opacity: 0; animation-fill-mode: forwards; animation-name: fadeInUp; animation-duration: 0.8s; }
.stagger-2 { animation-delay: 0.3s; opacity: 0; animation-fill-mode: forwards; animation-name: fadeInUp; animation-duration: 0.8s; }
.stagger-3 { animation-delay: 0.5s; opacity: 0; animation-fill-mode: forwards; animation-name: fadeInUp; animation-duration: 0.8s; }
.stagger-4 { animation-delay: 0.7s; opacity: 0; animation-fill-mode: forwards; animation-name: fadeInUp; animation-duration: 0.8s; }

/* ---------------- 进场动画增强 (Quick Nav) ---------------- */
@keyframes slideScaleIn {
    0% {
        opacity: 0;
        transform: translateX(50px) scale(0.9);
    }
    100% {
        opacity: 1;
        transform: translateX(0) scale(1);
    }
}

@keyframes fadeInElement {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* 文字入场动画 */
@keyframes entrance-flash {
    0% {
        opacity: 0;
        transform: translateY(20px);
        filter: blur(4px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
        filter: blur(0);
    }
}

/* 仅在桌面端应用复杂动画 */
@media (min-width: 1024px) {
    .nav-item-rod {
        opacity: 0; /* 初始隐藏 */
        animation: slideScaleIn 0.5s ease-out forwards;
        will-change: transform, opacity;
    }

    /* 标签依次延迟 */
    .nav-item-rod.item-01 { animation-delay: 0.2s; }
    .nav-item-rod.item-02 { animation-delay: 0.3s; }
    .nav-item-rod.item-03 { animation-delay: 0.4s; }
    .nav-item-rod.item-04 { animation-delay: 0.5s; }
    .nav-item-rod.item-05 { animation-delay: 0.6s; }
    .nav-item-rod.item-06 { animation-delay: 0.7s; }

    /* 黑洞 (::after) 动画 - 标签全部结束后(1.2s)显示 */
    .nav-item-rod::after {
        opacity: 0; /* 覆盖默认可见性 */
        animation: fadeInElement 0.3s ease-out forwards;
        animation-delay: 1.2s;
    }

    /* 连接杆 (::before) 动画 - 黑洞显示0.1s后(1.3s)显示 */
.nav-item-rod:nth-child(odd)::before {
        opacity: 0; /* 覆盖默认可见性 */
        animation: fadeInElement 0.3s ease-out forwards;
        animation-delay: 1.3s;
    }
}

.bg-white { background-color: #ffffff; }
.text-white { color: #ffffff; }
.bg-white\/10 { background-color: rgba(255,255,255,0.1); }
.text-white\/10 { color: rgba(255,255,255,0.1); }
.text-white\/70 { color: rgba(255,255,255,0.7); }
.items-center { align-items: center; }
.justify-center { justify-content: center; }
.justify-between { justify-content: space-between; }



.hover\:bg-white:hover { background-color: #ffffff; }
.hover\:text-white:hover { color: #ffffff; }
.group:hover .group-hover\:bg-white { background-color: #ffffff; }
.group:hover .group-hover\:text-white { color: #ffffff; }
.group\/link:hover [class*="group-hover\/link:bg-white"] { background-color: #ffffff; }
.group\/link:hover [class*="group-hover\/link:text-white"] { color: #ffffff; }
.group\/item:hover [class*="group-hover\/item:bg-white"] { background-color: #ffffff; }
.group\/item:hover [class*="group-hover\/item:text-white"] { color: #ffffff; }

@media (min-width: 768px) {
  .md\:items-center { align-items: center; }
  .md\:justify-center { justify-content: center; }
  .md\:justify-between { justify-content: space-between; }
}
