*{margin:0;padding:0;box-sizing:border-box;font-family:"Microsoft Yahei",sans-serif;}
body{background:#f5f5f5;padding:20px 0;}
.wrap{width:670px;margin:0 auto;background:#fff;padding:20px;border-radius:6px;}

/* 顶部导航（防孤页） */
.top-nav{margin-bottom:15px;padding-bottom:10px;border-bottom:1px solid #eee;}
.top-nav a{color:#0066cc;text-decoration:none;font-size:14px;}
.top-nav span{margin:0 8px;color:#999;}

/* 首页搜索框 */
.search-box{margin:20px 0 30px;}
.search-input{
	width:100%;
	height:46px;
	border:1px solid #ddd;
	border-radius:6px;
	padding:0 15px;
	font-size:15px;
	outline:none;
}
.search-input:focus{border-color:#0066cc;}

/* 首页推荐标题 */
.recommend-title{
	font-size:18px;
	margin-bottom:15px;
	padding-left:10px;
	border-left:4px solid #0066cc;
}

/* 首页推荐楼盘（卡片网格） */
.recommend-list{
	display:grid;
	grid-template-columns:repeat(2,1fr);
	gap:15px;
	margin-bottom:30px;
}
.recommend-item{
	position: relative;
	overflow: hidden;
	background:#fafafa;
	border-radius:8px;
	transition:0.2s;
}
.recommend-item:hover{
	background:#f2f7ff;
	transform:translateY(-2px);
}

/* PC端图片：高度自适应，不固定 */
.recommend-img{
	width:100%;
	object-fit:cover;
	display:block;
}

/* 图片底部40%纯色半透蒙版 */
.recommend-item::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 40%;
	background: rgba(255,255,255,0.75);
	pointer-events: none;
}

/* 文字定位在蒙版上 */
.recommend-info {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	padding:8px;
	z-index:2;
}
.recommend-name{
	font-size:20px;
	color:#ea6302;
	margin-bottom:6px;
	white-space:nowrap;
	overflow:hidden;
	font-weight:bold;
}
.recommend-desc{
	font-size:16px;
	color:#222;
}

/* ======================
【新版列表样式：无分隔线 + 独立卡片 + 留白间距】
====================== */
.list-item{
  display:flex;
  gap:15px;
  padding:15px;
  margin-bottom:12px;
  border-radius:8px;
  background:#fafafa;
  transition:all 0.2s;
}
.list-item:hover{
  background:#f2f7ff;
}

.item-img{
  width:160px;
  height:110px;
  flex-shrink:0;
  border-radius:6px;
  overflow:hidden;
}
.item-img img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.item-info{flex:1;}
.item-title a{
  font-size:17px;
  color:#222;
  text-decoration:none;
  display:block;
  margin-bottom:8px;
  line-height:1.4;
}
.item-title a:hover{color:#0066cc;}
.item-desc{
  font-size:13px;
  color:#666;
  line-height:1.6;
  margin-bottom:10px;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.item-view{font-size:12px;color:#999;}
.item-view strong {color:#0066cc;font-weight:normal;}

/* 详情页 */
.detail-top img{width:100%;height:320px;object-fit:cover;border-radius:6px;margin-bottom:15px;}
.detail-title{font-size:22px;color:#222;margin-bottom:12px;}
.detail-info{color:#777;font-size:14px;margin-bottom:15px;line-height:1.8;}
.detail-content{line-height:1.8;font-size:15px;color:#333;margin:25px 0;}

/* 呼吸电话按钮 */
.tel-btn{
  display:block;
  width:220px;
  text-align:center;
  line-height:46px;
  background:#ff4444;
  color:#fff;
  text-decoration:none;
  border-radius:50px;
  margin:30px auto;
  font-size:16px;
  animation:breath 2.2s infinite ease-in-out;
}
@keyframes breath{
  0%{transform:scale(1);box-shadow:0 0 0 0 rgba(255,68,68,0.4);}
  50%{transform:scale(1.05);box-shadow:0 0 12px 8px rgba(255,68,68,0.2);}
  100%{transform:scale(1);box-shadow:0 0 0 0 rgba(255,68,68,0.4);}
}

/* 移动端 */
@media(max-width:670px){
  .wrap{width:calc(100% - 20px);padding:15px;}
  
  /* 手机端：左图右文，图片完整显示 */
  .recommend-list{
    grid-template-columns:1fr;
    gap:12px;
  }
  .recommend-item{
    display: flex;
    align-items: center;
    padding:0;
  }
  .recommend-img{
    width:120px;
    height:80px;
    flex-shrink:0;
    border-radius:6px;
  }
  .recommend-item::after{
    display:none;
  }
  .recommend-info{
    position:static;
    padding:10px;
    flex:1;
  }
  .recommend-name{
    font-size:16px;
  }
  .recommend-desc{
    font-size:12px;
  }

  .list-item{flex-direction:column;}
  .item-img{width:100%;height:180px;}
  .detail-top img{height:220px;}
}