/* ============================================
   禾佳土流.cn · 移动端响应式样式 (mobile.css)
   手机 <768px 全量适配；平板 768-1023px 微调；
   桌面 ≥1024px 保持原布局（本文件不影响）
   ============================================ */

/* ---------- 汉堡菜单 / 侧滑面板 / 遮罩 / 底部悬浮栏（全尺寸挂载，小屏启用） ---------- */
.menu-toggle{display:none;background:none;border:none;font-size:22px;line-height:1;cursor:pointer;color:#fff;padding:6px;flex-shrink:0}
.side-menu{position:fixed;top:0;right:0;width:84%;max-width:340px;height:100%;background:#fff;z-index:200;transition:transform .3s ease;overflow-y:auto;box-shadow:-2px 0 12px rgba(0,0,0,.15);display:flex;flex-direction:column;visibility:hidden;transform:translateX(100%)}
.side-menu.open{transform:translateX(0);visibility:visible}
.menu-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.5);z-index:150;display:none}
.menu-overlay.active{display:block}
.side-menu .menu-header{display:flex;justify-content:space-between;align-items:center;padding:16px;background:linear-gradient(135deg,#1e56a0,#3375c9);color:#fff;flex-shrink:0}
.side-menu .menu-header .mh-title{font-size:17px;font-weight:700}
.side-menu .menu-close{background:rgba(255,255,255,.15);border:none;color:#fff;font-size:16px;width:32px;height:32px;border-radius:50%;cursor:pointer;line-height:1}
.side-menu .menu-list{list-style:none;padding:6px 0;flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch}
.side-menu .menu-list li a{display:flex;align-items:center;gap:10px;padding:14px 20px;font-size:15px;color:#222;text-decoration:none;border-bottom:1px solid #f5f5f5}
.side-menu .menu-list li a:active{background:#f0f6fd}
.side-menu .menu-list .submenu{list-style:none;display:none;background:#f6fafd}
.side-menu .menu-list .has-submenu.open .submenu{display:block}
.side-menu .menu-list .submenu a{padding-left:46px;font-size:14px;color:#555;border-bottom:none}
.side-menu .menu-list .arrow{margin-left:auto;transition:transform .2s;color:#999;font-style:normal}
.side-menu .menu-list .has-submenu.open .arrow{transform:rotate(90deg)}
.side-menu .menu-footer{padding:14px 16px 20px;border-top:1px solid #eee;flex-shrink:0}
.side-menu .menu-phone{display:flex;align-items:center;justify-content:center;gap:6px;padding:13px;background:#eef4fb;color:#1e56a0;border-radius:8px;font-size:14px;font-weight:600;text-decoration:none}
.bottom-bar{position:fixed;bottom:0;left:0;width:100%;height:60px;display:none;background:#fff;border-top:1px solid #e8e8e8;z-index:300;box-shadow:0 -2px 10px rgba(0,0,0,.08);padding:8px 12px;gap:12px;align-items:center}
.bottom-bar .bar-btn{flex:1;display:flex;align-items:center;justify-content:center;height:44px;border-radius:8px;font-size:15px;font-weight:500;text-decoration:none;gap:6px}
.bottom-bar .bar-btn-outline{border:2px solid #3375c9;color:#3375c9;background:#fff}
.bottom-bar .bar-btn-primary{background:linear-gradient(135deg,#1e56a0,#3375c9);color:#fff}

/* ---------- 手机端 <768px ---------- */
@media (max-width:767px){
  body{font-size:15px;-webkit-text-size-adjust:100%;line-height:1.6;overflow-x:hidden}
  .wrap{padding-left:16px!important;padding-right:16px!important}

  /* ===== 顶栏压缩 ===== */
  .top-bar{display:none!important}
  .main-nav{position:sticky;top:0;z-index:100}
  .nav-logo-row{padding:8px 0}
  .nav-logo-row .wrap{gap:2px}
  .nav-logo-text{font-size:20px}
  .nav-logo-row span[style*="font-size:15px"]{font-size:11px!important}
  .nav-menu-row{padding:0}
  .nav-menu-row .wrap{min-height:44px}
  .nav-menu-items{display:none!important}
  .nav-menu-right{gap:10px}
  .nav-menu-right .phone{display:none!important}
  .nav-menu-right .btn-publish{font-size:12px;padding:7px 12px}
  .menu-toggle{display:block}
  .hot-tags-row{padding:0 0 10px}
  .hot-tags-row .wrap{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .hot-tags-row .wrap::-webkit-scrollbar{display:none}
  .hot-tags-row .label{display:none}

  /* ===== 免责声明条 精简 ===== */
  .disclaimer-bar{padding:8px 0!important;font-size:12px!important;line-height:1.6!important;max-height:38px;overflow:hidden}

  /* ===== 服务区域+视频 单列 ===== */
  .hero-split{flex-direction:column!important}
  .hero-left{max-width:100%!important;flex:none!important}
  .hero-cities-row{flex-direction:column!important}
  .hero-cities-left{max-width:100%!important;flex:none!important}
  .hero-video-col{max-width:100%!important;flex:none!important;margin-left:0!important}

  /* ===== 服务分类标签 ===== */
  .services-group{gap:8px}
  .services-group-label{min-width:56px;font-size:12px}
  .services-tag{padding:7px 12px;font-size:13px}

  /* ===== 地区按钮 ===== */
  .area-btn{padding:7px 14px;font-size:13px}
  .area-btn-sm{padding:6px 12px;font-size:12px}

  /* ===== 房源卡片：单列 ===== */
  .cat-grid{grid-template-columns:1fr!important;gap:14px}
  .cat-card-img{height:160px}
  .cat-card-body h4{font-size:16px}
  .cat-card-meta .price{font-size:18px}
  .cat-hd{padding-left:10px}
  .cat-hd-inner .cat-name{font-size:16px}

  /* ===== 区块间距 ===== */
  .s{padding:28px 0}
  .s-hd{margin-bottom:14px}
  .s-title{font-size:17px}

  /* ===== Footer 精简 ===== */
  .footer-main .wrap{padding:0 16px!important}
  .footer-grid{grid-template-columns:repeat(2,1fr)!important;gap:18px}
  .footer-contact{flex-direction:column!important;align-items:flex-start!important;gap:10px}
  .footer-btm{padding:12px 0}
  .footer-btm .wrap{flex-direction:column!important;gap:6px;text-align:center}

  /* ===== 底部悬浮栏 ===== */
  .bottom-bar{display:flex}
  .footer{padding-bottom:70px!important}

  /* ===== 列表页地图控件 ===== */
  .map-header{flex-wrap:wrap;gap:8px;padding:10px 12px}
  .map-title{order:1}
  .map-search{max-width:100%!important;flex:1 1 100%!important;order:2}
  .map-toggle{order:3;margin-left:auto}
  .map-body{height:320px;overflow:hidden}
  .props-grid{grid-template-columns:1fr!important;gap:14px}
}

/* ---------- 平板 768-1023px ---------- */
@media (min-width:768px) and (max-width:1023px){
  .wrap{padding-left:32px!important;padding-right:32px!important}
  .cat-grid{grid-template-columns:repeat(3,1fr)!important}
  /* 平板导航折叠（菜单收进汉堡） */
  .nav-menu-items{display:none!important}
  .menu-toggle{display:block!important}
  .nav-menu-right{gap:12px}
  .nav-menu-right .phone{display:none!important}
  .hot-tags-row .wrap{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .footer-main .wrap{padding:0 32px!important}
  .footer-grid{grid-template-columns:repeat(2,1fr)!important}
  .map-search{max-width:260px!important}
}

/* ---------- 通用移动端顶栏（无 .main-nav 的页面使用） ---------- */
.m-topbar{display:none}
@media (max-width:767px){
  .m-topbar{display:flex;position:sticky;top:0;z-index:100;height:52px;align-items:center;justify-content:space-between;padding:0 16px;background:#fff;border-bottom:1px solid #e5e7eb}
  .m-topbar .m-logo{font-size:20px;font-weight:900;color:#1e56a0;text-decoration:none;white-space:nowrap}
  .m-topbar .m-top-actions{display:flex;align-items:center;gap:10px}
  .m-topbar .m-login{font-size:14px;color:#1e56a0;text-decoration:none}
  .m-topbar .menu-toggle{color:#1e56a0!important;font-size:24px}
  /* 有 .main-nav 的页面（首页/about）隐藏通用顶栏，用自带导航 */
  body:has(.main-nav) .m-topbar{display:none!important}
}

/* ---------- 第二套导航 .nav / .navbar 移动端 ---------- */
@media (max-width:767px){
  .nav{display:none!important}
  .navbar{display:none!important}
  body:has(.nav) .m-topbar,body:has(.navbar) .m-topbar{display:flex!important}
  .footer{padding-bottom:70px!important}
}

/* ==========================================================
   手机端界面优化 v2 (2026-07-31)
   —— 8项优化，仅 <768px 生效，桌面端样式不受影响 ——
   品牌色：#3375c9 / 卡片圆角：12px / 基础间距：16px
   ========================================================== */
/* 桌面端默认隐藏移动端专属区块 */
.m-service-grid{display:none}
.m-feature-grid{display:none}
.m-disclaimer{display:none}
.m-footer-slim{display:none}
/* 立即咨询按钮：桌面端隐藏，仅移动端显示 */
.cat-card-btn{display:none}
/* 房源卡片封面图铺满（无封面时保持原渐变+emoji） */
.cat-card-img{background-size:cover;background-position:center}

@media (max-width:767px){
  /* ===== 修改点1：顶部导航 [Logo] [登录] [免费发布] [☰] ===== */
  .nav-logo-row{padding:6px 0}
  .nav-logo-row .wrap{padding-right:148px!important}
  .nav-menu-row{position:absolute!important;top:0!important;right:10px!important;padding:0!important;background:none!important;border:none!important}
  .nav-menu-row .wrap{min-height:46px!important;justify-content:flex-end!important;gap:8px!important;padding:0!important}
  .nav-menu-right{gap:8px!important}
  /* 个人中心、注册、房源列表、分隔线移入汉堡菜单/合并到登录 */
  .nav-menu-right a[href="/ucenter"]{display:none!important}
  .nav-menu-right a[href="/login?mode=register"]{display:none!important}
  .nav-menu-right .btn-list{display:none!important}
  .nav-menu-right span[style*="margin:0 6px"]{display:none!important}
  .nav-menu-right a[href="/login"],.nav-menu-right a[onclick*="doLogout"]{color:#1e56a0!important;font-size:14px;font-weight:500}
  .nav-menu-right .btn-publish{background:#3375c9!important;box-shadow:none!important;font-size:12px;padding:7px 12px}
  .menu-toggle{color:#1e56a0!important;font-size:24px;padding:4px}
  @media (max-width:379px){.nav-logo-row span[style*="font-size:15px"]{display:none!important}}

  /* ===== 修改点2：热门标签 横向滚动+白底圆角边框 ===== */
  .hot-tags-row{padding:8px 0 12px}
  .hot-tags-row .wrap{flex-wrap:nowrap!important;overflow-x:auto!important;gap:8px!important;padding-left:16px!important;padding-right:16px!important;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .hot-tags-row .wrap::-webkit-scrollbar{display:none}
  .hot-tags-row .label{display:inline-flex!important;align-items:center;flex-shrink:0;color:#fff;font-size:13px;font-weight:600;white-space:nowrap}
  .hot-tags-row .label::before{content:'🔥 '}
  .hot-tags-row a{flex-shrink:0;display:inline-flex;align-items:center;min-height:32px;padding:4px 14px;border-radius:999px;background:#fff;border:1px solid #3375c9;color:#3375c9;font-size:13px;font-weight:500;white-space:nowrap;-webkit-tap-highlight-color:transparent}
  .hot-tags-row a:active{background:#3375c9;color:#fff}

  /* ===== 修改点3：服务分类 4列图标网格 ===== */
  .services-tags{display:none!important}
  .m-service-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px 8px;margin-bottom:14px}
  .m-service-grid a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-height:74px;background:#f4f8fd;border:1px solid #dbe6f2;border-radius:10px;text-decoration:none;padding:8px 2px;-webkit-tap-highlight-color:transparent}
  .m-service-grid a:active{transform:scale(.92);background:#e2ecf9}
  .m-service-grid .msg-ico{font-size:24px;line-height:1}
  .m-service-grid .msg-txt{font-size:12px;color:#222;font-weight:500;white-space:nowrap}
  .services-ads-wrap{flex:1 1 100%!important;max-width:100%!important;gap:10px!important}
  .services-ads-wrap a>div:first-child{height:76px!important;font-size:30px!important}
  .services-ads-wrap a>div:last-child{padding:8px 4px!important;font-size:12px!important}

  /* ===== 修改点4：特色服务 3列浅绿卡片 ===== */
  .featured-cards-pc{display:none!important}
  .m-feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
  .m-feature-grid a{display:flex;flex-direction:column;align-items:center;text-align:center;gap:5px;background:#eef4fb;border:1px solid rgba(30,86,160,.18);border-radius:12px;padding:16px 6px 14px;text-decoration:none;-webkit-tap-highlight-color:transparent}
  .m-feature-grid a:active{transform:scale(.93);background:#d8e8fa}
  .m-feature-grid .mfg-ico{font-size:28px;line-height:1}
  .m-feature-grid .mfg-title{font-size:14px;font-weight:700;color:#1e56a0;white-space:nowrap}
  .m-feature-grid .mfg-desc{font-size:11px;color:#5580b8;line-height:1.5}

  /* ===== 修改点5：精选房源 单列卡片（16:9大图+立即咨询） ===== */
  .cat-grid{grid-template-columns:1fr!important;gap:14px}
  .cat-card{border-radius:12px;box-shadow:0 2px 10px rgba(0,0,0,.08);border:1px solid #e5e7eb}
  .cat-card-img{height:auto!important;aspect-ratio:16/9!important;background-size:cover!important;background-position:center!important}
  .cat-card-body{padding:12px 14px 14px}
  .cat-card-body h4{font-size:16px!important;font-weight:700!important}
  .cat-card-loc{font-size:14px!important;color:#6b7280!important;margin:4px 0 6px}
  .cat-card-meta{font-size:14px;margin-top:2px}
  .cat-card-meta .price{font-size:18px}
  .cat-card-btn{display:flex!important;align-items:center;justify-content:center;margin-top:10px;height:40px;background:#3375c9;color:#fff;font-size:15px;font-weight:600;border-radius:8px}

  /* ===== 修改点6：服务区域 横向滚动标签 ===== */
  .m-area-cities,.m-area-districts{flex-wrap:nowrap!important;overflow-x:auto!important;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:2px}
  .m-area-cities::-webkit-scrollbar,.m-area-districts::-webkit-scrollbar{display:none}
  .m-area-cities .area-btn,.m-area-districts .area-btn-sm{flex-shrink:0;display:inline-flex;align-items:center;min-height:44px;border-radius:999px;white-space:nowrap}
  .m-area-cities .area-btn{background:#fff;border:1px solid #d3e0f0;color:#1e56a0;font-size:13px;font-weight:500}
  .m-area-cities .area-btn:active,.m-area-districts .area-btn-sm:active{background:#3375c9!important;color:#fff!important;border-color:#3375c9!important}
  .m-area-districts .area-btn-sm{background:#fff;border:1px solid #e3e7eb;color:#333;font-size:12px}

  /* ===== 修改点7：底部版权 精简+免责声明折叠 ===== */
  .disclaimer-bar{display:none!important}
  .footer-btm{padding:14px 0 10px!important}
  .footer-btm .wrap{flex-direction:row!important;flex-wrap:wrap;gap:4px!important;font-size:12px!important}
  .m-disclaimer{display:block;background:#f8f9fa;padding:12px 16px 16px;text-align:left;border-top:1px solid #eef0f2}
  .m-disclaimer-toggle{font-size:13px;color:#333;font-weight:600;cursor:pointer;-webkit-tap-highlight-color:transparent}
  .m-disclaimer-content{display:none;font-size:12px;color:#555;line-height:1.8;margin-top:8px}

  /* ===== 修改点7b：移动端精简底部（替代PC四栏footer） ===== */
  .footer-main{display:none!important}
  .footer-contact{display:none!important}
  .footer-btm{display:none!important}
  .m-footer-slim{display:block;background:#1f2937;color:#9ca3af;padding:18px 16px 24px;text-align:center}
  .mfs-links{display:flex;justify-content:center;gap:24px;margin-bottom:12px}
  .mfs-links a{color:#cfd6dd;font-size:14px;text-decoration:none;-webkit-tap-highlight-color:transparent}
  .mfs-links a:active{color:#3375c9}
  .mfs-phone{font-size:14px;color:#9ca3af;margin-bottom:6px}
  .mfs-copy{font-size:12px;color:#8b95a1;margin-bottom:10px}
  .mfs-fold{border-top:1px solid rgba(255,255,255,.08);padding-top:8px;text-align:left}
  .mfs-toggle{font-size:12px;color:#9ca3af;cursor:pointer;padding:6px 2px;font-weight:500;-webkit-tap-highlight-color:transparent}
  .mfs-body{display:none;font-size:12px;color:#8b95a1;line-height:1.8;padding:2px 2px 10px}
  .mfs-body a{color:#3375c9;text-decoration:underline}

  /* ===== 修改点8：底部悬浮操作栏 ===== */
  .bottom-bar{height:auto;min-height:60px;padding:8px 14px calc(8px + env(safe-area-inset-bottom))}
  .bottom-bar .bar-btn-primary{background:#3375c9}
  .bottom-bar .bar-btn-outline{border:2px solid #3375c9;color:#3375c9}
  .footer{padding-bottom:calc(70px + env(safe-area-inset-bottom))!important}
}
