/* 页面基础：固定使用 1920px 设计画布，再随视口整体等比例缩放。 */
:root {
  --primary: #165c91;
  --text: #333333;
  --muted: #999999;
  --line: #dddddd;
}

* {
  box-sizing: border-box;
}

html {
  overflow-x: hidden;
  background: #ffffff;
}

body {
  margin: 0;
  color: var(--text);
  background: #ffffff;
  font-family: "PingFang SC", "Microsoft YaHei", Arial, sans-serif;
}

/* 外层舞台跟随机构介绍内容自然撑开，避免固定高度裁切内容。 */
.page-stage {
  width: 100%;
  height: auto;
  overflow: visible;
}

/* 内层画布保留 Figma 像素坐标，页面高度由实际内容决定。 */
.page-canvas {
  width: 1920px;
  height: auto;
  zoom: calc(100vw / 1920px);
}

a {
  color: inherit;
  text-decoration: none;
}

img {
  display: block;
  max-width: 100%;
}

/* 公共内容宽度固定为 1680px，对应设计稿左右各 120px 留白。 */
.page-content,
.organization-shell {
  width: 1680px;
  margin-right: auto;
  margin-left: auto;
}

/* 机构设置横幅：从页面 y=120 开始，高度固定为 550px。 */
.organization-hero {
  position: relative;
  width: 1920px;
  height: 550px;
}

.organization-banner {
  width: 1920px;
  height: 550px;
  object-fit: cover;
}

.organization-shell {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

/* 桌面端正文容器距二级栏目底部 60px，栏目向横幅下方延伸 20px。 */
.page-content {
  margin-top: 50px;
}

.breadcrumb {
  position: relative;
  height: 78px;
}

.breadcrumb::after {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 2;
  height: 2px;
  background: var(--primary);
  content: "";
}

.breadcrumb p {
  position: absolute;
  bottom: 18px;
  left: 0;
  margin: 0;
  font-size: 14px;
  line-height: 20px;
  white-space: nowrap;
}

.breadcrumb p span {
  color: var(--muted);
}

.breadcrumb img {
  position: absolute;
  right: 10px;
  bottom: 0;
  z-index: 1;
  width: 210px;
  height: 78px;
  object-fit: contain;
}

/* 三项职能直接从正文容器起点开始，条目之间保持 60px。 */
.function-list {
  display: grid;
  gap: 60px;
  margin-top: 0;
  padding-bottom: 120px;
}

.function-item {
  position: relative;
  width: 1680px;
  height: 260px;
}

.function-item > img {
  position: absolute;
  top: 0;
  left: 0;
  width: 220px;
  height: 260px;
  object-fit: cover;
}

/* 手机端专用职能图片默认隐藏，避免影响 PC 端现有展示。 */
.function-image-mobile {
  display: none;
}

/* 标题位于图片右侧 40px，底线宽度固定为 300px。 */
.function-item h2 {
  position: absolute;
  top: 11px;
  left: 260px;
  width: 300px;
  height: 66px;
  margin: 0;
  padding-bottom: 29px;
  border-bottom: 1px solid var(--line);
  font-size: 18px;
  font-weight: 400;
  line-height: 36px;
  white-space: nowrap;
}

/* 第一项在设计稿中比后两项整体向下 1px。 */
.function-item:first-child h2 {
  top: 12px;
}

.function-item p {
  position: absolute;
  top: 107px;
  left: 260px;
  width: 1420px;
  height: 140px;
  margin: 0;
  color: #000000;
  font-size: 16px;
  line-height: 36px;
}

.function-item:first-child p {
  top: 108px;
}

/* 手机端公共布局：使用设备判断结果，取消桌面画布缩放并启用一级汉堡菜单。 */
.is-mobile .page-stage {
  height: auto;
  overflow: visible;
}

.is-mobile .page-canvas {
  width: 100%;
  height: auto;
  zoom: 1;
}

/* 手机端正文与二级栏目之间统一保留 60px。 */
.is-mobile .page-content {
  width: calc(100% - 32px);
  margin-top: 50px;
}

.is-mobile .breadcrumb {
  display: flex;
  min-height: 58px;
  height: auto;
  align-items: center;
}

.is-mobile .breadcrumb p {
  position: static;
  margin: 0;
  font-size: 13px;
  line-height: 20px;
  white-space: normal;
}

.is-mobile .breadcrumb img {
  display: none;
}

/* 手机端职能条目改为单列图文卡片，正文高度由内容自然撑开。 */
.is-mobile .function-list {
  gap: 16px;
  margin-top: 0;
  padding-bottom: 40px;
}

.is-mobile .function-item {
  width: 100%;
  height: auto;
  overflow: hidden;
  border-radius: 8px;
  background: #f7f7f7;
}

.is-mobile .function-item > img {
  position: static;
  width: 100%;
  height: auto;
  aspect-ratio: 1160 / 590;
  object-fit: cover;
}

/* 使用公共脚本生成的手机端状态切换三项职能图片。 */
.is-mobile .function-image-pc {
  display: none;
}

.is-mobile .function-image-mobile {
  display: block;
}

.is-mobile .function-item h2,
.is-mobile .function-item:first-child h2 {
  position: static;
  width: auto;
  height: auto;
  margin: 0 16px;
  padding: 16px 0 12px;
  font-size: 17px;
  line-height: 26px;
  white-space: normal;
}

.is-mobile .function-item p,
.is-mobile .function-item:first-child p {
  position: static;
  width: auto;
  height: auto;
  margin: 0;
  padding: 14px 16px 18px;
  font-size: 14px;
  line-height: 1.9;
}