/* ============================================================
   禾佳房产.cn · 全站视觉统一层（Design Tokens + 收敛）
   2026-09-25 建立｜由 nginx sub_filter 注入所有页面 </head> 前
   维护：只改这一个文件即全站生效；改完把引用处的版本号 +1 破缓存
   纪律：版式结构 / 区块顺序 / 主色（网站蓝 #1e56a0 ＋ 橙 #f59e0b）一律不动
   只统一「质感」：字阶 · 灰阶 · 圆角 · 阴影 · 间距 · 交互手感 · 数字排印
   ============================================================ */
:root{
  /* 文字四级（统一前页面上出现过 10 种灰） */
  --ink:#111;        /* 标题/主字段——不掺灰 */
  --text:#333;       /* 正文 */
  --text-2:#666;     /* 次要说明 */
  --text-3:#999;     /* 辅助/占位 */
  --price:#d97706;   /* 价格橙：与按钮橙 #f59e0b 同族，白底可读性更好 */
  --line:#e5e7eb; --line-soft:#eef0f2; --line-dash:#f0f0f0;
  /* 圆角四档（统一前 3/4/5/6/8/10/14/16/24 共九种） */
  --r-sm:4px; --r-md:6px; --r-lg:10px; --r-pill:999px;
  /* 阴影三档（统一前 10 种各写各的） */
  --sh-1:0 1px 2px rgba(16,24,40,.05);
  --sh-2:0 4px 14px rgba(16,24,40,.09);
  --sh-brand:0 6px 22px rgba(30,86,160,.12);
  --ease:cubic-bezier(.2,.6,.25,1); --dur:.18s;
}
/* 中文排印：抗锯齿 + 微字距 */
body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
h1,h2,h3,h4,.s-title,.bk-name,.hf-adtitle{letter-spacing:.01em}

/* ① 链接不再掉进浏览器默认色 #0000EE（首页原有 28 处、/about 系列 6 处）；
      放在最末尾、优先级最低 → 不覆盖任何已单独设色的规则 */
a{color:inherit}
a:hover{transition:color var(--dur) var(--ease)}
/* 键盘可达性（Tab 能看到焦点） */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid rgba(30,86,160,.5);outline-offset:2px}
::selection{background:rgba(30,86,160,.15)}

/* ② 灰阶收敛 */
.hf-hotwords{color:var(--text-3)}
.hf-hotwords a{color:var(--text-2)}
.news-rich-list li .n-date{color:var(--text-3)}
.bk-cnt{color:var(--text-3)}
.hf-admeta{color:var(--text-2)}
.hf-find-agree{color:var(--text-2)}
.hf-fm-title{font-size:13px;font-weight:500;color:var(--ink)}
.hf-fm-meta{color:var(--text-3)}
.fk-meta,.fk-sub,.hf-adsub,.hf-find-tip{color:var(--text-3)}
.p-loc{color:var(--text-2)}
.p-area,.p-no{color:var(--text-3)}

/* ③ 页脚层级（原来页脚标题 18px 与正文区块标题同大；链接 15px 过散） */
.footer h3{font-size:14px;font-weight:700;color:#fff;letter-spacing:.06em;margin-bottom:10px}
.footer{color:rgba(255,255,255,.66)}
.footer ul li a{font-size:13px;line-height:2.1;color:rgba(255,255,255,.78)}
.footer ul li a:hover{color:#fff}
.footer-contact .contact-item,.footer-btm span{color:rgba(255,255,255,.62);font-size:13px}

/* ④ 圆角/阴影收敛 */
.hf-searchcard,.hf-findcard{border-radius:var(--r-lg);box-shadow:var(--sh-brand)}
.hf-adcard{border-radius:var(--r-lg)}
.hf-adrec,.fk-img,.hf-vid-panel,.hf-fm-img,.p-card{border-radius:var(--r-md)}
.avatar-menu,.bk-empty{border-radius:var(--r-lg)}
.services-tag,.partner-item,.hero-city-tag,.area-btn,.area-btn-sm,.deal-tab{border-radius:var(--r-sm)}

/* ⑤ 数字等宽（价格/面积上下对齐）+ 价格统一成一支橙 */
.hf-fm-price,.hf-adprice,.hf-adsub,.hf-admeta,.p-price,.p-area,.p-attr,.p-no{font-variant-numeric:tabular-nums}
.hf-fm-price small,.hf-adprice small{font-size:11px;font-weight:600}
.p-price,.p-price b,.p-price small{color:var(--price)}

/* ⑥ 卡片悬浮手感统一 */
.fk-img,.hf-adrec,.news-featured-card,.hf-fm-item,.p-card{transition:box-shadow var(--dur) var(--ease),transform var(--dur) var(--ease),border-color var(--dur) var(--ease)}
.fk-card:hover .fk-img{transform:translateY(-3px);box-shadow:var(--sh-2)}
.news-featured-card:hover{box-shadow:var(--sh-2)}
.hf-fm-item:hover{transform:translateX(2px)}
.p-card:hover{border-color:#cfe0f5;box-shadow:var(--sh-2);transform:translateY(-2px)}

/* ⑦ 导航/按钮交互统一 */
.hf-navrow a{transition:color var(--dur) var(--ease),border-color var(--dur) var(--ease)}
.hf-publish,.hf-search-row .btn,.hf-find-btn{transition:background var(--dur) var(--ease),box-shadow var(--dur) var(--ease),transform var(--dur) var(--ease)}
.hf-publish:hover,.hf-search-row .btn:hover{box-shadow:0 4px 14px rgba(20,63,120,.22)}

/* ⑧ 老站绿清零（房产站不用绿，绿＝禾佳土流） */
.hf-find-msg.ok,.acct-msg.ok{color:var(--primary)}

/* ⑨ 橙渐变统一（原 #f0a51f 是页面上的第三种橙） */
.hf-find-btn{background:linear-gradient(90deg,#f59e0b,#d97706)}

/* ⑩ 区块上下留白对称（原来 22/6、20/4、16/6，上宽下窄显得"塌"） */
.s{padding:22px 0}
.hf-cat-mod{padding:18px 0}

/* ⑪ 桌面滚动条收细 */
@media(min-width:1101px){
  ::-webkit-scrollbar{width:10px;height:10px}
  ::-webkit-scrollbar-track{background:#fff}
  ::-webkit-scrollbar-thumb{background:#cfd6df;border-radius:999px;border:2px solid #fff}
  ::-webkit-scrollbar-thumb:hover{background:#b6bfcb}
}

/* ⑫ 首页·房源中心上排图卡（原来直角、鼠标移上去毫无反馈；JS 侧给 <a> 加了 class="hf-imgcard"） */
.hf-imgcard{border-radius:var(--r-md);transition:box-shadow var(--dur) var(--ease),transform var(--dur) var(--ease),border-color var(--dur) var(--ease)}
.hf-imgcard:hover{border-color:#cfe0f5;box-shadow:var(--sh-2);transform:translateY(-3px)}
.hf-imgcard:hover div:first-child{filter:brightness(1.04)}

/* ⑬ 首页版面宽度统一（2026-09-25 龚总指出"丁字型"）
   病根：同一页上并存 4 种内容宽——顶部四行 1248 / 资讯·横幅·房源 1152（.wrap 64px）/
        区域找房行与页脚底栏 1280（无内边距）→ 上宽下窄，视觉上像"丁"字。
   做法：首页统一到与顶部同宽（1280 容器 + 16px 内边距 = 内容 1248）；
        只用 padding-left/right，避免把顶部各行的纵向内边距一起冲掉。 */
.pg-home .wrap{padding-left:16px;padding-right:16px}
.pg-home .hf-arearow{padding-left:16px;padding-right:16px}

/* ⑭ 全站版面宽度对齐（2026-09-25 龚总"对齐"）：所有页面的 .wrap 统一 1280 容器 + 16px 内边距 = 内容 1248
   与首页顶部同宽；各页自己写的 .wrap{padding:0 40px} 之类被本规则压过（同为 .wrap，本表注入在页面 <style> 之后） */
.wrap{padding-left:16px;padding-right:16px}

/* ⑮ 页脚各栏与嵌套容器的宽度补齐（2026-09-25 全站对齐第二批）
   ① 页脚底栏 .wrap 原本无左右内边距（1280）→ 比其它栏宽 32px
   ② 详情页的 .footer-cta/.footer-contact 的 .wrap 没写 max-width → 铺满 1360，比页面还宽
   ③ 嵌套的 .wrap 会叠加第二道内边距（房源列表页免责声明区因此又缩了一圈）→ 内层不再重复留边 */
.footer-btm .wrap{padding-left:16px;padding-right:16px}
.footer-cta .wrap,.footer-contact .wrap{max-width:1280px;margin-left:auto;margin-right:auto}
.wrap .wrap{padding-left:0;padding-right:0}

/* ⑯ 全站容器宽度统一（2026-09-25 龚总"对齐"收尾）
   发布页 800 / 个人中心 800 / 经纪人页 1000 都各自收窄 → 与首页统一为 1280 容器 + 16px 内边距 = 内容 1248
   （发布页表单本身是 .form-row{1fr 1fr} 两列栅格，拉宽后正好两列铺满，手机端自动回落单列） */
.wrap{max-width:1280px}

/* ⑰ 发布页 .page-wrap .wrap 的 800px 上限（选择器优先级比裸 .wrap 高，需单独压） */
.page-wrap .wrap{max-width:1280px}

/* ⑱ 地图找房页：它用自有类名 .nav-inner/.page-wrap（max-width 1400）→ 与全站对齐到 1280/1248
   （页面 <body> 已加 class="pg-map" 作钩子，只影响这一页） */
.pg-map .nav-inner,.pg-map .page-wrap{max-width:1280px;margin-left:auto;margin-right:auto;padding-left:16px;padding-right:16px}

/* ⑲ 顶栏容器 .nav-inner 在若干页面各写各的内边距（40/24/20px）→ 统一 16px，内容宽与全站一致 1248 */
.nav-inner{padding-left:16px;padding-right:16px}
