/* =============================================================
 * responsive.css — 全站响应式断点（统一维护）
 * 断点：≤1024px 平板横 / ≤768px 平板竖与手机 / ≤420px 小屏
 * ============================================================= */

/* ==================== ≤1024px ==================== */
@media (max-width: 1024px) {
    .section { padding: 72px 0; }

    /* 主导航：启用抽屉 */
    .nav-toggle { display: inline-flex; }
    .nav-wrap { gap: 14px; }

    /* 移动端关闭毛玻璃：backdrop-filter 会成为固定定位抽屉的包含块，
       导致 .nav-menu 高度被限制在 header 内（桌面端保留该效果） */
    .site-header {
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }

    .nav-menu {
        /* 覆盖 header.css 中的首屏 display:none，恢复抽屉开关位移动画 */
        display: flex;
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        width: min(320px, 84vw);
        z-index: 999;
        flex-direction: column;
        align-items: stretch;
        gap: 2px;
        padding: calc(var(--header-h) + 16px) 18px 28px;
        background: #fff;
        box-shadow: -12px 0 40px rgba(11, 31, 38, 0.16);
        transform: translateX(105%);
        /* visibility 同步关闭，避免隐藏抽屉的 transform 撑出横向滚动区 */
        visibility: hidden;
        transition: transform 0.28s ease, visibility 0s linear 0.28s;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }
    .nav-menu.is-open {
        transform: translateX(0);
        visibility: visible;
        transition: transform 0.28s ease;
    }

    .nav-menu-link {
        padding: 13px 14px;
        font-size: 15.5px;
        border-radius: var(--r-md);
    }
    .nav-menu-item.is-active > .nav-menu-link { background: var(--c-primary-50); }

    /* 移动端下拉改为平铺展开 */
    .nav-dropdown {
        position: static;
        transform: none;
        opacity: 1;
        visibility: visible;
        min-width: 0;
        box-shadow: none;
        border: none;
        background: var(--c-bg-soft);
        margin: 2px 0 6px;
        padding: 4px;
        display: none;
    }
    .nav-menu-item.is-expanded > .nav-dropdown { display: block; }
    .nav-menu-item:hover > .nav-dropdown { transform: none; }
    .nav-menu-link .caret { transition: transform 0.2s; }
    .nav-menu-item.is-expanded .caret { transform: rotate(180deg); }

    /* 抽屉内附加操作区：搜索 / 语言 / 登录 / 试用 */
    .nav-drawer-extra {
        margin-top: auto;
        padding-top: 20px;
        border-top: 1px solid var(--c-line);
        display: grid;
        gap: 12px;
    }
    .nav-drawer-extra .btn { width: 100%; min-height: 46px; }
    .nav-drawer-search { display: flex; gap: 8px; }
    .nav-drawer-search input {
        flex: 1;
        min-width: 0;
        width: 100%;
        height: 44px;
        padding: 0 16px;
        border: 1px solid var(--c-line-strong);
        border-radius: var(--r-pill);
        background: var(--c-bg);
        font-size: 15px;
        outline: none;
    }
    .nav-drawer-search input:focus { border-color: var(--c-primary); }
    .nav-drawer-search button {
        width: 44px;
        height: 44px;
        flex: 0 0 auto;
        border: none;
        border-radius: 50%;
        background: var(--c-primary);
        color: #fff;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }
    .nav-drawer-search button .icon { width: 19px; height: 19px; }

    /* 操作区精简：登录文字入口移入抽屉；语言切换保留在顶栏（手机端同样走下拉） */
    .nav-actions .nav-link-text { display: none; }
    .nav-actions .btn-trial-desktop { padding: 10px 18px; font-size: 14px; }
    /* 购物车与会员头像在顶栏常驻，方便手机端直达 */
    .nav-user { max-width: 130px; }

    /* Hero */
    .hero { padding: 60px 0 72px; }
    .hero-grid { grid-template-columns: 1fr; gap: 52px; }
    .hero-visual { max-width: 560px; margin: 0 auto; width: 100%; }
    .hero-float-card--cert { left: 0; }
    .hero-float-card--speed { right: 0; }

    /* 能力展示行 */
    .showcase-row { grid-template-columns: 1fr; gap: 36px; margin-bottom: 72px; }
    .showcase-row--reverse .showcase-media { order: 0; }

    /* 卡片网格降级 */
    .features-grid { grid-template-columns: repeat(2, 1fr); }
    .tutorials-grid { grid-template-columns: repeat(2, 1fr); }
    .news-grid { grid-template-columns: 1fr; max-width: 620px; margin-left: auto; margin-right: auto; }

    /* 三步 */
    .steps-grid { grid-template-columns: 1fr; max-width: 520px; margin: 0 auto; }
    .step-card:not(:last-child)::after { display: none; }

    /* 保障 */
    .guarantee-grid { grid-template-columns: repeat(2, 1fr); }

    /* 页脚 */
    .footer-top {
        grid-template-columns: 1fr 1fr;
        gap: 36px 28px;
    }
    .footer-brand { grid-column: 1 / -1; }

    /* 内页 */
    .contact-grid { grid-template-columns: 1fr; gap: 36px; }
    .article-card { grid-template-columns: 220px 1fr; gap: 20px; }
}

/* ==================== ≤768px ==================== */
@media (max-width: 768px) {
    .container { padding: 0 18px; }
    .section { padding: 56px 0; }
    .section-head { margin-bottom: 40px; }

    /* 公告条 */
    .announce-bar { padding: 8px 16px; font-size: 12.5px; line-height: 1.6; }
    /* 放大“查看方案”点击区，负边距避免行高跳动 */
    .announce-bar a { display: inline-block; padding: 6px 10px; margin: -6px -2px; line-height: 1.4; min-height: 36px; }

    /* 面包屑链接触摸目标 */
    .breadcrumb a { display: inline-flex; align-items: center; min-height: 34px; padding: 0 4px; }

    /* 顶栏 */
    :root { --header-h: 62px; }
    .nav-actions { gap: 6px; }
    .nav-actions .nav-search { display: none; }
    /* 手机端只保留头像（昵称在抽屉内可见），节省顶栏空间 */
    .nav-user { max-width: none; padding: 4px; gap: 0; }
    .nav-user-name { display: none; }
    .nav-cart { width: 38px; height: 38px; }
    /* 语言切换：顶栏紧凑下拉，只留旗帜+箭头（隐藏 CN 文字），不占抽屉空间 */
    .lang-switch-btn { height: 36px; gap: 4px; padding: 0 7px; }
    .lang-switch-code { display: none; }
    .lang-switch-flag { width: 20px; height: 20px; }
    .lang-switch-caret { width: 13px; height: 13px; }
    /* 菜单右对齐不越界；选项行高补足约 44px 触摸目标 */
    .lang-switch-menu { min-width: 168px; }
    .lang-switch-option { padding: 11px 10px; font-size: 14.5px; }
    .nav-logo-text { font-size: 18px; }
    .nav-logo svg,
    .nav-logo img { width: 30px; height: 30px; }
    /* Logo 点击区补足触摸高度 */
    .nav-logo { padding: 4px 4px; margin-left: -4px; border-radius: var(--r-sm); }

    /* 首页锚点条：手机端整行显示不全，改为可左右拖动（横向滚动），桌面仍居中 */
    .anchor-bar { top: var(--header-h); }
    .anchor-bar-inner {
        justify-content: flex-start;
        flex-wrap: nowrap;
        gap: 4px;
        padding: 0 12px;
        -webkit-overflow-scrolling: touch;
        touch-action: pan-x;
        scroll-snap-type: x proximity;
    }
    /* 子项不被压缩，形成可溢出宽度才能真正拖动；隐藏滚动条沿用桌面规则 */
    .anchor-bar a {
        flex: 0 0 auto;
        padding: 11px 14px;
        font-size: 13.5px;
        scroll-snap-align: start;
    }

    /* Hero */
    .hero { padding: 44px 0 56px; }
    .hero-slogan { font-size: 17px; line-height: 1.65; }
    .hero-sub { font-size: 16px; }
    .hero-actions .btn { width: 100%; }
    .hero-actions { gap: 12px; }
    .hero-trust { gap: 12px 20px; }
    .hero-float-card { padding: 9px 12px; font-size: 12px; }
    .hero-float-card .icon { width: 16px; height: 16px; }

    /* 数据条 */
    .stats-bar { padding: 36px 0; }
    .stats-grid { grid-template-columns: 1fr 1fr; gap: 28px 16px; }

    /* 优势 */
    .features-grid { grid-template-columns: 1fr; gap: 16px; }
    .feature-card { padding: 26px 22px; }

    /* 定价 */
    .pricing-grid { grid-template-columns: 1fr; }
    .price-card { padding: 34px 26px; }

    /* 教程 / 保障 */
    .tutorials-grid { grid-template-columns: 1fr; }
    .guarantee-grid { grid-template-columns: 1fr; }

    /* FAQ */
    .faq-q { padding: 17px 18px; font-size: 15px; gap: 11px; }
    .faq-a-inner { padding: 0 18px 18px 18px; gap: 10px; }

    /* CTA */
    .cta-band { padding: 56px 22px; }
    .cta-actions { width: 100%; }
    .cta-actions .btn { width: 100%; min-height: 50px; }

    /* 登录/注册卡片内文字链接：放大触摸区，窄屏允许换行 */
    .auth-footer { flex-wrap: wrap; justify-content: center; row-gap: 8px; }
    .auth-footer a { padding: 8px 10px; min-height: 40px; display: inline-flex; align-items: center; }
    .back-home { min-height: 40px; display: inline-flex; align-items: center; padding: 6px 10px; }

    /* 富文本表格超宽时容器内横滑，避免撑破页面 */
    .prose table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }

    /* 页脚 */
    .site-footer { padding-top: 52px; }
    .footer-top { grid-template-columns: 1fr; gap: 30px; padding-bottom: 40px; }
    .footer-bottom { flex-direction: column; text-align: center; gap: 8px; }
    .footer-meta { justify-content: center; }

    /* 内页 */
    .page-hero { padding: 46px 0 40px; }
    .page-body { padding: 44px 0 64px; }
    .about-values { grid-template-columns: 1fr; gap: 16px; }
    .about-mission { grid-template-columns: 1fr; padding: 32px 24px; gap: 24px; }
    .form-row { grid-template-columns: 1fr; gap: 0; }
    .contact-form-card { padding: 28px 22px; }
    .article-card { grid-template-columns: 1fr; }
    .article-cover { order: -1; }
    /* 列表标题链接：补足触摸高度 */
    .article-card h3 a { display: inline-block; padding: 5px 0; line-height: 1.45; }
    .article-pager { grid-template-columns: 1fr; }
    .article-pager .pager-next { text-align: left; }

    /* 自定义模块 */
    .cm-row { grid-template-columns: 1fr; gap: 20px; }
    .cm-grid-4 { grid-template-columns: 1fr 1fr; }
    .cm-grid-5 { grid-template-columns: 1fr 1fr; }
    .cm-grid-5 .cm-img-cell:first-child { grid-column: span 2; }
    .cm-grid-side { grid-template-columns: 1fr; }
    .cm-stack-top { grid-template-columns: 1fr; }

    /* Cookie */
    .cookie-inner { flex-direction: column; align-items: stretch; padding: 16px 18px; }
    .cookie-actions .cookie-btn { flex: 1; text-align: center; }
}

/* ==================== ≤420px 小屏 ==================== */
@media (max-width: 420px) {
    .stats-grid { grid-template-columns: 1fr; gap: 22px; }
    .hero-actions .btn { font-size: 15px; }
    .price-amount .num { font-size: 44px; line-height: 1.15; }
    .tutorial-body { padding: 18px 18px 20px; }
    .article-detail h1 { font-size: 24px; }
}