* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: "PingFang SC", "Microsoft YaHei", sans-serif;
    background: #ffffff;
}

/* 整体居中容器 控制整体缩小居中 */
.wrap {
    max-width: 1280px;
    margin: 0 auto;
    overflow: hidden;
    padding: 0 15px; /* 移动端增加左右内边距，避免内容贴边 */
}

/* ========== PC端四宫格布局 ========== */
.pc-ad-grid {
    display: grid;
    /* 2列四宫格 */
    grid-template-columns: 1fr 1fr;
    width: 100%;
}
.pc-ad-grid .ad-item {
    width: 100%;
    overflow: hidden;
}
.pc-ad-grid .ad-item img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    display: block;
    transition: transform 0.3s;
}
.pc-ad-grid .ad-item img:hover {
    transform: scale(1.02);
}

/* ========== 移动端长图布局 ========== */
.mobile-ad-single {
    width: 100%;
    display: none;
    overflow: hidden;
}
.mobile-ad-single img {
    width: 100%;
    height: 80px;
    display: block;
}

/* ========== 响应式切换：小于768px手机端 ========== */
@media (max-width: 768px) {
    /* 手机端隐藏PC四宫格 */
    .pc-ad-grid {
        display: none;
    }
    /* 手机端显示单独长广告图 */
    .mobile-ad-single {
        display: block;
    }
}

.page-wrap {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 20px;
    padding: 20px 0; /* 增加上下间距，区分板块 */
}

/* ========= 左侧医院列表 ========= */
.hospital-wrap {}
.hospital-item {
    display: flex;
    gap: 20px;
    padding: 24px 0;
    border-bottom: 1px dashed #dddddd;
}
.hospital-item:last-child {
    border-bottom: none;
}

/* 医院头像 */
.hospital-avatar {
    width: 130px;
    height: 130px;
    /*background: #eeeeee;*/
    flex-shrink: 0;
    object-fit: cover;
}

.hospital-main {
    flex: 1;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}
.hospital-left-info {}

/* 标题+推荐标签 同行 */
.title-row {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
}
.red-recommend-tag {
    background: #ff2b2b;
    color: #fff;
    font-size: 15px;
    font-weight: bold;
    padding: 3px 9px;
    border-radius: 4px;
}
.hospital-name {
    font-size: 20px;
    font-weight: bold;
    color: #111;
}

.meta-text {
    font-size: 14px;
    color: #666;
    margin-bottom: 10px;
}
.meta-text span {
    margin-right: 18px;
}

/* ✅ 医院简介：固定宽度，控制换行 */
.hospital-desc {
    max-width: 720px;
    width: 100%;
    font-size: 14px;
    color: #555;
    line-height: 1.6;
    margin-bottom: 10px;
    word-break: break-all;
}
.skill-text {
    color: #b820a8;
    font-size: 16px;
    font-weight: bold;
}

.btn-right-box {
    display: flex;
    align-items: center;
    height: 100%;
    padding-top: 4px;
    margin-left: 25px;
}
.btn-view {
    background: #39b54a;
    color: #fff;
    border: none;
    padding: 6px 15px;
    border-radius: 5px;
    font-size: 15px;
    font-weight: bold;
    text-decoration: none;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
}

/* ========== 右侧新闻列表 ========== */
.news-right {}
.news-item {
    display: flex;
    /* 关键：从默认顶部对齐，改成整体垂直居中对齐 */
    align-items: center;
    gap: 12px;
    padding: 18px 0;
    border-bottom: 1px solid #eee;
}
.news-item:last-child {
    border-bottom: none;
}
.news-text-box {
    flex: 1;
}
.news-title-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 8px;
    margin-bottom: 6px;
}
.news-title {
    font-size: 14px;
    color: #333;
    line-height: 1.5;
}
.badge-top {
    color: #ff0000;
    border: 1px solid #ff0000;
    font-size: 14px;
    font-weight: bold;
    padding: 1px 5px;
    border-radius: 2px;
    flex-shrink: 0;
}
.news-time {
    font-size: 12px;
    color: #999;
    margin: 6px 0;
}
.news-desc {
    font-size: 12px;
    color: #737373;
    line-height: 1.6;
}
.news-side-img {
    width: 135px;
    height: 135px;
    object-fit: cover;
    flex-shrink: 0;
}

/* ========== 移动端手机端适配（核心修改） ========== */
@media (max-width:768px) {
    .page-wrap {
        grid-template-columns: 1fr !important;
        gap: 30px !important;
    }

    .hospital-item {
        flex-direction: column;
        gap: 15px !important;
        padding: 15px 0 !important;
    }
    .hospital-avatar {
        width: 100% !important; /* 头像占满宽度 */
        height: 180px !important; /* 增大高度，提升视觉 */
    }
    .hospital-main {
        flex-direction: column; /* 医院信息和按钮垂直排列 */
        gap: 15px;
    }
    .hospital-name {
        font-size: 18px !important; /* 适配手机字体大小 */
    }
    .red-recommend-tag {
        font-size: 13px !important;
        padding: 2px 7px !important;
    }
    .meta-text span {
        margin-right: 10px !important; /* 减小间距 */
        font-size: 13px !important;
    }
    .hospital-desc {
        max-width: 100% !important; /* 手机端取消宽度限制 */
        font-size: 13px !important;
    }
    .skill-text {
        font-size: 14px !important;
    }
    .btn-right-box {
        align-items: flex-start !important; /* 按钮左对齐 */
        padding-top: 0 !important;
    }
    .btn-view {
        position: static !important; /* 取消右上角悬浮定位 */
        width: fit-content !important;
        margin: 0 auto !important;
        display: block !important;
        background: #28a745 !important;
        color: #fff !important;
        border: none !important;
        padding: 6px 20px !important;
        border-radius: 20px !important;
        font-size: 15px !important;
        text-align: center !important;
    }

    /* 3. 优化新闻列表移动端展示 */
    .news-item {
        flex-direction: column-reverse !important; /* 图片在上，文字在下 */
        gap: 12px !important;
        padding: 15px 0 !important;
    }
    .news-side-img {
        width: 100% !important; /* 图片占满宽度 */
        height: 150px !important; /* 增大高度 */
    }
    .news-title {
        font-size: 12px !important; /* 增大标题字体 */
    }
    .badge-top {
        font-size: 12px !important;
        padding: 1px 4px !important;
    }
    .news-time {
        font-size: 12px !important;
    }
    .news-desc {
        font-size: 12px !important;
    }

    /* 4. 广告图适配 */
    .mobile-ad-single img {
        height: 100px !important; /* 适度增大移动端广告高度 */
    }
}


/* 企业详情 */
.hospital-detail-card {
    max-width: 1300px;
    margin: 0 auto;
    display: flex;
    gap: 50px;
    align-items: flex-start;
}

/* 左侧医院LOGO图片 */
.hospital-logo-box {
    flex-shrink: 0;
}
.hospital-logo {
    width: 220px;
    height: auto;
    object-fit: contain;
    display: block;
}

/* 右侧文字信息区域 */
.hospital-info-box {
    flex: 1;
    width: 100%;
}

/* 医院标题 */
.hospital-title {
    font-size: 20px;
    font-weight: bold;
    color: #222;
    margin-bottom: 15px;
    line-height: 1.2;
}

/* 上传&时间行 */
.top-meta-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 18px;
    flex-wrap: wrap;
    gap: 10px;
}
.upload-text {
    font-size: 14px;
    color: #666;
}
.upload-text .username {
    color: #40d9b8;
    font-weight: 500;
    margin: 0 6px;
}
.edit-link {
    color: #40d9b8;
    text-decoration: none;
    margin-left: 8px;
}
.publish-time {
    font-size: 14px;
    color: #666;
    white-space: nowrap;
}

/* 基础信息单行 */
.info-row {
    font-size: 14px;
    color: #444;
    margin: 12px 0;
    line-height: 1;
}

/* 擅长项目标签组 */
.skill-row {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin: 18px 0;
    flex-wrap: wrap;
}
.skill-label {
    font-size: 14px;
    color: #444;
    white-space: nowrap;
}
.skill-tag-list {
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
}
.skill-tag {
    background: #f0f4f9;
    color: #4466aa;
    font-size: 12px;
    padding: 3px 12px;
    border-radius: 4px;
}

/* 许可证、地址行 */
.long-info-row {
    font-size: 14px;
    color: #666;
    margin: 10px 0;
    line-height: 1;
    word-break: break-all;
}

/* ========== 手机H5端专属适配 768px以下 ========== */
@media (max-width: 768px) {
    body {
        padding: 25px 15px;
    }
    /* 整体改为上下布局 */
    .hospital-detail-card {
        flex-direction: column;
        gap: 30px;
        align-items: center;
        text-align: left;
    }

    /* LOGO缩小适配 */
    .hospital-logo {
        width: 160px;
    }

    /* 字体整体缩小适配手机 */
    .hospital-title {
        font-size: 26px;
        text-align: center;
        margin-bottom: 15px;
    }
    .upload-text, .publish-time, .info-row, .skill-label, .long-info-row {
        font-size: 17px;
    }
    .skill-tag {
        font-size: 16px;
    }

    /* 顶部行改为上下排列 */
    .top-meta-row {
        flex-direction: column;
        align-items: flex-start;
    }

    /* 标签自动换行 */
    .skill-row {
        gap:8px;
    }
    .skill-tag-list {
        gap: 10px;
    }
}


/* 整体容器 */
.detail-container {
    max-width: 1200px;
    margin: 0 auto;
}

/* ========== 顶部标签导航栏 ========== */
.tab-nav {
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid #eee;
    margin-bottom: 30px;
    margin-top: 30px;
}
.tab-item {
    padding: 12px 8px;
    font-size: 18px;
    color: #555;
    cursor: pointer;
    position: relative;
    white-space: nowrap;
}
/* 当前选中高亮 */
.tab-item.active {
    color: #cc4482;
    font-weight: bold;
}
.tab-item.active::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background-color: #cc4482;
}
.tab-content {
    display: none;
}
.tab-content.active {
    display: block;
}

.section-title {
    font-size: 20px;
    font-weight: bold;
    color: #222;
    margin-bottom: 15px;
    padding-left: 10px;
    border-left: 4px solid #cc4482;
}
.intro-text {
    font-size: 15px;
    color: #444;
    line-height: 1.8;
    margin-bottom: 25px;
}
.info-line {
    font-size: 15px;
    color: #444;
    line-height: 1.8;
    margin: 8px 0;
}

.image-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin-top: 30px;
    margin-bottom: 30px;
}
.grid-img-box {
    width: 100%;
    overflow: hidden;
}
.grid-img-box img {
    width: 100%;
    height: 240px;
    object-fit: cover;
    display: block;
    transition: transform 0.3s;
}
.grid-img-box img:hover {
    transform: scale(1.03);
}

/* ========== 移动端H5适配（768px以下） ========== */
@media (max-width: 768px) {
    body {
        padding: 25px 15px;
    }
    /* 导航标签自动滚动，避免挤压 */
    .tab-nav {
        overflow-x: auto;
        gap: 15px;
        padding-bottom: 5px;
    }
    .tab-nav::-webkit-scrollbar {
        height: 3px;
    }
    .tab-item {
        font-size: 15px;
        padding: 10px 5px;
    }
    /* 图片改为单列上下排列 */
    .image-grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }
    .grid-img-box img {
        height: 200px;
    }
    /* 文字字号适配手机 */
    .section-title {
        font-size: 18px;
    }
    .intro-text, .info-line {
        font-size: 14px;
    }
}

.filter-card {
    background: #fff;
    padding: 0 30px;
    border-radius: 16px;
}
.filter-row {
    display: flex;
    align-items: flex-start;
    margin-bottom: 25px;
    gap: 15px;
    flex-wrap: wrap;
}
.row-label {
    font-size: 14px;
    font-weight: bold;
    white-space: nowrap;
    padding-top: 3px;
}
.tag-group {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}
.tag-item {
    padding: 5px 10px;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.2s;
    white-space: nowrap;
    font-size: 14px;
}
.tag-item.active {
    background: #dd2222;
    color: #fff;
    padding: 6px 16px;
}

/* 企业类型分类 */
.category-title {
    font-weight: bold;
    display: inline-block;
    margin-right: 10px;
    font-size: 14px;
}

/* 一级分类容器 */
.first-category {
    margin-bottom: 10px;
    display: inline-block;
    vertical-align: top;
}
.first-category a{
    color: inherit;
    text-decoration: inherit;
}

/* 二级分类容器 和 一级严格左对齐 */
.second-category {
    padding-left: 58px; /* 和左侧“类别:”文字宽度对齐 */
    margin-top: 10px;
}
.second-category a{
    color: inherit;
    text-decoration: inherit;
}

/* 通用标签按钮样式 */
.cate-tag {
    display: inline-block;
    padding: 5px 18px;
    border-radius: 4px;
    background: #fff;
    border: 1px solid #eee;
    cursor: pointer;
    font-size: 12px;
    white-space: nowrap;
}
/* 选中高亮样式 */
.cate-tag.active {
    background: #dd2727;
    color: #fff;
    border-color: #dd2727;
}
/* 移动端适配 */
@media (max-width:768px) {
    /* 筛选卡片整体适配 */
    .filter-card {
        padding: 0 15px !important;
        border-radius: 12px !important;
    }

    /* 地区筛选行适配 */
    .filter-row {
        margin-bottom: 20px !important;
        gap: 8px !important;
    }

    .row-label {
        font-size: 15px !important;
        padding-top: 0 !important;
        margin-bottom: 8px !important;
        width: 100% !important;
    }

    /* 地区标签适配 */
    .tag-group {
        gap: 3px !important;
    }

    .tag-item {
        font-size: 14px !important;
        padding: 6px 12px !important;
    }

    .tag-item.active {
        padding: 6px 14px !important;
    }

    /* 分类标题适配 */
    .category-title {
        font-size: 15px !important;
        margin-bottom: 8px !important;
        display: block !important;
    }

    /* 一级分类适配 */
    .first-category {
        display: flex !important;
        gap: 3px !important;
        flex-wrap: wrap !important;
        margin-bottom: 15px !important;
        width: 100% !important;
    }

    .cate-tag {
        font-size: 14px !important;
        padding: 5px 15px !important;
    }

    /* 二级分类适配 - 取消PC端的左对齐padding，改为全屏宽度 */
    .second-category {
        padding-left: 0 !important;
        margin-top: 0 !important;
        display: flex !important;
        gap: 3px !important;
        flex-wrap: wrap !important;
        width: 100% !important;
    }

    /* 主体内容间距适配 */
    .main-content {
        padding: 10px 0 !important;
    }

    /* 容器适配 */
    .wrap {
        padding: 0 10px !important;
    }
}

/* 企业列表 */
/* 整体左右两栏容器 */
.content-container {
    display: flex;
    width: 100%;
    gap: 20px;
    padding: 20px;
}
/* 左侧医院列表区域 */
.left-list {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 15px;
}
/* 单个医院卡片 */
.hospital-card {
    cursor: pointer;
    display: flex;
    padding: 15px;
    border-bottom: 1px dotted #ccc;
    background: #fff;
}
/* 左侧头像区域 */
.card-avatar {
    width: 120px;
    height: 120px;
    margin-right: 15px;
}
.card-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
/* 右侧内容信息区 */
.card-content {
    flex: 1;
}
/* 标题+推荐标签行 */
.card-title-wrap {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
}
/* 红色推荐标签 */
.tag-recommend {
    background: #ed3833;
    color: #fff;
    padding: 4px 10px;
    font-size: 14px;
    font-weight: bold;
    border-radius: 2px;
}
.hospital-name {
    font-size: 20px;
    font-weight: bold;
}
/* 医院基础信息行 */
.card-base-info {
    display: flex;
    align-items: center;
    gap: 15px;
    margin: 8px 0;
    font-size: 14px;
    color: #666;
}
.private-tag {
    color: #3377ee;
}
/* 黄色高亮电话样式 */
.tel {
    background: #ffff00;
    color: #ff0000;
    font-weight: bold;
    padding: 2px 6px;
}
/* 医院简介文本 */
.card-desc {
    font-size: 14px;
    color: #333;
    line-height: 1.6;
    margin: 10px 0;
}
/* 擅长项目紫色文字 */
.card-good-at {
    font-size: 14px;
    color: #cc00cc;
    font-weight: bold;
}

/* ========== 右侧长图区域 ========== */
.right-long-img {
    width: 25%;
    height: 100%;
}
.right-long-img img {
    width: 290px;
    height: 1450px;
    display: block;
    /* 适配长竖图，高度自适应铺满 */
}

/* ========== 移动端适配 仅768px以下手机生效 ========== */
@media screen and (max-width: 768px) {
    body {
        padding: 10px;
    }
    .hospital-card{
        cursor: pointer;
        display: flex;
        border-bottom: 1px dotted #ccc;
        background: #fff;
    }
    .content-container {
        padding: 0;
    }
    .tag-recommend,.card-base-info,.card-desc,.card-good-at {
        font-size: 8px;
    }
    .card-desc{
        line-height: 1.2;
        margin: 6px 0;
    }
    .right-long-img{
        display: none;
    }
    .hospital-item {
        flex-direction: column;
        padding: 15px;
    }
    .recommend-tag {
        right: 90px;
        font-size: 15px;
    }
    .detail-btn {
        font-size: 22px;
        right: 10px;
    }
    .hospital-img {
        width: 100%;
        height: 180px;
    }
    .hospital-name {
        font-size: 19px;
        margin-top: 10px;
    }
    .hospital-meta {
        flex-wrap: wrap;
        gap: 10px;
        font-size: 14px;
    }
    .tel-text {
        font-size: 12px;
    }
    .hospital-desc {
        font-size: 14px;
    }
    .good-at {
        font-size: 14px;
    }
}
@media screen and (max-width: 430px) {
    body {
        padding: 10px;
    }
    body {
        padding: 10px;
    }
    .right-long-img{
        display: none;
    }
    .hospital-card{
        cursor: pointer;
        display: flex;
        border-bottom: 1px dotted #ccc;
        background: #fff;
    }
    .hospital-item {
        flex-direction: column;
        padding: 15px;
    }
    .recommend-tag {
        right: 90px;
        font-size: 15px;
    }
    .detail-btn {
        font-size: 22px;
        right: 10px;
    }
    .hospital-img {
        width: 100%;
        height: 180px;
    }
    .hospital-name {
        font-size: 19px;
        margin-top: 10px;
    }
    .hospital-meta {
        flex-wrap: wrap;
        gap: 10px;
        font-size: 14px;
    }
    .tel-text {
        font-size: 12px;
    }
    .hospital-desc {
        font-size: 14px;
    }
    .good-at {
        font-size: 14px;
    }
}



/* 服务列表 */
.article-item {
    background: #ffffff;
    display: flex;
    gap: 20px;
    padding: 20px;
    margin-bottom: 15px;
    border-bottom: 1px solid #eee;
    position: relative;
}

/* 时间+浏览量行 */
.article-meta {
    display: flex;
    align-items: center;
    gap: 30px;
    font-size: 22px;
    color: #777;
    margin: 12px 0;
}
.view-icon {
    color: #88eeee;
}
.view-num {
    color: #4cd9cc;
}

@media screen and (max-width: 768px) {
    /* 基础重置 */
    html, body {
        font-size: 16px; /* 移动端基准字号 */
        overflow-x: hidden;
    }

    /* 容器适配 */
    .container {
        width: 100%;
        padding: 0;
        margin: 0;
    }

    .wrap {
        padding: 0 10px !important;
        max-width: 100% !important;
    }

    /* 主内容区适配 */
    .main-content {
        padding: 10px 0 !important;
    }

    /* ========== 文章卡片移动端优化 ========== */
    .article-item {
        flex-direction: column !important;
        padding: 15px !important;
        margin-bottom: 20px !important;
        border-radius: 8px;
        box-shadow: 0 2px 10px rgba(0,0,0,0.06);
    }

    /* 置顶标签 */
    .recommend-tag {
        position: static !important;
        display: inline-block !important;
        margin-bottom: 10px !important;
        padding: 4px 12px !important;
        font-size: 14px !important;
        border-radius: 4px !important;
    }

    /* 查看详情按钮 */
    .detail-btn {
        position: static !important;
        width: 100% !important;
        text-align: center !important;
        padding: 10px 0 !important;
        font-size: 16px !important;
        border-radius: 6px !important;
        margin-top: 15px !important;
        text-decoration: none;
    }

    /* 封面图 */
    .hospital-img {
        width: 100% !important;
        height: 200px !important;
        margin-bottom: 10px !important;
    }

    .hospital-img img {
        object-fit: cover !important; /* 优化图片显示 */
    }

    /* 标题 */
    .hospital-name {
        font-size: 12px !important;
        line-height: 1.2 !important;
        margin-bottom: 5px !important;
    }

    /* 元信息（时间/浏览量） */
    .hospital-meta {
        font-size: 14px !important;
        gap: 15px !important;
        margin: 8px 0 !important;
    }

    /* 描述文本 */
    .hospital-desc {
        font-size: 12px !important;
        line-height: 1.7 !important;
        margin-bottom: 10px !important;
        -webkit-line-clamp: 4 !important; /* 移动端多显示一行 */
    }

    /* 浏览量图标/数字 */
    .view-icon {
        font-size: 14px !important;
    }
    .view-num {
        font-size: 14px !important;
    }
}

/* ========== 修复PC端样式冲突 ========== */
/* 确保PC端样式不受移动端影响 */
@media screen and (min-width: 769px) {
    .article-item {
        display: flex !important;
        flex-direction: row !important;
        padding: 20px !important;
    }
    .recommend-tag {
        position: absolute !important;
        top: 20px;
        right: 120px;
    }
    .detail-btn {
        position: absolute !important;
        top: 20px;
        right: 20px;
    }
    .hospital-img {
        width: 160px !important;
        height: 160px !important;
    }
}

/* 服务详情 */
.detail-top{
    margin-bottom: 30px;
}
.main-title {
    font-size: 20px;
    color: #333333;
    font-weight: bold;
    margin-bottom: 12px;
    line-height: 1.4;
}

/* 发布信息行 */
.publish-info {
    font-size: 14px;
    color: #888888;
    margin-bottom: 30px;
    padding-bottom: 20px;
    border-bottom: 1px solid #eee;
}

/* 联系信息列表 */
.info-item {
    font-size: 14px;
    margin: 18px 0;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}
.label {
    color: #333;
    min-width: 70px;
}
.red-text {
    color: #dd2222;
    font-weight: bold;
    font-size: 14px;
}

/* 查看号码按钮 */
.show-phone-btn {
    display: inline-block;
    margin-left: 12px;
    padding: 6px 15px;
    border: 1px solid #dd2222;
    color: #dd2222;
    background: #fff;
    border-radius: 3px;
    cursor: pointer;
    font-size: 14px
}

/* 底部警示提示栏 */
.warn-box {
    margin-top: 20px;
    padding: 15px;
    background-color: #f8f8f8;
    border-radius: 4px;
    font-size: 14px;
    color: #444;
    line-height: 1.6;
    text-indent: 2em;
}

.footer-contact-bar{
    display: none;
}

@media screen and (max-width: 768px) {
    /* 底部固定容器 核心：固定在屏幕最底部 */
    .footer-contact-bar {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        width: 100%;
        height: 50px;
        display: flex;
        align-items: center;
        background: #fff;
        box-shadow: 0 -2px 10px rgba(0,0,0,0.08);
        z-index: 9999; /* 层级最高，永远悬浮在最上层 */
    }

    /* 左侧两个按钮 均分宽度 */
    .left-item {
        flex: 1;
        height: 80%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        cursor: pointer;
        background: #ffffff;
    }
    .left-item .icon {
        width: 25px;
        height: 25px;
        font-size: 14px;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .left-item .text {
        font-size: 16px;
        color: #333;
    }

    /* 右侧 拨打电话 通栏大按钮 */
    .call-btn {
        flex: 2;
        height: 100%;
        background-color: #ff5555;
        display: flex;
        justify-content: center;
        align-items: center;
        color: #ffffff;
        font-size: 18px;
        font-weight: bold;
        cursor: pointer;
    }

    /* 点击交互反馈 */
    .left-item:active, .call-btn:active {
        opacity: 0.9;
    }
}

.hidden {
    display: none;
}