/* =====================================================================
   petct-new 全站补充样式（基于 pet-mri.net pmri.css 之上）
   主色：#0aa0a0（青绿） 强调：#ff7d3c（橙） 深色：#222b33
   ===================================================================== */

/* ---------- 品牌/导航 ---------- */
.brand { display: inline-flex; align-items: center; gap: 10px; }
.brand .brand-name { font-size: 22px; font-weight: 800; color: var(--c-primary, #0aa0a0); }
.header-contact { display: flex; align-items: center; gap: 18px; }
.hotline { display: inline-flex; align-items: center; gap: 6px; color: #ff7d3c; font-size: 20px; font-weight: 800; text-decoration: none; }
.hotline .ico-tel { width: 22px; height: 22px; display: inline-block; }
.hotline:hover { color: #ff7d3c; text-decoration: none; }

/* 搜索框（头部/搜索页） */
.search-box { position: relative; }
.search-box form { display: flex; align-items: center; }
.search-input { height: 34px; border: 1px solid #e2e8f0; border-radius: 17px; padding: 0 34px 0 14px; font-size: 13px; outline: none; width: 170px; transition: width .25s; box-sizing: border-box; }
.search-input:focus { width: 210px; border-color: #0aa0a0; }
.search-btn { position: absolute; right: 0; top: 0; width: 34px; height: 34px; border: 0; background: transparent; color: #0aa0a0; cursor: pointer; }
.search-form { display: flex; gap: 8px; margin-bottom: 18px; }
.search-form .search-input { width: 300px; height: 40px; border-radius: 6px; }
.search-summary { color: #667; margin-bottom: 14px; }

/* ---------- Hero Banner ---------- */
.hero-banner { padding: 22px 0 8px; }
.hero-banner-slides { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.hero-banner-slides.single { grid-template-columns: 1fr; }
.hero-slide { position: relative; display: block; border-radius: 10px; overflow: hidden; box-shadow: 0 4px 16px rgba(15, 60, 70, .08); }
.hero-slide-img { width: 100%; height: 220px; object-fit: cover; display: block; }
.hero-title { font-size: 24px; }
.hero-subtitle { font-size: 14px; }
.hero-slide-mask { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; background: linear-gradient(180deg, rgba(2,46,58,.15), rgba(2,46,58,.55)); color: #fff; text-align: center; }
.hero-title { font-size: 34px; font-weight: 800; margin-bottom: 8px; text-shadow: 0 2px 10px rgba(0,0,0,.4); }
.hero-subtitle { font-size: 16px; opacity: .95; }
@media (max-width: 767px) {
  .hero-banner-slides { grid-template-columns: 1fr; }
  .hero-slide-img { height: 200px; }
  .hero-title { font-size: 22px; }
}

/* ---------- 区块标题 ---------- */
.section-title.left { text-align: left; }
.section-title.with-more { display: flex; justify-content: space-between; align-items: flex-end; }
.section-more { color: #ff7d3c; font-weight: 600; text-decoration: none; white-space: nowrap; }
.section-more:hover { color: #e66a24; text-decoration: none; }

/* ---------- 城市选择 ---------- */
.city-grid { display: flex; flex-wrap: wrap; gap: 10px; }
.city-grid { display: flex; flex-wrap: wrap; gap: 8px; }
.city-card { display: inline-flex; align-items: baseline; gap: 4px; background: #fff; border: 1px solid #dfe7ea; border-radius: 6px; padding: 6px 14px; box-shadow: 0 1px 3px rgba(15,60,70,.05); font-size: 14px; color: #2a3640; text-decoration: none; transition: all .2s; }
.city-card .city-name { font-weight: 600; }
.city-card .city-count { color: #7c8794; font-size: 12px; }
.city-card:hover { transform: translateY(-2px); box-shadow: 0 4px 10px rgba(15,60,70,.12); border-color: #0aa0a0; color: #0aa0a0; text-decoration: none; }
.city-card:hover .city-count { color: #0aa0a0; }

/* ---------- 推荐医院卡片（首页） ---------- */
.hospital-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; }
.hospital-card { display: block; background: #fff; border: 1px solid #eef3f3; border-radius: 8px; overflow: hidden; box-shadow: 0 2px 8px rgba(15,60,70,.06); transition: transform .2s, box-shadow .2s; text-decoration: none; color: #222b33; }
.hospital-card:hover { transform: translateY(-4px); box-shadow: 0 10px 24px rgba(15,60,70,.14); text-decoration: none; }
.hospital-img { display: block; height: 116px; background-size: cover; background-position: center; background-color: #eef3f3; }
.hospital-body { display: block; padding: 8px 9px; }
.hospital-title { display: block; font-size: 14px; font-weight: 700; color: #222b33; line-height: 1.45; min-height: 2.9em; overflow: hidden;
  display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; }
.hospital-desc { display: block; font-size: 12px; color: #8a94a0; margin: 6px 0; height: 34px; overflow: hidden; line-height: 1.5; }
.hospital-meta { display: flex; align-items: center; }
.hospital-level { font-size: 11px; color: #0aa0a0; background: rgba(10,160,160,.1); padding: 2px 8px; border-radius: 3px; }
@media (max-width: 991px) { .hospital-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 600px) { .hospital-grid { grid-template-columns: repeat(2, 1fr); } }

/* ---------- 注意事项 ---------- */
.notice-card { background: #fafcfc; border: 1px solid #eef3f3; border-radius: 10px; padding: 22px; }
.notice-icon { width: 52px; height: 52px; border-radius: 50%; background: linear-gradient(135deg, #0aa0a0, #0c7f83); color: #fff; font-size: 24px; display: flex; align-items: center; justify-content: center; margin-bottom: 14px; }
.notice-card:nth-child(2) .notice-icon { background: linear-gradient(135deg, #ff9a4d, #ff7d3c); }
.notice-card:nth-child(3) .notice-icon { background: linear-gradient(135deg, #e5685a, #e53935); }
.notice-card:nth-child(4) .notice-icon { background: linear-gradient(135deg, #2f8f8b, #1f6f6b); }
.notice-card-title { font-size: 16px; font-weight: 700; margin-bottom: 10px; color: #222b33; }
.notice-list { margin: 0; padding-left: 18px; color: #5c6670; font-size: 13px; line-height: 1.9; }
.notice-list li { margin-bottom: 4px; }

/* ---------- 四大用途 ---------- */
.purpose-card { background: #fff; border: 1px solid #eef3f3; border-radius: 10px; padding: 26px 22px; text-align: center; transition: transform .2s; }
.purpose-card:hover { transform: translateY(-4px); }
.purpose-icon { width: 62px; height: 62px; margin: 0 auto 14px; border-radius: 50%; background: linear-gradient(135deg, #0aa0a0, #0c7f83); color: #fff; font-size: 28px; display: flex; align-items: center; justify-content: center; }
.purpose-card:nth-child(2) .purpose-icon { background: linear-gradient(135deg, #ff9a4d, #ff7d3c); }
.purpose-card:nth-child(3) .purpose-icon { background: linear-gradient(135deg, #e5685a, #e53935); }
.purpose-card:nth-child(4) .purpose-icon { background: linear-gradient(135deg, #2f8f8b, #1f6f6b); }
.purpose-title { font-size: 18px; font-weight: 700; margin-bottom: 10px; color: #222b33; }
.purpose-text { color: #5c6670; font-size: 13px; line-height: 1.8; }

/* ---------- 资讯列表（列表页/搜索页） ---------- */
.news-list { display: flex; flex-direction: column; }
.news-list-item { padding: 18px 0; border-bottom: 1px dashed #e6ecec; }
.news-list-item:last-child { border-bottom: 0; }
.news-list-title { display: block; font-size: 16px; font-weight: 700; color: #222b33; text-decoration: none; line-height: 1.5; }
.news-list-title:hover { color: #0aa0a0; text-decoration: none; }
.news-list-desc { color: #7c8794; font-size: 13px; margin: 6px 0 4px; line-height: 1.7; }
.news-list-date { color: #a0a9b4; font-size: 12px; }

/* ---------- 空状态 ---------- */
.empty-box { text-align: center; color: #99a3ad; padding: 60px 20px; border: 1px dashed #e2e8f0; border-radius: 8px; }

/* ---------- 分页 ---------- */
.pagination-wrap { margin: 28px 0 10px; }

/* ---------- 侧栏预约热线卡片 ---------- */
.side-contact { padding: 4px 0; }
.side-phone { padding: 14px 16px; border: 1px dashed #ffbf99; border-radius: 8px; background: #fff9f4; display: flex; flex-direction: column; align-items: flex-start; gap: 4px; margin-bottom: 12px; }
.side-phone-label { color: #a8643c; font-size: 13px; }
.side-phone-num { font-size: 22px; color: #e67238; font-weight: 800; letter-spacing: .5px; text-decoration: none; }
.side-tip { margin: 2px 2px 0; font-size: 13px; color: #667; line-height: 1.6; }
.side-btn { display: block; text-align: center; background: #ff7d3c; color: #fff; border-radius: 6px; padding: 10px; font-weight: 700; text-decoration: none; transition: background .2s; }
.side-btn:hover { background: #e66a24; color: #fff; text-decoration: none; }

/* 侧栏微信咨询 */
.side-card .side-wx-body { text-align: center; padding: 6px 0; }
.side-wx-body img { width: 150px; height: 150px; object-fit: contain; border: 1px solid #eef3f3; border-radius: 8px; background: #fff; padding: 4px; }
.side-wx-body p { margin: 8px 0 0; font-size: 12px; color: #7c8794; line-height: 1.7; }
.side-wx-body .wx-tel { color: #ff7d3c; font-weight: 700; }

/* ---------- 医院详情页 ---------- */
.hospital-detail-img { width: 100%; border-radius: 8px; }
.hospital-badges { display: flex; flex-direction: column; gap: 6px; margin: 10px 0 0; padding: 0; list-style: none; }
.hospital-badges li { font-size: 12px; color: #5c6670; display: flex; align-items: center; gap: 6px; }
.badge-icon { width: 16px; height: 16px; border-radius: 50%; background: #0aa0a0; color: #fff; font-size: 10px; display: inline-flex; align-items: center; justify-content: center; }
.hospital-info-right { text-align: center; padding: 8px; }
.hospital-wechat { width: 130px; height: 130px; object-fit: contain; border: 1px solid #eef3f3; border-radius: 8px; }
.hospital-phone { font-size: 12px; color: #7c8794; margin: 8px 0 0; line-height: 1.6; }
.hospital-phone strong { color: #ff7d3c; }

/* 医院介绍 */
.hospital-intro { margin-top: 22px; }
.hospital-intro-title { font-size: 20px; font-weight: 700; color: #222b33; margin: 0 0 14px; padding-left: 12px; border-left: 4px solid #0aa0a0; }

/* 预约卡片 */
.booking-form-section { margin-top: 22px; }
.booking-card { background: #fff; border: 1px solid #eef3f3; border-radius: 10px; padding: 24px; box-shadow: 0 4px 18px rgba(15,60,70,.07); }
.booking-title { font-size: 18px; font-weight: 700; margin-bottom: 18px; color: #222b33; }
.booking-title::before { content: ''; display: inline-block; width: 4px; height: 18px; background: #0aa0a0; margin-right: 8px; vertical-align: -3px; }

/* 表单两列紧凑布局 */
.booking-form .yy-row { display: flex; gap: 16px; }
.booking-form .yy-col { flex: 1; min-width: 0; }
.booking-form .form-row { display: flex; align-items: flex-start; margin-bottom: 14px; }
.booking-form .form-row > label { flex: 0 0 86px; padding-top: 10px; font-size: 14px; color: #5c6670; }
.booking-form .form-controls { flex: 1; min-width: 0; }
.form-input { width: 100%; height: 42px; border: 1px solid #dde6e6; border-radius: 6px; padding: 0 12px; font-size: 14px; outline: none; transition: border-color .2s; box-sizing: border-box; }
textarea.form-input { height: auto; padding: 10px 12px; resize: vertical; }
.form-input:focus { border-color: #0aa0a0; }
.radio-label { display: inline-flex; align-items: center; gap: 4px; margin-right: 14px; padding-top: 10px; color: #5c6670; cursor: pointer; }
.booking-form .form-submit-row { margin-bottom: 0; }
@media (max-width: 640px) {
  .booking-form .yy-row { flex-direction: column; gap: 0; }
  .booking-form .form-row { flex-direction: column; }
  .booking-form .form-row > label { flex: none; padding-top: 0; margin-bottom: 6px; }
  .search-form .search-input { width: 100%; }
}
/* 手机端预约表单填写框拉宽到边 */
@media (max-width: 767px) {
  .booking-card { padding: 14px 12px; }
  .booking-form .form-row { margin-bottom: 12px; }
  .booking-form .form-row > label { flex: 0 0 100%; padding: 0 0 6px; font-size: 14.5px; }
  .booking-form .form-controls { flex: 1 1 100%; }
  .form-input { padding: 0 12px; font-size: 15px; height: 44px; }
  textarea.form-input { padding: 10px 12px; }
  .booking-form-section { padding: 0 4px; }
}

/* 提交结果提示 */
.yy-msg { margin-top: 12px; padding: 10px 14px; border-radius: 6px; font-size: 14px; }
.yy-msg-ok { background: #e7f6f3; color: #0c7f83; border: 1px solid #c2ebe3; }
.yy-msg-err { background: #fdf0ee; color: #d6453d; border: 1px solid #f6cfcb; }

/* ---------- 推荐医院（详情页底部） ---------- */
.recommend-hospitals { margin-top: 30px; }
.recommend-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; }
.recommend-card { display: block; background: #fff; border: 1px solid #eef3f3; border-radius: 8px; overflow: hidden; text-align: center; text-decoration: none; transition: transform .2s, box-shadow .2s; }
.recommend-card:hover { transform: translateY(-3px); box-shadow: 0 8px 20px rgba(15,60,70,.12); text-decoration: none; }
.recommend-card img { width: 100%; height: 90px; object-fit: cover; }
.recommend-card h4 { font-size: 13px; font-weight: 600; color: #222b33; padding: 8px 6px; margin: 0; line-height: 1.4; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
@media (max-width: 991px) { .recommend-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 600px) { .recommend-grid { grid-template-columns: repeat(2, 1fr); } }

/* ---------- 文章正文 ---------- */
.article-header { text-align: center; padding: 10px 0 16px; }
.article-meta { color: #9aa3ad; font-size: 13px; margin-bottom: 6px; }
.article-meta span { margin: 0 10px; }
.article-body { line-height: 2; color: #3d4750; font-size: 15px; }
.article-body img { max-width: 100%; height: auto; border-radius: 6px; }
.article-body table { width: 100%; border-collapse: collapse; margin: 12px 0; }
.article-body table td, .article-body table th { border: 1px solid #e2e8f0; padding: 8px; }
.article-body h1, .article-body h2, .article-body h3 { color: #222b33; }
.article-prevnext { display: flex; justify-content: space-between; margin-top: 26px; padding-top: 16px; border-top: 1px solid #eef3f3; font-size: 13px; color: #5c6670; }
.article-prevnext .pn { max-width: 48%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: #5c6670; text-decoration: none; }
.article-prevnext .pn:hover { color: #0aa0a0; }

/* ---------- 网站地图 ---------- */
.sitemap .section-title { margin-bottom: 20px; }
.sitemap-group { margin-bottom: 26px; }
.sitemap-group-title { font-size: 17px; font-weight: 700; margin-bottom: 12px; color: #222b33; border-left: 4px solid #0aa0a0; padding-left: 10px; }
.sitemap-tags { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; padding: 0; margin: 0; }
.sitemap-tags li a { display: inline-block; padding: 6px 14px; background: #f2f8f7; color: #26474d; border-radius: 4px; font-size: 13px; text-decoration: none; }
.sitemap-tags li a:hover { background: #0aa0a0; color: #fff; }
.sitemap-city { margin-bottom: 14px; }
.sitemap-city-name { font-size: 15px; font-weight: 700; margin-bottom: 6px; }
.sitemap-city-name a { color: #0aa0a0; text-decoration: none; }
.sitemap-city-list { display: flex; flex-wrap: wrap; gap: 6px 18px; list-style: none; padding: 0; margin: 0; }
.sitemap-city-list li a { color: #5c6670; font-size: 13px; text-decoration: none; }
.sitemap-city-list li a:hover { color: #0aa0a0; }

/* ---------- layui 表单控件微调 ---------- */
.layui-form-select dl { z-index: 99; }

/* ---------- 响应式补充 ---------- */
@media (max-width: 767px) {
  /* 手机端页眉：预约电话醒目显示（不隐藏 header-contact） */
  .header-contact { display: flex; flex-direction: column; align-items: stretch; gap: 8px; }
  .hotline { order: 1; justify-content: center; text-align: center; font-size: 16px; font-weight: 800;
    color: #ff7d3c; background: #fff5ec; border: 1px solid #ffd1b5; border-radius: 6px; padding: 8px 12px; }
  .search-box { order: 2; }
  .search-box form { width: 100%; }
  .article-prevnext { flex-direction: column; gap: 6px; }
}

/* 手机端页眉电话样式（窄屏优化） */
@media (max-width: 480px) {
  .hotline { font-size: 15px; padding: 7px 10px; }
}

/* ---------- 立即预约按钮小号单行 ---------- */
.list-card-footer { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding-top: 12px; margin-top: auto; border-top: 1px dashed #e6ecec; flex-wrap: nowrap; }
.list-card-price { font-size: 17px; font-weight: 700; color: #e53935; white-space: nowrap; }
.list-card-price small { font-size: 12px; font-weight: 400; }
.list-card-book { display: inline-block; padding: 5px 14px; background: #0aa0a0; color: #fff; font-size: 13px; font-weight: 600; border-radius: 5px; text-decoration: none; transition: all .2s; white-space: nowrap; }
.list-card-book:hover { background: #0c7f83; }

/* ---------- 页脚电话白色加粗 ---------- */
.site-footer .footer-info a { color: #fff; font-weight: 700; }
.site-footer .footer-info a:hover { color: #ff9a4d; text-decoration: underline; }


/* ---------- 首页资讯合并单块 ---------- */
.news-grid-wrap.single { grid-template-columns: 1fr; }
.news-grid-wrap.single .news-block { padding-right: 0; border-right: 0; }
.news-grid-wrap.single .news-item-title { font-size: 15px; }

/* 面包屑当前栏目（纯文本，无链接） */
.crumb-here { color: var(--c-primary, #0aa0a0); }