/* ========================================
   新版底部 footer_new（替换旧 footer）
   设计稿 Pixso 0:1198 底部 2426×779 @1920
   框架结构：
   ┌─ .footer_new（#7A7880 淡灰底 = 设计 rgba(65,62,74,1)×0.7 叠白底，relative/overflow:hidden）
   │   .footer_new-bg      ← 水印大图（1920×338，35% 透明度已烧入 alpha，盖淡灰底）
   │   .footer_new-inner   ← 居中内容 1297px：flex 行
   │     .footer_new-left   ← 767px：品牌 + 3 城联系卡（横向一排）
   │     .footer_new-divider ← 白 0.75×228 竖线
   │     .footer_new-nav    ← 483px：5 列网格（grid-auto-flow:column 2 行 → 设计交错排布）
   │   .footer_new-copyright ← 红 #CA0015 39px 条：权威图标 + 备案/版权/隐私政策
   本文件为全局样式（layout.html head 加载），全站新 footer 生效。
   已含 1024/768/480 响应式（见文件底部）。
   ======================================== */

.footer_new {
  position: relative;
  /* 设计稿：bg 矩形 rgba(65,62,74,1) opacity 0.7，叠白色页面底
     → 实际显示色 rgb(122,120,128) = #7A7880（淡灰紫）
     ✗ 不能用不带透明度的 #413E4A（65,62,74），那会使整块偏深灰
     ✓ 水印纹理(footer-bg.png, 35% alpha 已烧入)叠于此色即得设计稿效果 */
  background: #7A7880;
  overflow: hidden;
}

/* ---- 背景水印（盖在深色区，z-index 0，不响应交互）----
   设计：bg 矩形 #413E4A 340 高 + 水印 STRETCH 铺满（Pixso imageScaleMode:STRETCH）。
   固定 height:340 使水印始终铺满整个导航背景区，不会在底部露出无纹理的纯色带。 */
.footer_new-bg {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 340px;
  z-index: 0;
  pointer-events: none;
  user-select: none;
  object-fit: cover;          /* 源图 1920×338；窄屏下 cover 裁切而非横向压扁 */
}

/* ---- 居中内容容器：左列 + 分割线 + 右列 ----
   内容高 236（设计 6:97）；顶 38 + 内容 236 + 底 66 = 340 = bg 高，水印全覆盖无平铺带 */
.footer_new-inner {
  position: relative;
  z-index: 1;
  max-width: 1297px;
  margin: 0 auto;
  display: flex;
  align-items: flex-start;
  padding: 38px 0 66px;
}

/* ---- 左列：品牌 + 3 城联系卡（767 固定） ---- */
.footer_new-left {
  flex: 0 0 767px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.footer_new-brand {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin-bottom: 25px;        /* 设计：品牌块 41 底 → 卡片顶 66，间距 25 */
}

.footer_new-brand-cn {
  font-size: 18px;
  font-weight: 700;
  color: #E5E5E5;
  letter-spacing: 2.52px;
  line-height: 20px;          /* 设计 box h27（Phase B 微调） */
}

.footer_new-brand-en {
  font-size: 16.76px;
  font-weight: 500;
  color: #E5E5E5;
  letter-spacing: 2.35px;
  line-height: 19px;
  margin-top: 1px;            /* 设计 en 顶 22.2（紧贴 cn 下缘） */
}

/* 3 城联系卡：横向一排（上海/青岛/成都），卡 224×133，卡距 43
   卡宽硬固定 224；标签列 60 保证「医院地址：」单行（59.25px），值列 164；
   行内无间距（设计即为紧凑堆叠），地址值 3 行 lh14 → 卡高 133 */
.footer_new-cards {
  display: flex;
  gap: 43px;
  width: 100%;
}

.footer_new-card {
  width: 224px;               /* 固定宽，min-content 不撑大 */
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.footer_new-card-name {
  font-size: 15.09px;
  font-weight: 700;
  color: #E5E5E5;
  letter-spacing: 2.11px;
  line-height: 21px;          /* 设计 box h23 */
}

.footer_new-card-name-en {
  font-size: 10.59px;
  font-weight: 400;
  color: #E5E5E5;
  line-height: 16px;
  margin-top: 2px;            /* 设计 en 顶 y21 */
  white-space: nowrap;
  overflow: hidden;           /* 长名仅裁切不撑宽 */
}

/* 标签+值 行（地址/热线/时间）—— 行内紧凑，无 margin */
.footer_new-card-row {
  display: flex;
  align-items: flex-start;
  width: 100%;
}

.footer_new-card-label {
  flex: 0 0 60px;             /* 标签列 60（设计「医院地址：」59.25 单行） */
  font-size: 11.85px;
  font-weight: 500;
  color: #E5E5E5;
  line-height: 14px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.footer_new-card-label i {
  font-style: normal;
  font-size: 7.29px;
  font-weight: 350;
  letter-spacing: -0.15px;
  line-height: 10px;
}

.footer_new-card-val {
  flex: 1;
  min-width: 0;
  font-size: 11.85px;
  font-weight: 500;
  color: #E5E5E5;
  line-height: 14px;          /* 设计地址值 lh14，3 行 */
}

/* 地址值：固定 3 行高（42px）。设计稿热线/时间行固定在卡内同水平线，
   不随地址行数浮动 → 三卡即使地址行数不同（上海3/青岛2/成都3），热线/时间也水平对齐 */
.footer_new-card-address {
  min-height: 42px;
}

/* 接待时间值：设计 13.07px / 行高 22.76（与地址 11.85/14 不同，单独控制） */
.footer_new-card-hours {
  font-size: 13.07px;
  line-height: 22.76px;
}

.footer_new-card-phone {
  font-size: 26.59px;
  font-weight: 400;
  color: #E5E5E5;
  line-height: 30px;          /* 设计 lh30.4 */
  text-decoration: none;
  white-space: nowrap;
  letter-spacing: -0.3px;     /* 设计 ls -0.27，保证 12 字符单行 */
}

/* ---- 白色竖分割线（设计：左列底→右列首列 47px 间隙中，距内容顶 ~6）---- */
.footer_new-divider {
  flex: 0 0 0.75px;
  width: 0.75px;
  height: 228px;
  background: rgba(255, 255, 255, 0.7);
  margin: 6px 23px 0 23px;    /* 水平：左右各留 ~23 → 与左列/右列拉开 */
}

/* ---- 右列：5 列导航（设计 483 宽，5 列 1fr 均分，组在列内纵向堆叠）----
   列1 壹博概况｜列2 院区动态+医生团队｜列3 特色中心｜列4 公益救助+患者服务｜列5 加入壹博+联系我们 */
.footer_new-nav {
  flex: 0 0 483px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(0, 1fr));   /* 5 列均分；某列数据缺失隐藏时自动重排不留空轨 */
  column-gap: 8px;
}

.footer_new-col {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding-left: 12px;         /* 设计：标题文字与链接同 left 12，+ 号在更左 0 */
}

.footer_new-group {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin-bottom: 5px;         /* 设计组距 5（组328→组329 间隙 5） */
}

.footer_new-group:last-child {
  margin-bottom: 0;
}

.footer_new-col-title {
  position: relative;
  font-size: 16.34px;
  font-weight: 500;
  color: #FFFFFF;
  line-height: 24px;          /* 设计标题 box h24 */
  margin-bottom: 2px;         /* 链接距标题 2（设计 组328 links y26） */
  white-space: nowrap;
}

/* 标题前 + 号 marker（设计 路径 287-294：6.45×6.45 白 + 号，两臂 1/3 厚度、满框触边）
   icon 绝对定位到列左缘 0（文字自 padding 12 起），标题与链接左缘对齐、icon 不挤动文字
   实现：::before 竖臂（高满框/宽 1/3 水平居中）+ ::after 横臂（宽满框/高 1/3 垂直居中） */
.footer_new-col-marker {
  position: absolute;
  left: -12px;                /* 相对 title（在 padding 区 12 处）→ 实际落到列左缘 0 */
  top: 50%;
  transform: translateY(-50%);
  display: inline-block;
  width: 6.45px;
  height: 6.45px;
}
.footer_new-col-marker::before,
.footer_new-col-marker::after {
  content: "";
  position: absolute;
  background: #FFFFFF;
}
.footer_new-col-marker::before {
  left: 50%;
  top: 0;
  width: 33.3%;
  height: 100%;
  transform: translateX(-50%);
}
.footer_new-col-marker::after {
  top: 50%;
  left: 0;
  width: 100%;
  height: 33.3%;
  transform: translateY(-50%);
}

.footer_new-col-link {
  display: block;
  width: 100%;               /* 撑满列可用宽：flex column + align-items:flex-start 下 auto 会收缩为内容宽，长文字溢出到相邻列 */
  font-size: 11.64px;
  font-weight: 400;
  color: #FFFFFF;
  line-height: 20px;
  text-decoration: none;
  white-space: nowrap;
  overflow: hidden;          /* 超长名称（CMS 页面数据）省略号截断，不与相邻列重叠 */
  text-overflow: ellipsis;
}

.footer_new-col-link:hover {
  color: #D60008;
}

/* ---- copyright 红条 ----
   设计：红条顶 y302.8 = bg 底(340) - 37，与 bg 底部重叠 37px（6:90 顶 302.8 高 39.3）。
   margin-top:-38 上提，使红条盖住内边距区（内容底→红条 28px 露水印，同设计 29px） */
.footer_new-copyright {
  position: relative;
  z-index: 1;
  margin-top: -38px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  height: 39px;
  background: #CA0015;
}

.footer_new-copyright-icon {
  width: 24px;
  height: 31px;
  object-fit: contain;
}

.footer_new-copyright-text {
  display: inline-flex;
  align-items: center;
  font-size: 11.19px;
  font-weight: 400;
  color: #FFFFFF;
  line-height: 1.2;
}

.footer_new-copyright-text a {
  color: #FFFFFF;
  text-decoration: none;
}

.footer_new-copyright-text a:hover {
  text-decoration: underline;
}

.footer_new-copyright-gap {
  display: inline-block;
  width: 32px;
}

/* ========================================
   响应式（对齐项目其它 _new 模块断点 1024/768/480）
   ======================================== */

/* ---- ≤1024：左列+右列 由侧排改为上下堆叠（品牌+卡 一行 / 导航 下一行）----
   两栏固定宽 767+483 在窄屏必溢出；改为纵向，卡转自适应 3 宫格，导航铺满整行 */
@media only screen and (max-width: 1024px) {
  .footer_new-bg {
    height: 100%;           /* 堆叠后内容远超 340，cover 铺满整块避免露出无纹理纯色带 */
  }
  .footer_new-inner {
    max-width: 100%;
    padding: 30px 24px 56px;
    flex-direction: column;
    align-items: stretch;
  }
  .footer_new-left {
    flex: none;
    width: 100%;
  }
  .footer_new-cards {
    gap: 24px;
  }
  .footer_new-card {
    width: calc((100% - 48px) / 3);
  }
  .footer_new-divider {
    display: none;
  }
  .footer_new-nav {
    flex: none;
    width: 100%;
    grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
    column-gap: 8px;
    margin-top: 44px;
  }
}

/* ---- ≤768：纵向堆叠：品牌→卡（单列）→导航（2 列网格）→红条 ---- */
@media only screen and (max-width: 768px) {
  .footer_new {
    /* 旧版移动端悬浮底栏 .right_footer_mobile（layout.html，fixed bottom 100px z99999）
       盖住页面最底部 → 本块底部留白，使 copyright 红条完整可见不被悬浮栏遮挡 */
    padding-bottom: 100px;
  }
  .footer_new-inner {
    padding: 26px 20px 46px;
  }
  .footer_new-brand {
    margin-bottom: 22px;
  }
  .footer_new-cards {
    flex-direction: column;
    gap: 24px;
  }
  .footer_new-card {
    width: 100%;
  }
  .footer_new-nav {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 20px;
    row-gap: 34px;
    margin-top: 40px;
  }
  .footer_new-col-title {
    margin-bottom: 4px;
  }
  /* 红条：内容过长不再限高 39，允许换行居中 */
  .footer_new-copyright {
    height: auto;
    min-height: 39px;
    flex-wrap: wrap;
    padding: 10px 16px;
  }
  .footer_new-copyright-text {
    flex-wrap: wrap;
    justify-content: center;
  }
  .footer_new-copyright-gap {
    width: 10px;
  }
}

/* ---- ≤480：字号降档，导航链接组 2 列（8 组 → 4 行）---- */
@media only screen and (max-width: 480px) {
  .footer_new-brand-cn {
    font-size: 16px;
  }
  .footer_new-brand-en {
    font-size: 14px;
  }
  .footer_new-card-name {
    font-size: 14px;
  }
  .footer_new-card-phone {
    font-size: 22px;
    line-height: 26px;
  }
  .footer_new-nav {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 20px;
    row-gap: 32px;
  }
  /* 列盒不渲染，8 个链接组直接成为网格项 → 2 列排布更均匀 */
  .footer_new-col {
    display: contents;
  }
  .footer_new-group {
    position: relative;
    padding-left: 12px;         /* 承接列的左内边距（col 已无盒） */
    margin-bottom: 0;           /* 组距由 grid row-gap 接管 */
  }
  .footer_new-col-title {
    font-size: 15px;
  }
  .footer_new-col-link {
    font-size: 12.5px;
    line-height: 22px;
  }
  .footer_new-copyright-text {
    font-size: 10px;
  }
}