/* ============================================================
   全站响应式适配补丁（responsive.css）
   - 经 head.html 在所有页面引入，加载于 style.css / home-banner.css /
     ddns.css 之后，只做自适应增强，不改变桌面端既有视觉。
   - 断点：≤480 手机小屏 / ≤768 手机 / ≤991 平板抽屉 / 桌面默认。
   - 目标：320-1920 无横向滚动、栅格自动堆叠、点击区≥40-44px、
     图片/表格/长链接/表单不撑破布局。
   ============================================================ */

*,
*::before,
*::after { box-sizing: border-box; }

html, body { max-width: 100%; overflow-x: hidden; }
body { -webkit-text-size-adjust: 100%; }

/* 媒体元素不超出容器 */
img, video, iframe, canvas, svg { max-width: 100%; }
img, video { height: auto; }

/* 长文本 / 长链接 / 单元格不撑破布局 */
p, li, dd, blockquote, td, th, h1, h2, h3, h4, h5, h6 { overflow-wrap: break-word; }
a { word-break: break-word; }
pre { white-space: pre-wrap; word-break: break-word; }
table { max-width: 100%; }

/* 2.0.101：正文宽表格改为横向可滚动，避免撑破栅格（table-wrap 外层按需生成/包裹均可生效） */
.pg-article-new, .blog-details, .post, .about-pad, .details, [itemprop="articleBody"] {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
[itemprop="articleBody"] table { margin: 12px 0; }

/* 2.0.101：分页「上一页/下一页」触控目标 ≥44px（原裸链接高度不足，手机难点） */
.pg-page-btn, .case-page-bar a, .pg-pagination .pages > a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    min-height: 44px;
    padding: 0 16px;
    border: 1px solid #e3eaf0;
    background: #fff;
    color: #1a73e8;
    border-radius: 4px;
    text-decoration: none;
}
.pg-page-btn:hover, .case-page-bar a:hover, .pg-pagination .pages > a:hover {
    background: #007291;
    border-color: #007291;
    color: #fff;
}

/* 表单控件宽度收敛 */
input, select, textarea { max-width: 100%; }
.form-control { width: 100%; }

/* ============================================================
   手机（≤767）：Bootstrap 栅格统一单列堆叠，杜绝并排溢出
   说明：站内部分内页列只写了 col-md-6 / col-md-4（缺 col-12），
   在 BS4 的 md 断点以下会退化为按内容宽度并排，导致横向溢出，
   这里统一在手机端强制占满整行。
   ============================================================ */
@media (max-width: 767px) {
    .row { display: flex; flex-wrap: wrap; }
    .row > [class*="col-"] { flex: 0 0 100%; max-width: 100%; }

    /* 内页卡片与大标题在窄屏收敛 */
    .pg-section { padding: 48px 0; }
    .pg-card { padding: 26px 20px 24px; }
    .pg-card .pg-card-num { font-size: 34px; }
    .pg-cta { padding: 52px 0; }
    .pg-cta h2 { font-size: 24px; }
    .pg-stats .pg-stats-title { font-size: 30px; }
    .pg-stats .pg-stats-lead { padding: 18px 4px 0; }
}

/* ============================================================
   平板及手机（≤991）：汉堡 + 右侧抽屉菜单
   ============================================================ */
@media (max-width: 991px) {
    .site-header #navbar { width: min(280px, 84vw); }

    /* 汉堡按钮点击区≥40px，层级高于首屏 */
    .site-header .navbar-header .open-btn {
        width: 44px;
        height: 40px;
        min-height: 40px;
        top: 10px;
        z-index: 120;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    /* 抽屉菜单项整行可点、高度≥46px */
    .site-header #navbar > ul > li > a {
        display: flex;
        align-items: center;
        min-height: 48px;
        padding-top: 12px;
        padding-bottom: 12px;
        font-size: 15px;
    }
    .site-header #navbar .close-navbar { min-width: 40px; min-height: 40px; }
}

/* ============================================================
   手机（≤768）
   ============================================================ */
@media (max-width: 768px) {
    /* 容器统一 16px 安全边距 */
    .container { padding-left: 16px; padding-right: 16px; }

    /* 顶部信息条紧凑、居中，避免三行过高 */
    .topbar { padding: 6px 0; }
    .topbar .container { padding-left: 12px; padding-right: 12px; }
    .topbar .col { padding-left: 6px; padding-right: 6px; }
    .topbar .text p {
        font-size: 11.5px;
        line-height: 1.55;
        margin: 2px 0;
        white-space: normal;
    }
    .topbar .text-left,
    .topbar .text-right,
    .topbar .text { text-align: center !important; }

    /* 区块纵向留白收敛 */
    .features-section,
    .story-section,
    .products-section,
    .uni-logos-section { padding-top: 44px; padding-bottom: 44px; }

    /* 服务 / 产品卡片 */
    .service-card-new { padding: 24px 18px 22px; }
    .service-card-new h4 { font-size: 17px; }
    .service-card-new p { font-size: 13.5px; line-height: 1.75; }
    .read-more { min-height: 40px; display: inline-flex; align-items: center; }

    /* 企业简介：窄屏强制图文上下堆叠，清零 row 负外边距，图片不越界 */
    .story-section .row { display: block; margin-left: 0; margin-right: 0; }
    .story-section .row > [class*="col-"] {
        display: block;
        width: 100%;
        max-width: 100%;
        flex: 0 0 100%;
        padding-left: 0;
        padding-right: 0;
    }
    .story-section .img-holder::before { display: none; }
    .story-section .img-holder { position: static; max-width: 100%; margin: 0 0 22px; overflow: hidden; }
    .story-section .img-holder img {
        position: static;
        left: auto;
        transform: none;
        display: block;
        width: 100%;
        max-width: 100%;
        height: auto;
        margin: 0;
    }

    /* 核心数据：2 列 */
    .data-section-new .fun-fact-grids { flex-wrap: wrap; }
    .data-section-new .fun-fact-grids .grid { flex: 0 0 50%; margin-bottom: 22px; }
    .data-section-new .info h3 { font-size: 30px; }
    .data-section-new .info p { font-size: 13px; }

    /* 高校墙：2 列，名称完整显示 */
    .uni-logo-item {
        flex: 0 0 calc(50% - 12px) !important;
        max-width: calc(50% - 12px) !important;
        padding: 14px 8px;
    }
    .uni-name { font-size: 14px; white-space: normal; line-height: 1.4; }

    /* 标题字号收敛 */
    .section-title-s3 h2,
    .section-title h2 { font-size: 24px; }

    /* 页脚 */
    .upper-footer { padding: 42px 0 18px; }
    .upper-footer .widget { margin-bottom: 26px; }
    .lower-footer .copyright,
    .lower-footer .extra-link { text-align: center; }
    .lower-footer .extra-link ul { padding-left: 0; }

    /* 通用主题按钮点击区 */
    .theme-btn-s2, .theme-btn-s5 { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; }

    /* 正文/新闻内图片自适应 */
    .blog-details img, .post img, .about-pad img, .details img { max-width: 100%; height: auto; }
}

/* ============================================================
   小屏手机（≤480）
   ============================================================ */
@media (max-width: 480px) {
    /* 核心数据改单列，避免文字拥挤 */
    .data-section-new .fun-fact-grids .grid { flex: 0 0 100%; }
    .data-section-new .grid .info { border-left-width: 2px; padding-left: 16px; }

    .uni-name { font-size: 13px; }
    .section-title-s3 h2,
    .section-title h2 { font-size: 22px; }
}

/* ============================================================
   超宽屏（≥1920）：内容容器适度收窄、首屏背景 cover 不变形
   ============================================================ */
@media (min-width: 1920px) {
    .hero-style-1 .slide-inner,
    .ddns-hero { background-size: cover; background-position: center center; }
}

/* ============================================================
   2.0.101 触控与安全区补强（全断点生效，仅增不改既有视觉）
   ============================================================ */

/* 桌面链接点击区下限：主导航/页脚/面包屑链接在触屏笔记本上也易点 */
.navbar-nav > li > a,
.footer-nav-list a,
.breadcrumb a { min-height: 44px; display: inline-flex; align-items: center; }

/* 案例网格/卡片链接整块可点（原 <a> 已包住卡片，此处仅保证触控反馈区） */
.case-link { display: block; }

/* 表单控件统一 44px 触控高度（搜索框/留言表单） */
.search-form input[type="text"],
.search-form input[type="search"],
.pg-form input,
.pg-form textarea { min-height: 44px; }

/* 移动端输入框字号 ≥16px：iOS Safari 在字号 <16px 时聚焦会强制放大页面，
   桌面端不介入（原字号与视觉完全不变） */
@media (max-width: 768px) {
    input, select, textarea { font-size: 16px; }
}