/* 
 * 云南震序律师事务所网站 - 团队列表页面 响应式样式
 * 版本: V4 - 新断点方案：PC 4列, 1200px 3列, 768px 2列, 240px 1列
 */

/* --- 大屏幕到中等屏幕 (例如 <=1200px 时变为3列) --- */
@media (max-width: 1200px) {
    /* 团队Banner调整 */
    .team-banner {
        height: auto !important; 
        padding: 80px 0 50px 0 !important; /* 略微减少padding */
        margin-top: 80px !important; 
    }
    .team-banner .banner-content {
        position: static !important;
        transform: none !important;
        width: 100%; 
        text-align: center;
        padding: 0 15px;
        box-sizing: border-box;
    }
    .team-banner .banner-content h2,
    .team-banner .banner-content .banner-subtitle p {
        white-space: normal !important; 
        word-break: break-word !important;
    }
    .team-banner h2 {
        font-size: 42px !important; 
    }
    .team-banner .banner-subtitle {
        font-size: 18px !important; 
        margin-top: 10px; /* 副标题与上方H2的间距 */
    }
    .scroll-down {
        position: static !important; /* 改为static定位 */
        transform: none !important; /* 移除transform */
        display: block !important; /* 确保是块级元素以便margin:auto生效 */
        width: 24px !important; /* 图片宽度 */
        margin: 20px auto 0 auto !important; /* 上边距20px，左右自动实现居中 */
        /* bottom, left不再需要 */
    }

    .team-list .row { /* 行容器 */
        display: flex !important;
        flex-wrap: wrap !important;
        margin-left: -15px !important; /* 对应下方列的padding */
        margin-right: -15px !important;
    }

    /* 律师卡片列容器 - 3列布局 */
    .team-list .col-md-3.col-sm-6.col-6 {
        width: 33.3333% !important; 
        max-width: 33.3333% !important; 
        flex-basis: 33.3333% !important; 
        padding: 0 15px !important; /* 列的左右padding */
        box-sizing: border-box !important; /* 确保padding不撑大宽度 */
        margin-bottom: 30px !important; /* 保持卡片行间距 */
    }
    
    .team-video-container video {
        width: 100% !important; 
        height: auto !important;
    }

    .team-filter ul {
        padding: 0 10px !important; 
    }

    /* 团队介绍区域的父 .row 容器 */
    .team-introduction-row { 
        display: flex !important; 
        align-items: stretch !important; 
        flex-wrap: wrap !important; 
    }

    .team-introduction-row > .col-md-6 { 
        display: flex !important;
        flex-direction: column !important;
        min-height: 1px; /* 同PC端，防止意外折叠 */
    }

    .team-introduction-row > .col-md-6:first-child { /* 左侧文字列 */
        justify-content: flex-start; /* 与PC端一致，内容从顶部开始 */
        /* padding-right 在1200px断点下可以按需调整，例如若PC是20px，这里可设为15px或保持 */
        padding-right: 15px; /* 假设在1200px下减小一点间距 */
        box-sizing: border-box;
    }

    .team-introduction-row > .col-md-6:nth-child(2) { /* 包裹视频的右侧列 */
        justify-content: flex-end !important; 
    }

    .team-introduction-row .team-video-container {
        position: static !important; 
        width: 100% !important; 
        margin: 0 auto 0 auto !important; /* 同PC端，上下0，左右auto */
        padding: 0 !important; 
        box-sizing: border-box !important;
    }

    .team-introduction-row .team-video-container video { 
        width: 100% !important; 
        height: auto !important;
        display: block !important;
        /* 在1200px断点，视频宽度应撑满其列，所以max-width:100%或不设，不应是固定像素值如575px */
        /* max-width: 100%; */ 
        margin: 0 auto !important; /* 确保视频在容器内居中 */
    }

    /* 困境企业重组中心响应式样式 */
    .restructuring-center .team-introduction-row {
        display: flex !important;
        flex-wrap: wrap !important;
    }

    .restructuring-center .team-video-container img {
        width: 100% !important;
        height: auto !important;
        max-width: 100% !important;
    }
}

/* --- 中等屏幕到平板竖屏 (例如 <=768px 时变为2列，并应用500px卡片方案) --- */
@media (max-width: 768px) {
    /* 团队Banner进一步调整 */
    .team-banner {
        padding: 60px 0 30px 0 !important; /* 进一步减少padding */
        margin-top: 60px !important; 
    }
    .team-banner h2 {
        font-size: 28px !important; /* 略微减小字体 */
        margin-bottom: 8px !important; /* 减小h2之间的默认间距 */
    }
     .team-banner h2:last-of-type { /* 指的是包含"法律服务"的那个h2 */
        margin-bottom: 10px !important; /* 这个h2与下方副标题的间距 */
    }
    .team-banner .banner-subtitle {
        font-size: 14px !important; /* 略微减小字体 */
        line-height: 1.6 !important;
    }
    .mobile-break { /* 移动端显示换行 */
        display: block !important;
    }
    /* .scroll-down 样式将从1200px断点继承并应用 */
    /* 如果需要在768px下进一步调整与上方内容的间距，可以像这样： */
    /* .scroll-down {
        margin-top: 15px !important; 
    } */

    .team-list .row { /* 行容器 */
        display: flex !important;
        flex-wrap: wrap !important;
        margin-left: -7.5px !important; /* 对应下方列的padding (15px / 2) */
        margin-right: -7.5px !important;
    }

    /* 律师卡片列容器 - 2列布局 */
    .team-list .col-md-3.col-sm-6.col-6 {
        width: 50% !important; 
        max-width: 50% !important;
        flex-basis: 50% !important;
        padding: 0 7.5px !important; /* 列的左右padding (15px / 2) */
        box-sizing: border-box !important; 
        margin-bottom: 20px !important; 
    }

    /* --- 律师卡片详细布局 (500px总高方案) --- */
    .lawyer-profile-card {
        width: 100% !important; 
        height: 470px !important; 
        display: flex !important;
        flex-direction: column !important;
        box-shadow: 0 2px 8px rgba(0,0,0,0.1) !important; 
    }

    .lawyer-profile-card .lawyer-photo {
        height: 250px !important; 
        width: 100% !important;
        object-fit: cover !important;
        object-position: top !important;
        overflow: hidden !important;
        flex-shrink: 0 !important;
    }

    .lawyer-profile-card .lawyer-photo img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        object-position: top !important;
    }

    .lawyer-profile-card .lawyer-info {
        height: 220px !important; 
        min-height: 220px !important; 
        padding: 10px !important; /* 恢复5px的padding */
        display: flex !important;
        flex-direction: column !important;
        box-sizing: border-box !important; 
        overflow: hidden !important; 
        text-align: center !important; 
        position: relative !important; /* 父容器保持relative，为可能的其他绝对定位子元素服务 */
        background-color: #fff !important; 
    }

    /* 1. 人名区 */
    .lawyer-profile-card .lawyer-info > div:first-child {
        height: 36px !important;
        min-height: 36px !important;
        margin: 0 auto 3px auto !important; 
        overflow: hidden !important;
        flex-shrink: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important; 
        align-items: center !important; 
        width: 100%; 
    }
    .lawyer-profile-card .lawyer-info > div:first-child h5 { /* 包裹中文名和英文span的h5 */
        font-size: 16px !important; /* 中文名移动端字号 */
        line-height: 1.2 !important; /* 调整行高以适应两行紧凑显示 */
        color: #002B70 !important;
        margin: 0 !important;
        font-weight: bold !important;
        text-align: center !important;
        display: block !important; /* 覆盖PC端的display:flex，让h5表现为普通块级，其内部span再独立成行 */
        width: auto; /* 或者 width: fit-content; 确保居中 */
    }
    .lawyer-profile-card .lawyer-info > div:first-child h5 span { /* 英文名 span */
        font-size: 11px !important;
        line-height: 1.2 !important; 
        color: #000000 !important;
        font-weight: normal !important;
        display: block !important; /* 确保英文名自己占一行 */
        margin-bottom: 5px !important; /* 调整与中文名的间距，设为0或一个很小的值 */ 
        text-align: center !important;
    }

    /* 2. 头衔区 */
    .lawyer-profile-card .lawyer-info > div:nth-child(2) { 
        height: 54px !important; 
        min-height: 54px !important;
        margin: 0 auto 3px auto !important; /* 使用之前确定的3px下边距 */
        overflow: hidden !important;
        flex-shrink: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: flex-start !important; 
        align-items: center !important;
        width: 100%;
    }
    .lawyer-profile-card .lawyer-info > div:nth-child(2) h5 { 
        font-size: 12px !important;
        line-height: 1.5 !important; 
        color: #F4AD03 !important;
        margin: 0 !important; 
        font-weight: normal !important;
        text-align: center !important; /* 移动端头衔居中 */
    }

    /* 3. 分割线 */
    .lawyer-profile-card .lawyer-info > div:nth-child(3) { 
        width: 90% !important;
        height: 1px !important;
        min-height: 1px !important;
        background-color: #bbb !important;
        margin: 0 auto 3px auto !important; /* 使用之前确定的3px下边距 */
        position: static !important; 
        transform: none !important;
        flex-shrink: 0 !important;
    }

    /* 4. 业务领域容器 */
    .lawyer-profile-card .lawyer-info .business-area {
        position: static !important; 
        top: auto !important;
        right: auto !important;
        bottom: auto !important;
        left: auto !important;
        height: 100px !important; /* 原为140px, 减少27px */
        min-height: 100px !important; /* 原为140px, 减少27px */
        overflow: hidden !important; 
        display: flex !important;
        flex-direction: column !important;
        justify-content: flex-start !important; 
        flex-shrink: 0 !important; 
        margin: 0 !important; 
        padding: 0 !important; 
        box-sizing: border-box !important;
        width: 100% !important;
    }

    /* 4a. 业务领域标题 */
    .lawyer-profile-card .lawyer-info .business-area h5:first-child {
        font-size: 14px !important;
        line-height: 1.5 !important; 
        color: #F4AD03 !important;
        margin: 0 auto 2px auto !important; 
        height: 21px !important; 
        min-height: 21px !important;
        overflow: hidden !important;
        flex-shrink: 0 !important;
        font-weight: bold !important;
        width: 100%;
        text-align: center !important; 
    }

    /* 4b. 业务领域内容 */
    .lawyer-profile-card .lawyer-info .business-area h5:last-child {
        font-size: 12px !important;
        line-height: 1.5 !important; 
        color: #333 !important;
        margin: 0 !important; 
        height: 75px !important; /* 原为117px, 减少27px, 约5行文本 */
        min-height: 75px !important; /* 原为117px, 减少27px */
        overflow: hidden !important;
        flex-shrink: 0 !important;
        font-weight: normal !important;
        width: 100%; 
        text-align: justify !important; 
        box-sizing: border-box !important; 
        padding: 0 !important; 
    }
    /* --- End of 500px card layout --- */

    .team-list-page {
        padding-bottom: 40px !important;
    }
    .team-filter {
        margin-bottom: 30px !important;
    }
    .team-filter li {
        margin: 0 2px 6px !important;
    }
    .team-filter li a {
        padding: 5px 12px !important;
        font-size: 12px !important;
    }
    .pagination {
        margin-top: 30px !important;
    }
    .pagination ul li a {
        padding: 5px 10px !important;
        font-size: 12px !important;
    }

    /* 团队介绍区域调整 */
    .team-list-page .row > .col-md-6:first-child > div:first-child h2 {
        font-size: 32px !important; /* 调整主标题大小 */
        text-align: center !important;
    }
    .team-list-page .row > .col-md-6:first-child > div:first-child p {
        font-size: 18px !important; /* 调整英文标题大小 */
        text-align: center !important; /* 英文居中 */
        margin-bottom: 15px !important; /* 增加和下方标题的间距 */
    }
    .team-list-page .row > .col-md-6:first-child > div:first-child h2 + p + h2 { /* "和正律师团队"这个H2 */
        margin-top: 0px !important; /* 如果上面P有了margin-bottom，这里可以减小 */
    }

    .team-list-page .row > .col-md-6:first-child > div:nth-child(2) { /* 包裹前两段介绍文字的div */
        padding: 0 0px !important; /* 设置左右内边距，覆盖内联的padding-right */
        box-sizing: border-box !important;
    }
    
    .team-list-page .row > .col-md-6:first-child > div:nth-child(2) p { /* 前两段介绍文字的 <p> 标签 */
        font-size: 16px !important;
        line-height: 1.7 !important;
        text-align: justify !important;
        text-indent: 2em !important; /* 首行缩进2字符 */
        margin-bottom: 1em !important; /* 段落间距 */
    }
    .team-list-page .row > .col-md-6:first-child > div:nth-child(2) p:last-child {
        margin-bottom: 0 !important; /* 最后一段下方无额外间距 */
    }

    /* 视频容器的父列 */
    .team-list-page .row > .col-md-6:nth-child(2) { /* 包裹视频的那个 .col-md-6 */
        margin-top: -10px !important; /* 与上方文本内容隔开 */
        padding: 0 15px !important; /* 确保此列内容与页面边缘有间距 */
        box-sizing: border-box !important;
        margin-bottom: -20px !important; /* 与下方内容隔开 */
    }

    .team-list-page .team-video-container {
        position: static !important; 
        width: 100% !important; 
        margin: 0 auto !important; 
        /* padding: 0 15px;  移除了这里的padding，由父列控制 */
        box-sizing: border-box;
    }

    .team-list-page .team-video-container video {
        width: 100% !important; 
        height: auto !important; 
        max-width: 480px; 
    display: block;
        padding-top: 40px;
        margin: 0 auto; 
    }

    .team-list-page .team-bottom-content { /* 视频下方大段文字的容器 */
        padding: 0 0px !important; /* 确保此区域内容与页面边缘有间距 */
        box-sizing: border-box !important;
    }

    .team-list-page .team-bottom-content p {
        font-size: 16px !important;
        line-height: 1.7 !important;
        text-align: justify !important;
        text-indent: 2em !important; /* 首行缩进2字符 */
        margin-bottom: 1em !important; /* 段落间距 */
    }
    .team-list-page .team-bottom-content p:last-child {
        margin-bottom: 0 !important;
    }

    .team-introduction-row > .col-md-6:first-child > div:nth-child(2) { /* 包裹前两段介绍文字的div */
        padding: 0 15px !important; /* 之前设置的左右内边距 */
        /* padding-right:0; 已被上面覆盖，这里不再需要 */
    }

    /* 视频容器的父列 (在768px会堆叠) */
    .team-introduction-row > .col-md-6:nth-child(2) { 
        margin-top: 30px !important; 
        padding: 0 15px !important; 
        margin-bottom: 30px !important; 
        justify-content: flex-start; /* 在堆叠时，不需要flex-end */
    }

    .team-introduction-row .team-video-container video {
        max-width: 480px; /* 保持之前为768px断点设置的视频最大宽度 */
        margin: 0 auto; /* 配合max-width居中 */
    }

    .team-list-page .team-bottom-content { /* 确保选择器依然正确 */
        padding: 0 15px ; 
    }

    /* 困境企业重组中心移动端样式 */
    .restructuring-center .team-introduction-row {
        flex-direction: column !important; /* 改为正常顺序，文字在上，图片在下 */
    }
    
    .restructuring-center .team-introduction-row > .col-md-6 {
        width: 100% !important;
        max-width: 100% !important;
        flex-basis: 100% !important;
        padding: 0 15px !important;
        box-sizing: border-box !important;
    }

    .restructuring-center .team-introduction-row > .col-md-6:first-child {
        margin-top: 0px !important; /* 移除顶部间距 */
        margin-bottom: 20px !important; /* 添加底部间距 */
        order: 1 !important; /* 确保文字部分在前 */
    }

    .restructuring-center .team-introduction-row > .col-md-6:nth-child(2) {
        order: 2 !important; /* 确保图片部分在后 */
    }

    .restructuring-center .team-introduction-row > .col-md-6:first-child > div:first-child {
        margin-bottom: 15px !important; /* 标题与文字内容之间的间距 */
    }

    .restructuring-center .team-introduction-row > .col-md-6:first-child > div:first-child h2 {
        font-size: 32px !important; /* 调整标题大小 */
        text-align: center !important;
    }

    .restructuring-center .team-introduction-row > .col-md-6:first-child > div:first-child p {
        font-size: 18px !important; /* 调整英文标题大小 */
        text-align: center !important; /* 英文居中 */
    }

    .restructuring-img-container {
        margin-top: 0px !important;
        margin-bottom: 20px !important;
    }

    .restructuring-center .team-video-container img {
        max-height: 350px !important;
        object-position: top !important;
    }

    .restructuring-center .team-bottom-content {
        padding: 0 15px !important;
        margin-top: 20px !important;
    }
}

/* --- 小屏幕手机 (例如 <=380px 时变为1列, 根据用户文件调整断点值) --- */
@media (max-width: 360px) {
    .team-list .row { /* 行容器 */
        display: flex !important;
        flex-wrap: wrap !important;
        margin-left: -5px !important; /* 对应下方列的padding */
        margin-right: -5px !important;
    }
    /* 律师卡片列容器 - 1列布局 */
    .team-list .col-md-3.col-sm-6.col-6 {
        width: 100% !important; 
        max-width: 100% !important;
        flex-basis: 100% !important;
        padding: 0 5px !important; /* 列的左右padding */
        box-sizing: border-box !important; 
        margin-bottom: 20px !important; 
    }

    /* 对于极小屏幕，可以考虑进一步调整卡片内部布局 */
    /* .lawyer-profile-card {
        height: auto !important; 
    }
    .lawyer-profile-card .lawyer-info {
        height: auto !important;
        min-height: 0 !important;
    } */
    .team-filter li a {
        padding: 4px 8px !important;
         font-size: 11px !important;
    }

    /* 困境企业重组中心小屏幕样式 */
    .restructuring-center .team-video-container img {
        max-height: 280px !important;
    }
}