/* 快连知识库公共样式：33 篇知识库文章页内联样式合并去重生成 */
/* 规则均限定在 .kl-page 作用域内，不影响全站其他页面 */

@media (max-width: 1024px) {
    .kl-page .kl-detail .kl-content-wrap {
                    padding: 0 30px;
                    gap: 30px;
                }
    .kl-page .kl-detail-hero h1 {
                    font-size: 1.8rem;
                }
    .kl-page .kl-detail .kl-sidebar {
                    flex: 0 0 220px;
                }
    .kl-page .kl-detail .kl-article {
                    padding: 30px 28px;
                }
}

@media (max-width: 768px) {
    .container {
                    max-width: 100%;
                    padding: 0 20px;
                }
    .kl-page .kl-detail .kl-content-wrap {
                    max-width: 100%;
                    padding: 0 20px;
                }
    .hamburger {
                    display: block;
                }
    .nav-links {
                    display: none;
                    flex-direction: column;
                    width: 100%;
                    gap: 12px;
                    padding: 16px 0 8px;
                    border-top: 1px solid rgba(0, 102, 255, 0.06);
                    margin-top: 4px;
                    align-items: center;
                }
    .nav-links.active {
                    display: flex;
                }
    .nav-links a {
                    font-size: 1rem;
                }
    .btn-nav {
                    width: 100%;
                    text-align: center;
                    justify-content: center;
                }
    .kl-page .kl-detail-hero {
                    padding: 20px 0 16px;
                }
    .kl-page .kl-detail-hero h1 {
                    font-size: 1.5rem;
                }
    .kl-page .kl-detail {
                    padding: 20px 0 40px;
                }
    .kl-page .kl-detail .kl-article {
                    padding: 20px 18px;
                    border-radius: 16px;
                }
    .kl-page .kl-detail .kl-article .kl-featured {
                    height: 160px;
                }
    .kl-page .kl-detail .kl-article .kl-body h2 {
                    font-size: 1.2rem;
                }
    .kl-page .kl-detail .kl-article .kl-body h3 {
                    font-size: 1.05rem;
                }
    .kl-page .kl-detail .kl-sidebar {
                    flex: 1;
                    position: static;
                    width: 100%;
                }
    .kl-page .kl-detail .kl-sidebar .kl-side-card {
                    padding: 18px 20px;
                }
    .kl-page .kl-detail-cta h2 {
                    font-size: 1.3rem;
                }
    .kl-page .kl-detail-cta .kl-cta-btns {
                    flex-direction: column;
                    align-items: center;
                }
    .kl-page .kl-detail-cta .kl-cta-btns .btn-primary,
                .kl-page .kl-detail-cta .kl-cta-btns .btn-outline {
                    width: 100%;
                    justify-content: center;
                }
    .back-to-top {
                    bottom: 20px;
                    right: 20px;
                    width: 44px;
                    height: 44px;
                    font-size: 1rem;
                }
}

@media (max-width: 480px) {
    .container {
                    max-width: 100%;
                    padding: 0 14px;
                }
    .kl-page .kl-detail .kl-content-wrap {
                    padding: 0 14px;
                }
    .kl-page .kl-detail-hero h1 {
                    font-size: 1.3rem;
                }
    .kl-page .kl-detail-hero .kl-meta {
                    font-size: 0.75rem;
                    gap: 10px;
                }
    .kl-page .kl-detail .kl-article {
                    padding: 16px 14px;
                }
    .kl-page .kl-detail .kl-article .kl-featured {
                    height: 120px;
                }
    .kl-page .kl-detail .kl-article .kl-body p {
                    font-size: 0.92rem;
                }
    .kl-page .kl-detail .kl-article .kl-body ul li {
                    font-size: 0.92rem;
                }
    .kl-page .kl-detail .kl-article .kl-body .kl-tip {
                    padding: 12px 16px;
                    font-size: 0.9rem;
                }
    .kl-page .kl-detail .kl-article .kl-body .kl-step {
                    padding: 14px 16px;
                }
    .kl-page .kl-detail .kl-article .kl-body .kl-step .kl-step-item .step-text {
                    font-size: 0.9rem;
                }
    .kl-page .kl-detail .kl-sidebar .kl-side-card {
                    padding: 14px 16px;
                }
    .kl-page .kl-detail .kl-sidebar .kl-side-card ul li a {
                    font-size: 0.82rem;
                }
    .back-to-top {
                    bottom: 16px;
                    right: 16px;
                    width: 40px;
                    height: 40px;
                    font-size: 0.9rem;
                }
}

@media (max-width: 1024px) {
    .kl-page .kl-detail .content-wrap { padding: 0 30px; gap: 30px; }
}

@media (max-width: 768px) {
    .kl-page .kl-detail .content-wrap { max-width: 100%; padding: 0 20px; }
    .kl-page .kl-detail-cta .cta-buttons { flex-direction: column; align-items: center; }
}