/* ============================================================
 * 防雷网 - 移动端响应式适配层（mobile.css）
 * 在 fanglei.css 之后加载，作为最高优先级覆盖层。
 * 设计断点：
 *   992px  平板（网格降为 2 列，详情双栏堆叠）
 *   768px  手机（顶栏精简、header堆叠、导航横滚+点击展开下拉、网格单列、表单单列）
 *   480px  小屏（网格 1 列、间距压缩）
 * 说明：带 !important 的规则用于覆盖页面内联 style 布局。
 * ============================================================ */

/* ============ 平板 992px ============ */
@media (max-width: 992px) {
    .main-grid, .row-3col, .top-news,
    .doc-cat-grid, .case-grid, .expert-grid, .company-grid,
    .hp-2col, .channel-grid, .card-grid,
    .insure-grid, .insure-steps { grid-template-columns: repeat(2, 1fr) !important; }

    .detail-wrap { grid-template-columns: 1fr !important; }

    .channel-hero { flex-direction: column !important; align-items: flex-start !important; }
    .channel-hero .hero-stats { flex-wrap: wrap; }
}

/* ============ 手机 768px ============ */
@media (max-width: 768px) {

    /* ===== 顶栏：精简，只保留登录/注册 ===== */
    .topbar { height: auto; line-height: 1.5; padding: 4px 0; }
    .topbar .container { flex-direction: column; align-items: flex-start; gap: 2px; }
    .topbar-left { display: none; }
    .topbar-right { width: 100%; justify-content: space-between; flex-wrap: wrap; gap: 2px 0; }
    .topbar-right a { margin-left: 0; margin-right: 12px; }
    .lang-switch { display: none; }

    /* ===== Header：logo / 搜索 / 操作按钮 竖排 ===== */
    .header-inner { flex-direction: column; align-items: stretch; gap: 12px; padding: 12px 0; }
    .logo { justify-content: flex-start; }
    .search-area { max-width: none; width: 100%; }
    .header-actions { width: 100%; }
    .header-actions .btn { flex: 1; justify-content: center; }

    /* ===== 主导航：横向滚动 + 点击展开下拉 ===== */
    .nav { height: auto; }
    .nav .container { height: auto; }
    .nav-menu { overflow-x: auto; -webkit-overflow-scrolling: touch; white-space: nowrap; }
    .nav-menu > li { position: static; }
    .nav-menu > li > a { height: 44px; padding: 0 16px; font-size: 14px; }
    .nav-menu li.has-dropdown .dropdown {
        position: static !important;
        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
        display: none;
        width: 100%;
        box-shadow: none;
        border-top: none;
        background: var(--primary-dark);
    }
    .nav-menu li.has-dropdown.open .dropdown { display: block !important; }
    .dropdown a {
        color: rgba(255,255,255,.9);
        border-bottom: 1px solid rgba(255,255,255,.1);
        padding: 10px 20px;
    }
    .dropdown a:hover { background: rgba(255,255,255,.12); color: #fff; padding-left: 24px; }

    /* ===== 列表工具栏（筛选/排序）横向滚动，不换行溢出 ===== */
    .list-toolbar { flex-direction: column; align-items: stretch; gap: 10px; }
    .filter-tabs { overflow-x: auto; white-space: nowrap; padding-bottom: 4px; }
    .sort-bar { flex-wrap: wrap; }

    /* ===== 全站网格统一单列 ===== */
    .main-grid, .row-3col, .top-news, .doc-cat-grid,
    .case-grid, .expert-grid, .company-grid, .prod-grid,
    .hp-2col, .channel-grid, .card-grid, .news-mix, .headline-sub,
    .insure-grid { grid-template-columns: 1fr !important; }
    .footer-grid { grid-template-columns: 1fr 1fr !important; }

    /* 内联 grid 强制覆盖（无 class 布局） */
    .product-scroll { grid-template-columns: repeat(2, 1fr) !important; }
    .insure-steps { grid-template-columns: 1fr 1fr !important; }

    /* ===== 详情页双栏堆叠 ===== */
    .detail-wrap { grid-template-columns: 1fr !important; }
    .cd-header { flex-direction: column !important; align-items: stretch !important; gap: 16px; }
    .cd-header .logo { margin: 0 auto; }
    .hd-info { min-width: 0; }
    .ep-metarow { gap: 12px !important; font-size: 12px !important; }
    .ep-price { flex-wrap: wrap !important; }
    .ep-cta { flex-direction: column !important; align-items: stretch !important; gap: 10px !important; }
    .ep-cta a { justify-content: center; box-sizing: border-box; }
    .ep-related { grid-template-columns: 1fr 1fr !important; }
    .ep-prevnext { flex-direction: column !important; gap: 8px !important; }
    .ep-prevnext > div:last-child { text-align: left !important; }

    /* ===== 表单单列 ===== */
    .ins-form, .iq-grid { grid-template-columns: 1fr !important; }
    .ins-actions, .iq-actions { flex-direction: column !important; align-items: stretch !important; gap: 10px !important; }
    .ins-actions button, .iq-actions button { width: 100%; box-sizing: border-box; }

    /* ===== 通用间距压缩 ===== */
    .container { padding: 0 10px; }
    .mod-body { padding: 14px !important; }
    .mod-head { padding: 10px 14px !important; }

    /* 长内容横向滚动（表格/代码） */
    .article-content { overflow-x: auto; }
    .article-content table { width: 100%; border-collapse: collapse; }
    .article-content img { max-width: 100% !important; height: auto !important; }

    /* 投保 hero CTA 竖排 */
    .hero-cta { flex-direction: column !important; align-items: stretch !important; }
}

/* ============ 小屏 480px ============ */
@media (max-width: 480px) {
    .footer-grid { grid-template-columns: 1fr !important; }
    .product-scroll, .insure-steps, .ep-related { grid-template-columns: 1fr !important; }
    .logo-text h1 { font-size: 22px; }
    .search-tabs a { padding: 4px 10px; font-size: 12px; }
    .header-actions { flex-direction: column; }
    .hp-stat { min-width: calc(50% - 7px); }
    .cd-header .logo { width: 120px !important; height: 120px !important; }
    .cd-header .logo i { font-size: 44px !important; }
    .cd-tabs { overflow-x: auto; white-space: nowrap; }
    .cd-tabs button { padding: 10px 16px; }
    /* 详情页标题字号收敛 */
    .cd-header h1 { font-size: 19px !important; }
}