/*
  新闻-2 (news_2) 公共样式: 浅灰底 左特色大卡 / 右三行图文列表。
  固定配色(蓝分类/灰日期/蓝链接)走这里; 实例配置(卡片标题颜色/大小/按钮/间距等)
  由模块模板内联 <style> 以 CSS 变量注入, 这里只放版式与固定色。
  无 js: hover 全部走 CSS; 移动端断点 1000px, 与 case_list_1 一致。
*/

.ly_news_2 {
    position: relative;
    overflow: hidden;
    background-color: #F8FAFC;
}

.ly_news_2 .section {
    position: relative;
}

/* ==================== 头部: 标题 + 右上链接 ==================== */

.ly_news_2 .n2_head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 40px;
}

/* 头部左侧列: 标题 + 副标题(描述行), 宽度上限放这里(标题跟着列走) */
.ly_news_2 .n2_head_left {
    max-width: 62%;
}

.ly_news_2 .n2_title {
    margin: 0;
    color: var(--deco-title-color, #17233B);
    font-size: var(--n2-pc-title-size, 40px);
    font-weight: 600;
    line-height: 1.25;
}

/* 副标题(描述行): 标题下方, 正常大小写、不带短横线, 颜色走公共 class 的 --deco-subtitle-color */
.ly_news_2 .n2_subtitle {
    margin-top: 10px;
    color: var(--deco-subtitle-color, #6B7280);
    font-size: var(--n2-pc-subtitle-size, 15px);
    font-weight: 400;
    line-height: 1.6;
}

/* 卡片文字对齐(nameAlign): 作用于卡片内全部文本(分类/时间/标题/简介/Read More), 默认居左;
   meta 是 flex 行, text-align 对它无效, 需配 justify-content 同步对齐 */
.ly_news_2[data-name-align="center"] .n2_feat_text,
.ly_news_2[data-name-align="center"] .n2_row_text { text-align: center; }
.ly_news_2[data-name-align="center"] .n2_meta { justify-content: center; }
.ly_news_2[data-name-align="right"] .n2_feat_text,
.ly_news_2[data-name-align="right"] .n2_row_text { text-align: right; }
.ly_news_2[data-name-align="right"] .n2_meta { justify-content: flex-end; }

/* 头部链接: 文字+箭头形态(无底无边框), 色值由配置注入 */
.ly_news_2 .n2_more {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    padding: 12px 44px 12px 0;
    color: var(--n2-btn-text-color, #2563EB);
    background-color: var(--n2-btn-bg-color, transparent);
    border: 1px solid var(--n2-btn-border-color, transparent);
    border-radius: var(--n2-pc-btn-radius, 0);
    font-family: var(--n2-btn-font, inherit);
    font-size: var(--n2-pc-btn-font-size, 14px);
    text-decoration: none;
    white-space: nowrap;
    transition: color .3s ease, background-color .3s ease, border-color .3s ease;
}

/* 横线箭头: 横线 + 右侧 ">" 斜角 */
.ly_news_2 .n2_more::after {
    content: '';
    position: absolute;
    right: 0;
    top: 50%;
    width: 26px;
    height: 1px;
    background-color: currentColor;
    transform: translateY(-50%);
}

.ly_news_2 .n2_more::before {
    content: '';
    position: absolute;
    right: 0;
    top: 50%;
    width: 8px;
    height: 8px;
    border-top: 1px solid currentColor;
    border-right: 1px solid currentColor;
    transform: translateY(-50%) rotate(45deg) scale(.9);
    margin-right: -2px;
}

.ly_news_2 .n2_more:hover {
    color: var(--n2-btn-text-hover-color, #1D4ED8);
    background-color: var(--n2-btn-bg-hover-color, transparent);
    border-color: var(--n2-btn-border-hover-color, transparent);
}

/* ==================== 左特色大卡 + 右三行列表 ==================== */

.ly_news_2 .n2_body {
    display: grid;
    grid-template-columns: minmax(0, 1.72fr) minmax(0, 1fr);
    gap: 40px;
    align-items: start;
}

/* ---- 特色大卡 ---- */

.ly_news_2 .n2_feat {
    display: block;
    overflow: hidden;
    text-decoration: none;
    background-color: var(--n2-card-bg-color, #FFFFFF);
    border: 1px solid var(--n2-card-border-color, #DDE5F2);
    border-radius: 8px;
}

.ly_news_2 .n2_feat_pic {
    position: relative;
    overflow: hidden;
    border-radius: 8px;
}

.ly_news_2 .n2_feat_pic img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: var(--n2-img-fit, cover);
    object-position: var(--n2-img-position, center center);
    transition: transform .5s ease;
}

.ly_news_2 .n2_feat:hover .n2_feat_pic img {
    transform: scale(1.04);
}

/* 封面比例: fit=设计稿特色图比例(886:290); 图片贴卡顶, 底角直角(设计稿), 顶角随卡圆角裁切 */
.ly_news_2 .n2_feat_pic { aspect-ratio: 886 / 290; border-radius: 8px 8px 0 0; }
.ly_news_2 .r_1_1 .n2_feat_pic { aspect-ratio: 1 / 1; }
.ly_news_2 .r_4_3 .n2_feat_pic { aspect-ratio: 4 / 3; }
.ly_news_2 .r_2_3 .n2_feat_pic { aspect-ratio: 2 / 3; }

/* 分类: 与日期同行, 位于时间左侧(不叠图); 设计稿胶囊: 浅蓝底 + 蓝字 + 全圆角 */
.ly_news_2 .n2_feat_cat,
.ly_news_2 .n2_row_cat {
    padding: 3px 10px;
    color: #2563EB;
    font-size: 12px;
    line-height: 1.4;
    background-color: var(--n2-cat-bg-color, #E8F1FD);
    border-radius: var(--n2-cat-radius, 12px);
}

.ly_news_2 .n2_feat_text {
    padding: 20px 32px 24px;
}

.ly_news_2 .n2_meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 14px;
}

.ly_news_2 .n2_date {
    color: #9CA3AF;
    font-size: 12px;
    line-height: 1.4;
}

.ly_news_2 .n2_feat_name {
    margin-top: 12px;
    color: var(--n2-name-color, #17233B);
    font-size: 24px;
    font-weight: 600;
    line-height: 1.35;
}

.ly_news_2 .n2_feat_brief {
    margin-top: 12px;
    color: var(--n2-brief-color, #6B7280);
    font-size: var(--n2-pc-brief-size, 15px);
    line-height: 1.6;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Read More 文字链接: 颜色/字号由配置注入 + ">" 斜角 */
.ly_news_2 .n2_feat_more {
    position: relative;
    display: inline-flex;
    align-items: center;
    margin-top: 16px;
    padding-right: 16px;
    color: var(--n2-read-color, #2563EB);
    font-size: var(--n2-pc-read-size, 14px);
    line-height: 1.4;
    transition: color .3s ease, opacity .3s ease;
}

.ly_news_2 .n2_feat_more::after {
    content: '';
    position: absolute;
    right: 0;
    top: 50%;
    width: 6px;
    height: 6px;
    border-top: 1px solid currentColor;
    border-right: 1px solid currentColor;
    transform: translateY(-50%) rotate(45deg) scale(.9);
}

/* hover 用 opacity 而不是写死深蓝: 用户换成任意颜色后 hover 依然协调 */
.ly_news_2 .n2_feat:hover .n2_feat_more {
    opacity: .75;
}

/* ---- 右侧行列表 ---- */

.ly_news_2 .n2_rows {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.ly_news_2 .n2_row {
    display: flex;
    gap: 18px;
    align-items: stretch;
    background-color: var(--n2-card-bg-color, #FFFFFF);
    border: 1px solid var(--n2-card-border-color, #DDE5F2);
    border-radius: 8px;
    text-decoration: none;
}

/* 行缩略图: 贴卡左侧通高(高度=卡片高度, 左上/左下贴边直角随卡圆角)。
   高度必须是确定值(基准 180px): 若高度留 auto, 卡片高度会被图片固有比例撑开——
   竖图在 4:3 档位下按 240 宽算出 326 高, 卡片跟着变高, 图片显示的是自己的竖构图, 比例配置等于失效。
   给死高度后 卡片高=max(文字高,180), 图片按 cover 裁切填满, 比例严格成立。
   基准高 180px ≈ 两行标题+两行简介的自然高; 文字超过 180(极端大字号)时图片不拉伸, 下方留白 */
.ly_news_2 .n2_row_pic {
    flex: none;
    width: 138px;
    height: 180px;
    overflow: hidden;
    border-radius: 8px 0 0 8px;
}

/* 封面比例(行图): 高度恒 180px, 比例由宽度决定 — 1:1→180 / 4:3→240 / 2:3→120; fit=设计稿宽 138px */
.ly_news_2 .r_1_1 .n2_row_pic { width: 180px; }
.ly_news_2 .r_4_3 .n2_row_pic { width: 240px; }
.ly_news_2 .r_2_3 .n2_row_pic { width: 120px; }

.ly_news_2 .n2_row_pic img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: var(--n2-img-fit, cover);
    object-position: var(--n2-img-position, center center);
    transition: transform .5s ease;
}

.ly_news_2 .n2_row:hover .n2_row_pic img {
    transform: scale(1.06);
}

.ly_news_2 .n2_row_text {
    flex: 1;
    min-width: 0;
    padding: 20px 20px 20px 0;
}

.ly_news_2 .n2_row_name {
    margin-top: 8px;
    color: var(--n2-name-color, #17233B);
    font-size: var(--n2-pc-name-size, 15px);
    font-weight: 600;
    line-height: 1.45;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    transition: color .3s ease;
}

.ly_news_2 .n2_row:hover .n2_row_name {
    color: #2563EB;
}

.ly_news_2 .n2_row_brief {
    margin-top: 8px;
    color: var(--n2-brief-color, #6B7280);
    font-size: var(--n2-pc-brief-size, 15px);
    line-height: 1.55;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* ==================== 移动端 ==================== */

@media screen and (max-width: 1000px) {
    .ly_news_2 .n2_head {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
        margin-bottom: 24px;
    }

    .ly_news_2 .n2_head_left {
        max-width: 100%;
    }

    .ly_news_2 .n2_title {
        font-size: var(--n2-mobile-title-size, 26px);
    }

    .ly_news_2 .n2_subtitle {
        font-size: var(--n2-mobile-subtitle-size, 14px);
    }

    .ly_news_2 .n2_more {
        font-size: var(--n2-mobile-btn-font-size, 13px);
        border-radius: var(--n2-mobile-btn-radius, 0);
    }

    .ly_news_2 .n2_body {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    /* 单列下特色图放高一点 */
    .ly_news_2 .n2_feat_pic { aspect-ratio: 4 / 3; }
    .ly_news_2 .r_1_1 .n2_feat_pic { aspect-ratio: 1 / 1; }
    .ly_news_2 .r_4_3 .n2_feat_pic { aspect-ratio: 4 / 3; }
    .ly_news_2 .r_2_3 .n2_feat_pic { aspect-ratio: 2 / 3; }

    .ly_news_2 .n2_feat_text { padding: 16px 20px 20px; }
    .ly_news_2 .n2_feat_name { font-size: 18px; }
    .ly_news_2 .n2_feat_brief { font-size: var(--n2-mobile-brief-size, 14px); }
    .ly_news_2 .n2_feat_more { font-size: var(--n2-mobile-read-size, 13px); }

    .ly_news_2 .n2_rows { gap: 12px; }
    .ly_news_2 .n2_row { gap: 14px; }
    .ly_news_2 .n2_row_pic { width: 110px; height: 120px; }
    .ly_news_2 .r_1_1 .n2_row_pic { width: 120px; }
    .ly_news_2 .r_4_3 .n2_row_pic { width: 160px; }
    .ly_news_2 .r_2_3 .n2_row_pic { width: 80px; }
    .ly_news_2 .n2_row_text { padding: 16px 14px 16px 0; }
    .ly_news_2 .n2_row_name { font-size: var(--n2-mobile-name-size, 14px); }
    .ly_news_2 .n2_row_brief { display: none; }
}
