/* ============================================================
   leaders.html 移动端精准适配样式
   作用域：.about-page（leaders.html 专属）
   设计稿：「现任领导wap」蓝湖设计图
   设计基线：375px 视口
   规则：本文件仅在 ≤768px 生效，PC 端样式完全不受影响
   ============================================================ */

/* PC 端隐藏移动端专用元素 */
.about-page .page-title {
    display: none;
}

/* ---------- ≤768px：移动端核心适配 ---------- */
@media (max-width: 768px) {
    /* 当前位置前缀 */
    .about-page .breadcrumb-prefix {
        display: inline;
        color: #8C8C8C;
    }

    /* 页面标题（sidebar已有，移动端隐藏） */
    .about-page .page-title {
        display: none;
    }

    /* 内容区上边距微调 */
    .about-page .content-area {
        padding-top: 4px;
    }

    /* 领导列表间距 */
    .about-page .leaders-list {
        gap: 15px;
        margin-bottom: 30px;
    }

    /* 领导卡片：左图右文，顶部对齐 */
    .about-page .leader-card {
        height: auto;
        min-height: 120px;
        align-items: flex-start;
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.06);
    }

    /* 领导卡片 */
    .about-page .leader-card {
        background: #F8F8FB;
        position: relative;
    }

    /* 右上角图标 33*33(设计稿) → 16px */
    .about-page .leader-card::after {
        content: '';
        position: absolute;
        top: 8px;
        right: 8px;
        width: 33px;
        height: 33px;
        background: url('../hnu-images/about/logo-watermark@2x.png') center center no-repeat;
        background-size: contain;
        pointer-events: none;
        z-index: 1;
    }

    /* 照片尺寸：保持 3:4 人像比例 */
    .about-page .leader-photo {
        width: 70px;
        height: 94px;
        min-height: auto;
        flex-shrink: 0;
    }

    /* 信息区 */
    .about-page .leader-info {
        padding: 12px 12px 12px 15px;
        background: #F8F8FB;
    }

    /* 院徽水印装饰 */
    .about-page .leader-info::after {
        width: 50px;
        height: 50px;
        right: 10px;
        bottom: 10px;
        opacity: 0.18;
    }

    /* 职位姓名 */
    .about-page .leader-position-name {
        font-size: 15px;
        margin-bottom: 8px;
        line-height: 1.4;
    }

    /* 元信息 */
    .about-page .leader-meta {
        font-size: 12px;
        line-height: 1.75;
        color: #333;
    }

    .about-page .leader-meta p {
        margin-bottom: 2px;
    }

    .about-page .leader-meta span {
        color: #333;
    }

    /* 移动端禁用 hover 状态，避免触摸设备 stuck */
    .about-page .leader-card:hover {
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.06);
    }

    .about-page .leader-card:hover .leader-info {
        background: #fff;
    }

    .about-page .leader-card:hover .leader-position-name {
        color: #333;
    }

    .about-page .leader-card:hover .leader-meta {
        color: #333;
    }

    .about-page .leader-card:hover .leader-meta span {
        color: #666;
    }
}

/* ---------- ≤576px：小屏手机微调 ---------- */
@media (max-width: 576px) {
    .about-page .page-title {
        font-size: 16px;
        margin-bottom: 16px;
    }

    .about-page .page-title::after {
        bottom: -5px;
        height: 2px;
    }

    .about-page .leader-photo {
        width: 70px;
        height: 94px;
    }

    .about-page .leader-info {
        padding: 10px;
    }

    .about-page .leader-info::after {
        width: 40px;
        height: 40px;
        right: 8px;
        bottom: 8px;
    }

    .about-page .leader-position-name {
        font-size: 14px;
        margin-bottom: 6px;
    }

    .about-page .leader-meta {
        font-size: 11px;
        line-height: 1.65;
    }
}

/* ---------- ≤375px：iPhone SE/mini 等超小屏 ---------- */
@media (max-width: 375px) {
    .about-page .leader-photo {
        width: 70px;
        height: 94px;
    }

    .about-page .leader-info {
        padding: 8px 10px;
    }

    .about-page .leader-position-name {
        font-size: 13px;
    }

    .about-page .leader-meta {
        font-size: 13px;
    }
}