/* ============================================================
   jsjszt-en 响应式适配层
   原则：桌面端（>1024px）视觉零变化，仅在窄屏做布局重组。
   所有规则都包在媒体查询内，不污染桌面端。
   ============================================================ */

/* PC 端隐藏原站内置的移动端汉堡按钮 */
.jz_nav_menu { display: none; }

/* Banner 轮播：淡入过渡（由 responsive.js 兜底驱动） */
.banner_pic_item_wrap { transition: opacity .6s ease; }

/* ---------- ≤1200px：小笔记本，字号微降 ---------- */
@media (max-width: 1200px) {
  :root { --fontRatio: 0.92; }
}

/* ---------- ≤1024px：平板，导航换汉堡抽屉 + 网格降档 ---------- */
@media (max-width: 1024px) {
  :root { --fontRatio: 0.86; }

  /* —— 汉堡按钮：用原站自带的 .jz_nav_menu 三条杠 —— */
  .jz_nav_wrap { width: auto !important; position: relative; }
  .jz_nav_menu {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
  }
  .jz_nav_menu .menu_body { width: 26px; }
  .jz_nav_menu .nav_menu_item {
    height: 2px !important;
    margin: 4px 0;
    background-color: #ffffff !important;
    border-radius: 2px;
    transition: transform .25s ease, opacity .2s ease;
  }
  .jz_nav_menu .item_rect { display: none; }

  /* 展开态：三条杠变叉 */
  .jz_nav_wrap.nav-open .nav_menu_item.menu_item_top    { transform: translateY(6px) rotate(45deg); }
  .jz_nav_wrap.nav-open .nav_menu_item.menu_item_center { opacity: 0; }
  .jz_nav_wrap.nav-open .nav_menu_item.menu_item_bottom { transform: translateY(-6px) rotate(-45deg); }

  /* —— 导航抽屉 —— */
  .jz_nav { position: static !important; }
  .jz_nav_content {
    position: absolute !important;
    top: 100%;
    right: 0;
    left: auto;
    z-index: 999;
    display: none;
    width: 240px;
    max-width: 86vw;
    max-height: 72vh;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    background-color: #ffffff;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .18);
  }
  .jz_nav_wrap.nav-open .jz_nav_content { display: block; }
  .jz_nav_content .nav_icon_prev,
  .jz_nav_content .nav_icon_next { display: none !important; }

  ul.jz_nav_list { display: block !important; width: 100%; text-align: left !important; }

  li.jz_nav_item {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    line-height: 1.4 !important;
    padding: 0 !important;
    border: 0 !important;
    background: none !important;
  }
  li.nav_item_septal { display: none !important; }

  .nav_item_text_wrap { padding: 13px 18px; background: none !important; }
  li.jz_nav_item .nav_main_name {
    color: #212121 !important;
    font-size: 16px !important;
    white-space: normal;
  }
  li.jz_nav_item:hover .nav_main_name,
  li.jz_nav_item.jz_theme_font_hover_color:hover .nav_main_name {
    color: rgba(154, 24, 39, 1) !important;
  }

  /* 子菜单：抽屉内直接展开，不做悬浮定位 */
  ul.sub_nav_list {
    position: static !important;
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    width: 100% !important;
    min-width: 0 !important;
    padding: 0 0 8px 14px !important;
    margin: 0 !important;
    background-color: #ffffff !important;
    box-shadow: none !important;
    border: 0 !important;
  }
  .sub_nav_wrap { display: block !important; padding: 0 !important; }
  li.sub_nav_item { display: block !important; width: 100% !important; padding: 6px 0 !important; background: none !important; }
  li.sub_nav_item_septal { display: none !important; }
  .sub_nav_item_text_wrap { padding: 0 !important; background: none !important; }
  .sub_nav_item_text { color: #555555 !important; font-size: 14px !important; }
  .sub_nav_before { display: none !important; }

  /* —— 网格降档：产品 / 新闻 4 列 → 2 列 —— */
  .exhibition_show_products { flex-wrap: wrap !important; }
  .exhibition_show_products .exhibition_show_product { width: calc(50% - 20px) !important; }
  .news_list_wrap { flex-wrap: wrap !important; }
  .news_list_item_line { width: calc(50% - 20px) !important; }

  /* 内容区大留白收窄（原站 PC 的 60px 内边距在窄屏会吃掉全部宽度） */
  .product_list_content,
  .module_photo_group_content {
    padding-left: 16px !important;
    padding-right: 16px !important;
    box-sizing: border-box !important;
  }

  /* 横向时间轴 / 横向相册：窄屏改为可横滑，而不是被硬裁掉 */
  .timeline_text_horizontal,
  .jz_scroll_wrap {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }
}

/* ---------- ≤768px：平板竖屏 / 大屏手机，整体堆叠 ---------- */
@media (max-width: 768px) {
  :root { --fontRatio: 0.8; }

  /* 一行多列 → 上下堆叠 */
  .jz_web_row__content {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: wrap !important;
  }
  .jz_web_row__content > .jz_web_col {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* 产品 / 新闻 → 单列 */
  .exhibition_show_products { flex-wrap: wrap !important; }
  .exhibition_show_products .exhibition_show_product { width: calc(100% - 20px) !important; }
  .news_list_wrap { flex-wrap: wrap !important; }
  .news_list_item_line { width: calc(100% - 20px) !important; }

  /* Banner 高度随视口收缩，避免首屏被撑爆 */
  .jz_banner, .jz_web_banner, .banner_pic_item { height: auto !important; min-height: 200px; }
  .banner_pic_item { background-size: cover !important; }

  /* 模块左右留白收窄 —— 必须锁 border-box，否则 padding 会把容器撑出视口 */
  .jz_web_row,
  .jz_web_row__content,
  .jz_web_col,
  .web_col_content,
  .module_content,
  .module_content_detail,
  .product_list_content,
  .module_photo_group_content {
    box-sizing: border-box !important;
  }
  .jz_web_row, .web_col_content, .module_content { padding-left: 12px !important; padding-right: 12px !important; }

  /* 通栏模块：清掉 PC 端用来抵消留白的负 margin，避免窄屏左右溢出 */
  .jz_module,
  .module_wrap,
  .module_content,
  .module_content_detail,
  .m_tabpack_wrap,
  .tabpack_item_list_wrap,
  .m_tabpack_listwrap {
    margin-left: 0 !important;
    margin-right: 0 !important;
    max-width: 100% !important;
  }

  /* 触摸端去掉 hover 位移，避免点击后「粘住」 */
  .jz_hover:hover { transform: none !important; }
}

/* ---------- ≤480px：手机 ---------- */
@media (max-width: 480px) {
  :root { --fontRatio: 0.74; }

  .jz_web_row, .web_col_content, .module_content { padding-left: 8px !important; padding-right: 8px !important; }
  .product_list_content, .module_photo_group_content { padding-left: 8px !important; padding-right: 8px !important; }
  .jz_nav_content { width: 82vw; }
  .exhibition_show_products .exhibition_show_product,
  .news_list_item_line { width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; }
}