/*!
 * 烟台交通集团官网 - 移动端适配 & 语义化标题重置
 * 所有移动端规则均包裹在 @media (max-width: 768px) 内，PC 端样式不受影响
 * 必须放在页面所有样式表之后加载：${site.sitePath}images/responsive.css
 */

/* 语义化标题重置：把 div 升级为 h1~h3 时不改变原有视觉。
   使用 :where() 让该规则特异性为 0，任何页面自有样式都优先，确保 PC 端样式不变。 */
:where(.seo-h1, .seo-h2, .seo-h3) {
  margin: 0;
  padding: 0;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  color: inherit;
  letter-spacing: inherit;
}

/* 无障碍/SEO 用的仅屏幕阅读器可见文本 */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

@media (max-width: 768px) {
  /* ============ 基础：修正旧版 8px 根字号与 100vw 横向滚动 ============ */
  html {
    font-size: 14px !important;
    height: auto !important;
  }
  body {
    width: auto !important;
    min-width: 0 !important;
    max-width: 100%;
    height: auto !important;
    overflow-x: hidden !important;
    /* 移动端导航是 fixed-top，内容需要让出顶部高度 */
    padding-top: 4rem;
  }
  /* 移动端头部：沿用独立的一套导航/页脚，PC 端由 .pc/.mobile 自动隐藏 */
  #navMobile .navbar {
    padding: 0.7rem 12px;
    background-color: #3456ac !important;
  }
  /* 折叠菜单改为下拉面板，避免撑高导航栏 */
  #navMobile .navbar-collapse {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background-color: #3456ac;
    padding: 0.5rem 12px 1rem;
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15);
  }
  #navMobile .navbar-collapse:not(.show) {
    display: none !important;
  }
  #navMobile .navbar-nav {
    width: 100%;
  }
  #navMobile .mobile-logo {
    width: 2rem !important;
    height: 2rem !important;
    max-width: none !important;
    margin-right: 0.5rem;
  }
  #navMobile .navbar-brand {
    font-size: 1.3rem;
    color: #fff;
    display: flex;
    align-items: center;
  }
  #navMobile .nav-link {
    padding: 0.8rem 0.4rem !important;
    font-size: 1.3rem;
  }
  #navMobile .navbar-toggler {
    border-color: rgba(255, 255, 255, 0.5);
  }
  #navMobile .navbar-search {
    color: #fff;
    margin-right: 0.5rem;
  }
  #navMobile .navbar-search .iconfont {
    font-size: 1.5rem;
    vertical-align: middle;
  }
  #footerMobile .footer-cont {
    padding: 1.6rem 12px;
    text-align: center;
  }
  #footerMobile .footer-cont .logo-img {
    height: 2.4rem;
    width: auto;
  }
  #footerMobile .footer-cont .info-box {
    font-size: 1.2rem;
  }
  html,
  body {
    overflow-x: hidden;
  }
  img,
  video,
  iframe,
  table,
  svg {
    max-width: 100% !important;
  }
  img,
  video {
    height: auto !important;
  }
  /* 正文里的宽表格改为可横向滑动，避免撑破页面 */
  table {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  /* ============ 入场动画兜底 ============ */
  /* WOW/animate.css 的元素初始为 opacity:0 + 位移，JS 未触发时会整屏空白 */
  .wow,
  .animate__animated {
    animation: none !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  /* ============ 通用容器 ============ */
  .zl-container,
  .zl-container-nav {
    width: 100%;
    min-width: 0 !important;
    max-width: 100%;
    padding-left: 12px;
    padding-right: 12px;
    box-sizing: border-box;
  }
  .container {
    padding-left: 12px;
    padding-right: 12px;
  }

  /* ============ 导航 ============ */
  #navBox {
    min-width: 100%;
    padding: 0.5rem 0;
    background-color: #fff !important;
    background-image: none !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  }
  #navBox.bg-white {
    background-color: #fff !important;
    background-image: none !important;
  }
  .nav-box {
    padding: 0 12px;
  }
  /* logo 由 #topLogo 等高特异性规则控制，需 !important 压到单行高度 */
  .nav-box .logo-img,
  #navBox .logo-img,
  #topLogo {
    height: 2.2rem !important;
    width: auto !important;
  }
  .nav-box .navbar-brand {
    padding: 0;
  }
  .nav-box .navbar-toggler {
    padding: 0.4rem 0.6rem !important;
    border: 1px solid #e3e7ef;
    border-radius: 0.5rem;
    background-color: #fff;
  }
  .nav-box .navbar-toggler-icon {
    width: 1.2em;
    height: 1.2em;
  }
  .nav-box .navbar-collapse {
    background-color: #fff;
    padding-bottom: 0.4rem;
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.06);
  }
  .nav-box .nav-item {
    padding: 0;
    font-size: 1.2rem;
    border-bottom: 1px solid #f0f2f6;
  }
  .nav-box .nav-item:last-child {
    border-bottom: none;
  }
  .nav-box .nav-link {
    color: #333 !important;
    padding: 0.9rem 0.8rem !important;
  }
  .nav-box .dropdown-menu {
    position: static !important;
    top: auto !important;
    left: auto !important;
    width: 100%;
    transform: none !important;
    border-top: none;
    background: rgba(0, 0, 0, 0.6);
    backdrop-filter: none;
  }
  .nav-box .dropdown-menu::after {
    display: none;
  }
  .nav-box .dropdown:hover .dropdown-menu {
    display: none;
  }
  .nav-box .dropdown.show .dropdown-menu {
    display: block;
  }
  .search-icon,
  .search-icon a,
  .search-icon .search-i {
    color: #333;
  }
  .search-icon::before {
    display: none;
  }
  .navSelected {
    display: none;
  }

  /* ============ 子页面头部 ============ */
  /* 全局 img{height:auto} 会让 banner 图只占容器上半截，
     标题压在图片边缘；这里让图铺满容器并垂直居中标题 */
  .other-head {
    height: 12rem;
    overflow: hidden;
  }
  .other-head img {
    height: 100% !important;
    object-fit: cover;
  }
  .other-head > h1,
  .other-head > h3 {
    font-size: 1.8rem;
    letter-spacing: 0.2rem;
    bottom: auto;
    top: 50%;
    transform: translateY(-50%);
  }

  /* ============ 栏目子导航 ============ */
  .page-child {
    flex-wrap: wrap;
    gap: 0.5rem;
    padding: 0.6rem 0;
    border-bottom: none;
  }
  .page-child a.child-item {
    width: auto;
    flex: 0 1 auto;
    padding: 0.55rem 1.1rem;
    font-size: 1.2rem;
    text-align: center;
    background: #f2f4f8;
    border-radius: 1.4rem;
    color: #444;
  }
  .page-child .nav-cn {
    font-size: 1.2rem;
  }
  .page-child .nav-en {
    display: none;
  }
  .page-child .navSelected {
    display: none;
  }
  .nav-child {
    flex-wrap: wrap;
    justify-content: center;
  }
  .nav-child .nav-item {
    padding: 0.6rem 0.8rem;
  }

  /* ============ 集团资讯 ============ */
  .news-m-title {
    flex-direction: column;
    align-items: flex-start;
    padding: 1.4rem 0 0.8rem;
  }
  .news-m-title .title-name {
    width: 100%;
    font-size: 1.5rem;
    font-weight: 600;
    padding-left: 0.7rem;
    border-left: 4px solid #3456ac;
    line-height: 1.3;
  }
  /* 头条大图 */
  .xwyw-box {
    flex-direction: column;
  }
  .xwyw-box .xwyw-content,
  .xwyw-box .xwyw-tab {
    width: 100%;
  }
  .xwyw-box .pane-box {
    height: 14rem;
    border-radius: 0.6rem;
    overflow: hidden;
    margin-bottom: 0.8rem;
  }
  /* 新闻条目：卡片化 + 标题两行截断 */
  .xwyw-tab-item .item-box {
    border-bottom: 1px solid #f0f2f5 !important;
  }
  .xwyw-tab-item .tab-title {
    font-size: 1.4rem;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .xwyw-tab-item .tab-date {
    font-size: 1.1rem;
    color: #999;
  }
  .item-content {
    font-size: 1.2rem;
    color: #666;
    line-height: 1.7;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .news-cont .d-flex {
    flex-direction: column;
  }
  .xxgk-box,
  .hyzx-box {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.8rem;
  }
  .xxgk-item-frist {
    grid-column: 1 / 3;
  }
  .hyzx-item-frist {
    grid-column: span 2;
    grid-row: auto;
  }
  .xxgk-cont {
    background-attachment: scroll;
  }
  .row {
    margin-left: 0;
    margin-right: 0;
  }
  .row > [class*="col-"] {
    width: 100%;
    flex: 0 0 100%;
    max-width: 100%;
    padding-left: 0;
    padding-right: 0;
  }

  /* ============ 首页（fullPage 降级为普通文档流） ============ */
  #fullpage,
  #fullpage .section,
  .fullpage-wrapper,
  .fp-section {
    height: auto !important;
    min-height: 0 !important;
  }
  #fp-nav,
  .fp-watermark,
  .mouse-box {
    display: none !important;
  }
  /* fullPage 兜底：即便 JS 仍初始化，也还原为普通文档流，避免整页锁死不可滚动 */
  html.fp-enabled,
  html.fp-enabled body {
    overflow: visible !important;
    height: auto !important;
  }
  .fullpage-wrapper {
    transform: none !important;
    touch-action: auto !important;
  }
  .fp-tableCell,
  .fp-slidesContainer,
  .fp-slide {
    display: block !important;
    width: 100% !important;
    height: auto !important;
  }
  .banner-box {
    height: 22rem;
  }
  .news-cont .d-flex {
    flex-direction: column;
  }
  .news-left,
  .news-right {
    width: 100%;
    height: auto;
    min-height: 0;
  }
  .news-right {
    padding: 1rem 0;
  }
  .news-item {
    width: 100% !important;
    height: auto;
    float: none;
    padding: 1.5rem 12px !important;
  }
  .news-item .item-img {
    position: relative !important;
    width: 100% !important;
    height: 12rem !important;
    right: auto !important;
    bottom: auto !important;
    opacity: 1 !important;
    margin-bottom: 0.8rem;
  }
  .news-item .item-content {
    -webkit-line-clamp: 3;
  }
  .swiper-button-next,
  .swiper-button-prev {
    display: none;
  }

  /* ============ 业务概况 ============ */
  .ywgk-cont {
    padding-top: 0;
  }
  .ywgk-cont > div[style*="height"] {
    height: 8rem !important;
  }
  .ywgk-cont .zl-container[style*="padding"] {
    padding: 2rem 0 !important;
  }
  .businessNav {
    height: auto !important;
    min-height: 0 !important;
    padding: 10px 0;
    flex-wrap: wrap;
  }
  /* 六大集团 */
  .zjt-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .zjt-item {
    height: auto !important;
    min-height: 9rem;
  }
  .zjt-item .item-title {
    width: 8rem;
    margin-left: -2rem;
  }
  .zjt-item .item-title .bg {
    width: 8rem;
  }
  /* 项目展示 / 产品服务 */
  .business-box .project-img .fit-img {
    height: 14rem !important;
    min-height: 0 !important;
    max-height: none !important;
  }
  .businessMain .swiper-slide,
  .goodSwiper .swiper-slide {
    width: 100%;
  }
  .circle-item {
    width: auto;
    height: auto;
    max-width: 100%;
  }

  /* ============ 二级集团 / 权属企业（company / 二级集团） ============ */
  /* 集团简介：桌面端为「标题 34% + 正文」横排，移动端改为纵向堆叠 */
  .basic-info-box {
    flex-direction: column;
    padding: 2.5rem 0;
  }
  /* 灰底装饰块桌面端定位在 right:66%，纵向排布后会错位，移动端改为整块白底卡片 */
  .basic-info-box::after {
    top: 0;
    right: 0;
    width: 100%;
    background-color: #fff;
  }
  .basic-info-box__title {
    width: 100%;
    padding-right: 0;
    margin-bottom: 1.2rem;
  }
  .basic-info-box__title .title-cn {
    font-size: 2.2rem;
    line-height: 1.35;
    word-break: break-word;
  }
  .basic-info-box__title .title-en {
    font-size: 0.9rem;
  }
  .basic-info-box__title hr {
    width: 5rem;
    margin-top: 1rem;
    margin-bottom: 0;
  }
  .basic-info-box__content {
    width: 100%;
    padding-left: 0;
    font-size: 1.25rem;
    line-height: 1.9;
    /* 富文本可能出现超长英文/表格，统一允许折行，避免撑破容器 */
    word-break: break-word;
    overflow-wrap: anywhere;
  }
  .basic-info-box__content img {
    display: block;
    margin-left: auto;
    margin-right: auto;
  }
  /* 联系方式 */
  /* 页面行内写了 margin-bottom:4rem，需同权重 !important 覆盖 */
  .call-container .info-title[style] {
    margin-bottom: 2rem !important;
  }
  .call-container {
    padding: 3rem 0;
    /* iOS Safari 不支持 fixed 背景，会拉伸或空白 */
    background-attachment: scroll;
  }
  .info-title .info-icon {
    flex: none;
    width: 4rem;
    height: 4rem;
    line-height: 3.4rem;
    font-size: 2.2rem;
    margin-right: 1rem;
  }
  .info-title .info-text__cn {
    font-size: 1.6rem;
  }
  .info-title .info-text__en {
    font-size: 0.9rem;
  }
  .info-content .content-label {
    font-size: 1.25rem;
  }
  .info-content .content-value {
    font-size: 1.35rem;
    word-break: break-word;
  }
  /* 地图 */
  .map-container {
    padding: 2rem 0;
  }
  .map-container #container {
    height: 20rem;
  }
  /* 旗下子公司：标签流改为两列网格 */
  .child-company {
    margin-top: 2rem;
  }
  .child-company hr {
    margin-bottom: 1.5rem;
  }
  .child-company__group {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
  }
  .child-company__group .child-item {
    min-height: 4.4rem;
    padding: 1rem 0.8rem;
    font-size: 1.25rem;
    line-height: 1.4;
    text-align: center;
    word-break: break-word;
  }

  /* ============ 党群工作 ============ */
  .dqrd-item .img-box {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
  }
  .good-box {
    height: auto !important;
    min-height: 8rem;
  }

  /* ============ 关于我们 ============ */
  .about-cn {
    position: static !important;
    left: auto !important;
    bottom: auto !important;
    width: 100% !important;
    padding-left: 0;
    transform: none !important;
    font-size: 1.6rem;
  }
  /* 发展历程页 banner 文案：桌面端写死 min-width:1000px，移动端会撑破屏幕 */
  .banner-text {
    position: static !important;
    min-width: 0 !important;
    width: 100% !important;
    transform: none !important;
    padding: 2rem 12px;
    box-sizing: border-box;
  }
  .banner-text .text-en {
    font-size: 2rem;
  }
  .banner-text .text-cn {
    font-size: 1.6rem;
  }
  .banner-text .text-desc {
    font-size: 1rem;
    white-space: normal;
  }
  .about-en {
    font-size: 2.4rem;
    height: auto;
  }
  .about-en::first-letter {
    font-size: 4rem;
  }
  .jtjj-content {
    float: none;
    width: 100%;
    padding-top: 2rem;
  }
  .logo-group {
    width: 100%;
  }
  .img-group .img-item {
    height: auto !important;
    min-height: 0 !important;
  }
  .line {
    width: 100% !important;
    max-width: 100% !important;
  }
  .num-group {
    flex-wrap: wrap;
    gap: 1rem;
  }

  /* ============ 文章列表 / 详情 ============ */
  .main-page {
    padding: 1rem 0 3rem;
  }
  /* 列表卡片化 */
  .article-item {
    background: #fff;
    border-radius: 0.6rem;
    overflow: hidden;
    margin-bottom: 0.8rem;
  }
  .article-item .zl-container {
    flex-direction: column;
  }
  .article-item .item-left {
    width: 100%;
    height: 14rem;
    margin-bottom: 0.8rem;
    overflow: hidden;
  }
  /* 缩略图裁切填充，防止 height:auto 的原图溢出卡片压到日期和标题 */
  .article-item .item-left img {
    width: 100%;
    height: 100% !important;
    object-fit: cover;
  }
  .article-item .item-right {
    width: 100%;
    padding-left: 0;
  }
  .article-item .item-title {
    white-space: normal;
    line-height: 1.5;
  }
  /* 覆盖基础样式里的 2.2 倍行距（特异性更高，需同权重覆盖） */
  .article-item .item-content {
    line-height: 1.7;
    -webkit-line-clamp: 3;
  }
  .page-white {
    padding: 1.2rem;
  }
  /* 正文段落首行缩进 2em（约 43px），会把行内的图片/表格整体右推导致右侧被裁 */
  .page-white img,
  .article_body img,
  .detail-content img {
    display: block !important;
    max-width: 100% !important;
    height: auto !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  .detail-title {
    font-size: 1.6rem;
  }
  .detail-other {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.6rem;
  }
  .zgfc {
    grid-template-columns: repeat(2, 1fr);
  }
  .zgfc_img {
    width: 100% !important;
    height: auto !important;
  }

  /* ============ 分页 ============ */
  .pageination-cont {
    padding: 2rem 0 4rem;
  }
  .pagination {
    flex-wrap: wrap;
    gap: 0.3rem;
  }

  /* ============ 底部 ============ */
  .footer-top {
    flex-direction: column;
    align-items: stretch;
    padding: 1.4rem 0;
  }
  .footer-top .w50 {
    width: 100%;
  }
  .footer-top .logo-img {
    height: 2rem !important;
  }
  /* 顶部四个栏目链接保持一行 */
  .footer-top .d-flex.w50 {
    flex-direction: row !important;
    flex-wrap: nowrap;
    margin-top: 1rem;
  }
  .footer-top .href-item {
    width: auto !important;
    margin: 0 !important;
  }
  .footer-body {
    padding: 1.4rem 0;
  }
  .footer-body .d-flex {
    flex-direction: column;
  }
  .footer-body .w50 {
    width: 100%;
  }
  .footer-body .w50.d-flex {
    flex-wrap: wrap;
  }
  .footer-body .w50.d-flex.justify-content-start {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 1rem;
  }
  /* 链接组：两列排布，不再逐行铺满 */
  .footer-body ul.href-item {
    width: auto !important;
    flex: 1 1 40% !important;
    margin: 0 0 1rem !important;
    text-align: left !important;
  }
  .footer-body ul.href-item li {
    padding: 0.35rem 0;
  }
  .wechat-box,
  .contact-item {
    padding-right: 0 !important;
    max-width: 100%;
  }
  .footer-bottom {
    font-size: 0.9rem;
    line-height: 1.8;
  }
  .link-down {
    float: none;
    display: block;
    margin-top: 1rem;
  }
  .link-down .btn-default {
    width: 100%;
    min-width: 0;
  }
  .footer-cont::after {
    width: 200px;
    height: 200px;
    bottom: -60px;
    right: -40px;
  }
  #backToTop {
    right: 1rem;
    bottom: 1.5rem;
    padding: 0.6rem;
  }
}
