/* ============================================================
   全站响应式适配补丁（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%; }

/* 表单控件宽度收敛 */
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; }
}