/* ==========================================================================
   移动端适配（仅 <= 991px 生效，PC 端不受影响）
   ========================================================================== */

/* PC 端隐藏移动端专属元素 */
.m-nav-toggle,
.m-nav-panel,
.m-nav-mask {
  display: none;
}

/* ---------- 基础 ---------- */
@media screen and (max-width: 991px) {
  html,
  body {
    overflow-x: hidden;
    width: 100%;
  }

  img {
    max-width: 100%;
  }

  h1 { font-size: 26px; }
  h2 { font-size: 21px; }
  h3 { font-size: 18px; }
  h4 { font-size: 17px; }
  h5 { font-size: 16px; }

  .section-content {
    padding: 36px 16px;
  }

  .section-title .section-desc {
    margin-top: 10px;
    font-size: 14px;
    line-height: 1.7;
  }

  .font24 { font-size: 20px; }
  .font22 { font-size: 18px; }
  .font18 { font-size: 16px; }

  /* 侧边悬浮工具条：手机上隐藏，避免遮挡内容 */
  .aside-tools {
    display: none !important;
  }

  /* ---------- 顶部导航 ---------- */
  .nav-shadow {
    position: relative;
  }

  .nav-header {
    height: 56px;
    padding: 0 14px;
    position: relative;
  }

  .nav-header .nav-left .nav-icon img {
    height: 34px;
    margin-right: 0;
  }

  /* PC 横向菜单与下拉全部隐藏 */
  .nav-menu,
  .nav-cont {
    display: none !important;
  }

  /* 手机端只保留 logo 与汉堡按钮，登录/控制台等入口收进抽屉 */
  .nav-right > a,
  .nav-right .no-login,
  .nav-right .login-in {
    display: none !important;
  }

  .nav-header .nav-left .nav-icon img {
    max-width: 150px;
    height: 36px;
    object-fit: contain;
  }

  /* 汉堡按钮：绝对定位在页面右上角（随页面滚动，不悬浮遮挡内容） */
  .m-nav-toggle {
    display: flex;
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 1002;
    flex-direction: column;
    justify-content: center;
    gap: 4px;
    width: 34px;
    height: 34px;
    margin-left: 6px;
    cursor: pointer;
  }

  .m-nav-toggle span {
    display: block;
    height: 2px;
    width: 20px;
    background: #333;
    border-radius: 2px;
    transition: .25s;
  }

  body.m-nav-open .m-nav-toggle span:nth-child(1) {
    transform: translateY(6px) rotate(45deg);
  }

  body.m-nav-open .m-nav-toggle span:nth-child(2) {
    opacity: 0;
  }

  body.m-nav-open .m-nav-toggle span:nth-child(3) {
    transform: translateY(-6px) rotate(-45deg);
  }

  /* 抽屉菜单（关闭时 display:none，避免首屏闪一下） */
  .m-nav-panel {
    display: none;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: 82%;
    max-width: 340px;
    background: #fff;
    z-index: 1001;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    box-shadow: -6px 0 24px rgba(0, 0, 0, .12);
  }

  body.m-nav-open .m-nav-panel {
    display: block;
    animation: mNavSlideIn .26s ease both;
  }

  @keyframes mNavSlideIn {
    from { transform: translateX(100%); }
    to { transform: translateX(0); }
  }

  .m-nav-mask {
    display: block;
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, .45);
    z-index: 1000;
    opacity: 0;
    visibility: hidden;
    transition: .25s;
  }

  body.m-nav-open .m-nav-mask {
    opacity: 1;
    visibility: visible;
  }

  .m-nav-panel .m-nav-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 56px;
    padding: 0 16px;
    border-bottom: 1px solid #F0F2F5;
    font-size: 16px;
    color: #333;
  }

  .m-nav-panel .m-nav-close {
    font-size: 24px;
    line-height: 1;
    color: #999;
    cursor: pointer;
  }

  .m-nav-panel .m-nav-body {
    padding: 8px 16px 24px;
  }

  .m-nav-panel .m-nav-group {
    padding: 14px 0;
    border-bottom: 1px dashed #F0F2F5;
  }

  .m-nav-panel .m-nav-group-title {
    display: block;
    font-size: 15px;
    font-weight: 600;
    color: #1F2733;
  }

  .m-nav-panel .m-nav-links {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
  }

  .m-nav-panel .m-nav-links a {
    display: block;
    padding: 6px 12px;
    font-size: 13px;
    color: #5A6373;
    background: #F7F8FA;
    border-radius: 4px;
  }

  .m-nav-panel .m-nav-foot {
    display: flex;
    gap: 10px;
    padding: 4px 16px 30px;
  }

  .m-nav-panel .m-nav-foot a {
    flex: 1;
    text-align: center;
    padding: 10px 0;
    border-radius: 4px;
    font-size: 14px;
    color: #fff;
    background: #FF6739;
  }

  .m-nav-panel .m-nav-foot a.ghost {
    background: #F7F8FA;
    color: #333;
    border: 1px solid #E6EAED;
  }

  /* ---------- 首页 banner ---------- */
  .banner-cont .swiper-slide {
    height: auto;
  }

  .banner-cont .swiper-slide .img {
    width: 100%;
    height: auto;
  }

  .banner-cont .banner-desc {
    font-size: 14px;
    margin-top: 14px;
    margin-bottom: 20px;
  }

  .banner-cont .swiper-pagination-bullet {
    width: 22px;
  }

  .banner .banner-s {
    border-radius: 0;
  }

  .banner .banner-s .banner-list {
    display: block;
    padding: 0 12px;
  }

  .banner-s .banner-list .banner-item {
    width: auto;
    padding: 16px 12px;
    border-bottom: 1px solid #F0F2F5;
  }

  .banner-s .banner-list .banner-item:last-child {
    border-bottom: 0;
  }

  /* ---------- 首页：6 张推荐卡 ---------- */
  .service-content {
    display: block !important;
    margin: 20px 0 0;
  }

  .service-content .fboxRow {
    display: block !important;
  }

  .service .service-box {
    margin: 10px 0;
    padding: 20px;
    min-height: auto;
  }

  .service-box .title-desc {
    height: auto;
  }

  .service .service-box .service-title {
    font-size: 17px;
  }

  .service .service-btn-group {
    padding-top: 14px;
  }

  /* ---------- 首页：解决方案 / 实践 / 品牌 ---------- */
  .resolve-content {
    display: block !important;
  }

  .resolve-content .fboxRow {
    display: block !important;
  }

  .resolve-content .resolve-box {
    max-width: none;
    margin: 10px 0;
  }

  .practice .practice-content {
    display: block !important;
  }

  .practice .practice-box {
    width: 100% !important;
    margin: 10px 0;
    padding: 20px;
  }

  .practice .practice-box img {
    width: 130px;
    height: auto;
  }

  .brand-group {
    justify-content: space-between;
  }

  .practice .brand-box {
    width: calc(50% - 10px);
    margin: 5px 0;
    height: 96px;
  }

  .cert-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  .cert-list .cert-item {
    width: calc(33.33% - 8px);
    padding: 10px 0;
  }

  /* ---------- 首页：新闻公告两栏 ---------- */
  .news-content {
    display: block;
    gap: 0;
  }

  .news-content .news-cont {
    margin-bottom: 26px;
  }

  .news-content .news-cont:last-child {
    margin-bottom: 0;
  }

  /* ---------- 内页 banner ---------- */
  /* 手机上改用纯色渐变：背景图内的文字在窄屏会放大裁切，容易和标题打架 */
  .server-banner,
  .server-banner2,
  .product-banner {
    background-image: linear-gradient(120deg, #0A2450 0%, #103465 55%, #1A4E8F 100%) !important;
    background-size: 100% 100% !important;
    background-position: center center !important;
  }

  .server-banner .section-content,
  .server-banner2 .section-content {
    padding: 40px 16px;
  }

  .server-banner h1,
  .server-banner2 h1 {
    font-size: 24px;
  }

  /* 产品页 banner 桌面固定 440px，手机上按内容高度自适应 */
  .product-banner {
    height: auto !important;
    padding: 0 !important;
  }

  .server-banner-desc,
  .server-banner-desc2 {
    font-size: 14px;
    line-height: 1.8;
    margin-top: 14px;
    margin-bottom: 24px !important;
  }

  /* ---------- 产品列表（云服务器 / 物理机 / 托管 / 机柜） ---------- */
  .product-country {
    display: flex;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    white-space: nowrap;
    padding-bottom: 4px;
  }

  .product-country .country-item {
    flex: 0 0 auto;
    padding: 0 12px;
    font-size: 14px;
  }

  .product-hot .hot-list,
  .cloud-pro-list .hot-list.active {
    display: block;
    margin: 0;
  }

  .product-hot .hot-item,
  .product-item,
  .price .price-item,
  .help-box,
  .standards-box {
    width: 100% !important;
    margin: 10px 0 !important;
    padding: 18px !important;
  }

  .product-item .product-item-top h4,
  .product-hot .hot-item h4 {
    font-size: 18px;
  }

  .product-item .product-item-bottom .product-config {
    min-height: auto;
  }

  .product-item .product-item-bottom .product-config > p {
    margin-bottom: 10px;
  }

  .product-item .product-item-bottom .product-price-box .price-right {
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
  }

  .hot {
    overflow: visible;
  }

  .hot-list {
    display: block !important;
  }

  .hot-list.swiper-slide {
    width: 100% !important;
  }

  .fin {
    display: none;
  }

  /* 产品优势 / 高效能 */
  .product-cloud .cloud {
    display: block;
    margin-top: 24px;
  }

  .product-cloud .cloud-box {
    min-width: 0 !important;
    width: 100%;
    margin: 10px 0;
    padding: 20px;
    flex-direction: column;
  }

  .product-cloud .cloud-box img {
    width: 72px;
    height: 72px;
    margin: 0 0 12px;
  }

  .product-performance .performance {
    display: block;
    margin-top: 24px;
  }

  .product-performance .performance-left,
  .product-performance .performance-left2 {
    flex: none !important;
  }

  .product-performance .performance .performance-left img,
  .product-performance .performance .performance-left2 img,
  .product-performance .performance .performance-left3 img {
    min-width: 0 !important;
    width: 100%;
    height: auto;
    margin: 0 0 16px;
  }

  .product-performance .performance-item {
    min-width: 0 !important;
    height: auto;
    padding: 12px 14px;
  }

  .product-performance .performance-item img {
    height: 40px;
    width: 40px;
    margin-right: 12px;
  }

  /* 选项卡区 */
  .tabs-efficient {
    padding: 20px 16px;
  }

  .tabs-efficient .tab-box,
  .tab-box {
    display: block;
  }

  .tab-box .tabs-content {
    padding-right: 0;
  }

  .tabs-efficient .tabs-img {
    width: 100%;
    height: auto;
    margin-top: 16px;
  }

  .nav-tabs {
    overflow-x: auto;
    white-space: nowrap;
    flex-wrap: nowrap !important;
  }

  .nav-tabs .nav-link {
    padding: 10px 12px;
    font-size: 14px;
  }

  /* 使用帮助卡片 */
  .product-help .help,
  .help.fboxRow {
    display: block;
  }

  /* ---------- 文档中心 ---------- */
  .docement-list {
    display: block !important;
  }

  .docement-list .document-box {
    width: 100% !important;
    flex: none !important;
    margin: 0 0 14px;
    padding: 18px;
  }

  .input-search {
    width: 100%;
  }

  .input-search input {
    width: 100%;
    height: 46px;
    font-size: 15px;
    margin-top: 16px;
    margin-bottom: 16px;
  }

  .input-search .search-btn {
    margin-top: 16px;
    margin-bottom: 16px;
    padding: 13px 24px;
    white-space: nowrap;
  }

  /* ---------- 公告 / 新闻列表 ---------- */
  .announce-cont,
  .announce-list .fboxRow,
  .news-list .fboxRow {
    display: block !important;
  }

  .announce-list .jr-page .title-desc,
  .announce-list .jr-page .announce-tabs {
    display: block;
  }

  .announce-list .list-item,
  .news-list .list-item {
    flex-direction: column;
    align-items: flex-start !important;
  }

  .announce-list .list-item .announce-time,
  .news-list .list-item .news-time {
    margin-top: 6px;
  }

  /* ---------- 页脚 ---------- */
  /* 底部注册横幅是张宽图，窄屏裁切后文字不全，手机上直接隐藏 */
  .register-advert {
    display: none;
  }

  .promise .promise-box {
    flex: 0 0 50%;
    min-width: 0;
    padding: 14px 0;
    font-size: 14px;
  }

  .promise-box img {
    height: 24px;
    width: 24px;
  }

  .footer-content .footer-nav {
    display: block;
    padding: 24px 0 10px;
  }

  .footer .footer-nav .footer-nav-left {
    margin-right: 0;
  }

  .footer-content .footer-nav .footer-nav-left {
    display: flex;
    flex-wrap: wrap;
    gap: 0 16px;
  }

  .footer-content .footer-nav .footer-nav-left .footer-nav-box {
    flex: 0 0 calc(50% - 16px);
    margin-bottom: 18px;
  }

  .footer-nav-box .footer-nav-head {
    width: 100%;
    padding: 8px 0;
    font-size: 14px;
  }

  .footer-nav-box .footer-nav-cont {
    padding-top: 10px;
  }

  .footer-content .footer-nav .footer-nav-right {
    width: 100%;
  }

  .footer-nav-right .footer-nav-box .footer-nav-item {
    width: auto;
  }

  .footer .footer-record {
    display: block;
    height: auto;
    line-height: 1.9;
    padding: 14px 0;
    text-align: center;
  }

  .footer-record .left-info {
    display: block;
  }

  .footer-record .left-info a,
  .footer-record .left-info span {
    display: inline-block;
    margin: 0 6px;
  }

  /* ---------- 关于我们 / 服务保障等卡片页 ---------- */
  .about-reason .reason,
  .about-box .box-list,
  .about-example .box-list,
  .about-together .reason {
    display: block !important;
    margin: 0;
  }

  .about-reason .reason-box,
  .about-box .box-list .box-item,
  .about-example .box-list .box-item,
  .about-together .reason-box {
    width: 100% !important;
    height: auto !important;
    margin: 10px 0 !important;
    padding: 24px 20px !important;
  }

  .about-reason .reason-box {
    line-height: 1.85;
  }

  .about-reason .reason-box .mt-40 {
    margin-top: 14px !important;
  }

  .about-box .box-list .box-item {
    height: auto !important;
  }

  .about-box .box-list .box-item img {
    width: 100%;
    height: auto;
  }

  .about-example .box-list .box-item {
    height: auto !important;
  }

  .about-example .box-list .box-item img {
    width: 140px;
    height: auto;
  }

  .about-custom .custom-box {
    align-items: flex-start;
  }

  /* 解决方案 / 服务保障页的通用卡片 */
  .solution .fboxRow,
  .guarantee .fboxRow,
  .support.fboxWrap {
    display: block;
  }

  .support .support-box {
    width: 100% !important;
    margin: 0 0 12px;
  }

  /* ---------- 通用：表格横向滚动 ---------- */
  .table-responsive {
    overflow-x: auto;
  }

  /* ---------- 暂未开通 ---------- */
  .coming-soon {
    padding: 30px 18px 24px;
  }

  .coming-soon h3 {
    font-size: 19px;
  }

  .coming-soon-desc {
    font-size: 14px;
    line-height: 1.8;
  }

  .coming-soon-item {
    flex: 0 0 100%;
    max-width: none;
  }
}

/* ---------- 超小屏 ---------- */
@media screen and (max-width: 480px) {
  .section-content {
    padding: 28px 14px;
  }

  .banner-cont .swiper-slide .img {
    min-height: 150px;
    object-fit: cover;
  }

  .footer-content .footer-nav .footer-nav-left .footer-nav-box {
    flex: 0 0 100%;
  }

  .cert-list .cert-item {
    width: calc(50% - 8px);
  }

  .product-item .product-item-top h4,
  .product-hot .hot-item h4 {
    font-size: 17px;
  }
}
