/* ============================================================
   2HOS.com - 移動端樣式 v4（App 體驗 · 側滑抽屜菜單）
   ============================================================ */

@media (max-width: 768px) {
    :root {
        --header-height: 52px;
    }

    body {
        background: var(--color-bg-page);
        padding-top: var(--header-height);
        padding-bottom: calc(64px + env(safe-area-inset-bottom, 0px));
    }

    /* === 頂欄：teal 底 + 白字（App 風） === */
    .site-header {
        background: linear-gradient(135deg, #7eb4b3 0%, #6ba8a7 100%);
        border-bottom: none;
        box-shadow: 0 2px 10px rgba(46, 125, 125, 0.18);
    }

    .header-inner {
        padding: 0 10px;
        position: relative;
    }

    .logo { display: none; }
    .mobile-header-title { display: block; }

    .mobile-menu-btn {
        display: flex;
        color: #fff;
        padding: 10px;
        margin-left: -4px;
    }

    /* 搜索入口已移入側滑菜單，header 不再顯示 */
    .header-search-btn { display: none; }

    .desktop-nav { display: none; }

    /* === 首頁頂部 teal 區 === */
    .home-hero {
        padding: 14px 16px 46px;
    }

    .home-search {
        padding: 4px 4px 4px 16px;
    }

    .home-search input { font-size: 0.9rem; height: 40px; }
    .home-search button { width: 36px; height: 36px; }

    /* === 概覽數據卡 === */
    .quick-stats { padding: 0 12px; margin-top: -30px; }
    .qs-value { font-size: 1rem; }
    .qs-label { font-size: 0.68rem; }
    .quick-stats-inner { padding: 12px 4px; }

    /* === App 宮格 === */
    .app-grid-wrap { padding: 0 12px; margin-top: 12px; }
    .app-grid { padding: 16px 4px 12px; row-gap: 14px; }
    .app-grid-icon { width: 46px; height: 46px; border-radius: 13px; }
    .app-grid-icon svg { width: 24px; height: 24px; }
    .app-grid-label { font-size: 0.74rem; }

    /* === App 欄目 === */
    .app-section { padding: 20px 12px 4px; }
    .app-section-title { font-size: 1.05rem; }

    .hos-feature-inner { padding: 16px; }
    .hos-feature h3 { font-size: 1.12rem; }
    .hos-feature-stats { gap: 14px; }
    .hfs-item .hfs-value { font-size: 0.98rem; }

    .hos-mini { flex: 0 0 140px; padding: 12px; }

    .tx-row { padding: 12px 14px; gap: 10px; }
    .tx-row-title { font-size: 0.9rem; }
    .tx-row-price { font-size: 0.95rem; }

    .hot-grid { gap: 10px; }
    .hot-card { padding: 13px; }
    .hot-card-name { font-size: 0.92rem; }

    .news-row { padding: 12px 13px; }
    .news-row-title { font-size: 0.86rem; }

    /* === 通用 section / 內頁 === */
    .section { padding: 32px 14px; }
    .section-header { margin-bottom: 18px; }
    .section-title { font-size: 1.15rem; }

    .stats-bar {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
        padding: 22px 16px;
        border-radius: var(--radius-lg);
    }
    .stat-value { font-size: 1.6rem; }
    .stat-label { font-size: 0.8rem; }

    .articles-grid { grid-template-columns: 1fr; gap: 14px; }
    .estates-grid { grid-template-columns: 1fr; gap: 14px; }
    .estate-list { grid-template-columns: 1fr; gap: 14px; }
    .estate-info-grid { grid-template-columns: 1fr; gap: 14px; }

    .page-header { padding: 30px 16px; }
    .page-header h1 { font-size: 1.4rem; }

    .estate-hero, .court-hero { padding: 28px 16px; }
    .estate-hero h1, .court-hero h1 { font-size: 1.4rem; }

    .news-item { flex-direction: column; gap: 12px; }
    .news-item-cover { width: 100%; min-height: 80px; }

    .article-detail { padding: 28px 16px; }
    .article-detail h1 { font-size: 1.4rem; }
    .article-content { font-size: 0.98rem; }

    .static-page { padding: 28px 16px; }
    .static-page h1 { font-size: 1.4rem; }

    .filter-bar {
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        padding-bottom: 4px;
    }
    .filter-bar::-webkit-scrollbar { display: none; }
    .filter-btn { white-space: nowrap; flex-shrink: 0; }

    .forum-placeholder { padding: 56px 16px; }
    .forum-placeholder .forum-icon { width: 96px; height: 96px; }
    .forum-placeholder h1 { font-size: 1.4rem; }

    .login-page { padding: 28px 16px; }
    .login-card { padding: 32px 22px; }

    .transactions-notice { padding: 44px 16px; }

    .card-body { padding: 16px; }
    .card-title { font-size: 0.98rem; }

    .breadcrumb { font-size: 0.8rem; }

    /* === schemes 新盤頁 === */
    .scheme-banner { padding: 18px 16px; }
    .scheme-banner h2 { font-size: 1.2rem; }
    .scheme-banner-stats { gap: 18px; }
    .scheme-card { padding: 16px; }
    .scheme-card h3 { font-size: 1.05rem; }
    .guide-link-grid { grid-template-columns: 1fr; }

    /* === 底部導航顯示 === */
    .mobile-bottom-nav { display: flex; }

    /* 隱藏 footer，只保留底部導航 */
    .site-footer { display: none; }
}

@media (max-width: 360px) {
    .app-grid-icon { width: 42px; height: 42px; }
    .app-grid-label { font-size: 0.7rem; }
    .qs-value { font-size: 0.92rem; }
    .qs-label { font-size: 0.64rem; }
    .hot-grid { grid-template-columns: 1fr; }
    .scheme-card-grid { grid-template-columns: 1fr; }
}

/* === 平板 === */
@media (min-width: 769px) and (max-width: 1024px) {
    .articles-grid { grid-template-columns: repeat(2, 1fr); }
    .estates-grid { grid-template-columns: repeat(2, 1fr); }
    .quick-nav-grid { grid-template-columns: repeat(4, 1fr); }
}

/* === 成交排行榜 v10：手機單欄 === */
@media (max-width: 768px) {
    .rk-grid { grid-template-columns: 1fr; gap: 12px; }
    .rk-card { padding: 14px 12px 6px; }
    .rk-title { font-size: 0.95rem; }
    .rk-sub { margin: 2px 0 4px; }
}