/* NEWS Page Styles - 五等分布局 */
:root {
    --news-design-width: 1920px;
    --news-unit-x: calc(120rem / 5); /* 水平1等分 = 24rem */
    --news-unit-y: calc(67.5rem / 5); /* 垂直1等分 = 13.5rem */
}

/* Page base settings */
.news-page {
    background: #FFFFFF;
    position: relative;
    width: 100%;
    height: calc(67.5rem); /* 1080px */
    max-height: calc(67.5rem);
    overflow: hidden !important;
}

/* Main content area */
.main-content {
    position: relative;
    width: 100%;
    height: calc(67.5rem);
    margin: 0 auto;
    overflow: hidden !important;
    max-width: calc(120rem); /* 1920px */
}

/* ==================== 主图片 - 水平第2等分，垂直第2等分，高度2/5 ==================== */
/* 水平：从1/5(24rem)处开始，宽度2/5(48rem) */
/* 垂直：从1/5(13.5rem)处开始，高度2/5(27rem) */
.main-image {
    position: absolute;
    left: calc(120rem / 5 - 4rem); /* 水平第2等分开始位置 */
    top: calc(67.5rem / 5 + 3rem); /* 上移5rem */
    width: calc(120rem * 1.8 / 5); /* 2/5宽度 */
    height: calc(67.5rem * 1.8 / 5); /* 2/5高度 */
    overflow: hidden;
}

.main-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* ==================== 日期和标题 - 水平第4等分，垂直第2等分开始 ==================== */
/* 水平：从3/5(72rem)处开始 */
/* 垂直：从1/5(13.5rem)处开始 */
.article-header {
    position: absolute;
    left: calc(120rem * 2.8 / 5); /* 水平第4等分开始位置 */
    top: calc(67.5rem / 5 - 3rem); /* 上移5rem */
    width: calc(120rem * 2 / 5); /* 2/5宽度，确保标题一行显示 */
    display: flex;
    flex-direction: column;
    gap: calc(0.5rem); /* 8px */
}

.article-title {
    font-family: var(--font-family);
    font-size: calc(1.75rem) !important;
    line-height: calc(2.25rem) !important;
    letter-spacing: calc(0.12rem);
    color: #000000;
    font-weight: 700;
    margin: 0;
    white-space: nowrap; /* 确保一行显示 */
}

.article-subtitle {
    font-family: var(--font-family);
    font-size: calc(1rem); /* 16px */
    line-height: calc(1.6rem);
    letter-spacing: calc(0.12rem);
    color: #404040;
    font-weight: 700;
    margin: 0;
    white-space: nowrap;
    text-transform: capitalize;
}

/* ==================== 正文内容 - 水平第4等分，垂直紧跟标题 ==================== */
/* 水平：从3/5(72rem)处开始，宽度1/5(24rem) */
/* 垂直：从第2等分+标题区域开始，占据剩余的3等分高度 */
.article-content {
    position: absolute;
    left: calc(120rem * 2.8 / 5); /* 水平第4等分开始位置 */
    top: calc(67.5rem / 5 + 3rem); /* 上移5rem，紧跟标题 */
    width: calc(120rem *1.5/ 5); /* 1.5/5宽度 */
    height: calc(67.5rem * 3 / 5 - 5rem); /* 剩余高度 */
}

.article-content p {
    /* font-family 继承自 body.lang-xx */
    font-size: calc(1rem); /* 16px */
    line-height: calc(1.6rem);
    letter-spacing: calc(0.08rem);
    color: #404040;
    text-align: justify;
    font-weight: 400;
    margin: 0;
}

/* 隐藏右侧容器（使用独立定位） */
.content-right {
    display: none;
}

/* 隐藏第二段 */
.article-content-2 {
    display: none;
}

/* ==================== 相关新闻列表 - 右下角 ==================== */
.related-news {
    position: absolute;
    right: calc(3.125rem); /* 与 header-right 右边界对齐 */
    bottom: calc(62.5rem / 5 + 5rem); /* 128px */
    display: flex;
    flex-direction: column;
    gap: calc(0.25rem); /* 4px */
    align-items: flex-end;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
}

.news-item {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: calc(0.375rem); /* 6px */
    text-decoration: none;
    transition: opacity 0.3s ease;
    cursor: pointer;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    -webkit-appearance: none;
    appearance: none;
}

.news-item:hover {
    opacity: 0.7;
}

.news-item.active .news-title {
    color: #000000;
    font-weight: 500;
}

.news-title {
    font-family: var(--font-family);
    font-size: calc(0.875rem); /* 14px */
    line-height: calc(1.25rem);
    letter-spacing: calc(0.075rem);
    color: #404040;
    text-align: right;
    text-transform: capitalize;
    font-weight: 400;
    white-space: nowrap;
}

.news-arrow {
    width: calc(1rem); /* 16px */
    height: calc(1rem); /* 16px */
    flex-shrink: 0;
}

.news-arrow path {
    stroke: #404040;
}

.news-item.active .news-arrow path {
    stroke: #000000;
}

/* ==================== 页面标题 "新闻" - 左下角，第1等分内 ==================== */
.page-title {
    position: absolute;
    left: calc(120rem / 5 - 4rem); /* 104px - 导航栏右侧 */
    bottom: calc(62.5rem / 5 + 5rem); /* 96px */
}

.page-title h2 {
    font-family: var(--font-family);
    font-size: calc(3rem); 
    line-height: calc(3.5rem); 
    letter-spacing: calc(0.225rem); 
    color: #000000;
    text-transform: uppercase;
    font-weight: 700;
    margin: 0;
}

/* "加载中..." 占位文案 */
.news-page [data-translate="status.loading"] {
    font-family: var(--font-family);
    font-size: calc(1rem);
    line-height: calc(1.5rem);
    letter-spacing: calc(0.1rem);
    color: #404040;
}
