/* ==================== Company页面样式 ==================== */
:root {
    --company-design-width: 1920px;
}

.company-page {
    background: var(--bg-white);
    position: relative;
    width: 100%;
    height: calc(67.5rem); /* 1080px 设计稿高度，随 rem 缩放 */
    max-height: calc(67.5rem);
    display: flex;
    flex-direction: column;
    overflow: hidden !important;
}

.company-page .main-content {
    position: relative;
    width: 100%;
    /* 固定高度，单视窗显示 */
    height: calc(67.5rem); /* 1080px 设计稿高度 */
    background: var(--bg-white);
    overflow: hidden !important;
    padding: calc(3.125rem); /* 50px */
    box-sizing: border-box;
    max-width: calc(120rem); /* 1920px */
    margin-left: auto;
    margin-right: auto;
}

/* ==================== 标题区域 ==================== */
/* ABOUT US: x="358" y="249" width="282" height="56" （Figma 1920 宽度） */
.page-title {
    position: absolute;
    left: calc(22.375rem);
    top: calc(10rem);
}

.page-title h1 {
    /* font-family 继承自 body.lang-xx，无需重复声明 */
    font-size: calc(3rem);
    line-height: calc(3.5rem);
    letter-spacing: calc(0.12rem);
    text-transform: uppercase;
    font-weight: 700;
    margin: 0;
    width: auto;
    white-space: nowrap;
    height: 56px;
}

/* ==================== 描述文本区域 ==================== */
/* x="358" y="401" width="279" height="264" */
.description-text {
    position: absolute;
    left: calc(22.375rem);
    top: calc(18rem);
    /* 为适配当前中文文案长度，略微加宽文本区域，减少换行高度 */
    width: calc(28rem);
    height: auto;
}

.description-text p {
    /* font-family 继承自 body.lang-xx */
    font-size: calc(1rem);
    line-height: calc(1.5rem);
    color: var(--primary-gray);
    text-align: justify;
    font-weight: 400;
    margin: 0;
}

/* ==================== 统计数据区域 ==================== */
/* Frame 156: x="358" y="798" width="279" height="56" */
.stats-section {
    position: absolute;
    left: calc(30rem);
    /* 相比 Figma 原始 798px 略向下移动，避免与更长的描述文案发生重叠 */
    top: calc(42rem);
    width: calc(12.4375rem);
    height: calc(1.6rem);
    display: flex;
    align-items: center;
    /* 使用固定间距而不是两端对齐，保证 20+ / 23 / 500+ 与分隔线相对位置稳定 */
    justify-content: center;
    gap: calc(0.25rem);
}

/* Frame 154/155/156: width="93" height="56" */
.stat-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: calc(7.8125rem);
    height: calc(3.5rem);
}

/* Text "20+": width="93" height="32" */
.stat-number {
    font-family: var(--font-family);
    font-size: calc(1.75rem);
    line-height: calc(2.25rem);
    letter-spacing: calc(0.12rem);
    text-transform: capitalize;
    color: #404040;
    font-weight: 700;
    margin: 0;
    width: calc(7.8125rem);
    height: calc(2rem);
    text-align: center;
}

/* Text "公司年龄": x="12" y="32" width="69" height="24" */
.stat-label {
    font-family: var(--font-family);
    font-size: calc(1rem);
    line-height: calc(2rem);
    letter-spacing: calc(0.1rem);
    color: var(--primary-gray);
    margin: 0;
    /* 删除 width 和 height */
    /* width: calc(4.3125rem); */
    /* height: calc(1.5rem); */
    text-align: center;
    white-space: nowrap;
}

/* Vector dividers: x="93/186" y="10" height="36" */
/* 在CSS文件末尾添加 !important 强制生效 */
.stat-divider {
    width: 0.8px !important;  /* 先用粗一点的线 */
    height: 1.8rem !important;
    background: #d9d9d9 !important; 
    margin: auto 1rem !important;  /* 增加水平间距 */
    display: block !important;
    flex-shrink: 0 !important;  /* 防止flex压缩 */
}

/* ==================== 主图片区域 ==================== */
/* image 13: x="821" y="393" width="741" height="465" */
.main-image {
    position: absolute;
    left: calc(55rem);
    top: calc(18.2rem);
    width: calc(36rem);
    height: calc(22rem);
    overflow: hidden;
}

.main-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.main-image:hover img {
    transform: scale(1.05);
}

/* ==================== More按钮 ==================== */
/* Frame 2147207692: x="1506" y="874" width="56" height="24" */
/* 右边界与 main-image 右边界对齐: 53.375rem + 42rem = 95.375rem, 120rem - 95.375rem = 24.625rem */
.more-button {
    position: absolute;
    right: calc(29rem);
    top: calc(43rem);
    min-width: calc(3.5rem);
    height: calc(1.5rem);
    display: flex;
    align-items: center;
    justify-content: flex-end; /* 内容靠右对齐，箭头固定在右边界 */
    /* 间距随分辨率缩放，保持与文字比例一致 */
    gap: calc(0.3125rem);
    cursor: pointer;
    white-space: nowrap; /* 禁止折行 */
    transition: opacity 0.3s ease;
    text-decoration: none;
}

.more-button img {
    flex-shrink: 0; /* 箭头图标不收缩，保持固定大小 */
    width: calc(1rem); /* 16px */
    height: calc(1rem); /* 16px */
}

.more-button span {
    font-family: var(--font-family);
    /* 与首页 shop.com 相同的缩放规则：基于 1920 设计宽度等比缩放 */
    font-size: calc(1rem);
    line-height: calc(1.6rem);
    color: #404040;
}

.more-button svg {
    width: calc(1rem);
    height: calc(1rem);
}

.more-button:hover {
    opacity: 0.6;
}

/* ==================== 动画效果 ==================== */
@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.page-title {
    animation: fadeIn 0.8s ease-out 0.2s both;
}

.description-text {
    animation: fadeIn 0.8s ease-out 0.4s both;
}

.stats-section {
    animation: fadeIn 0.8s ease-out 0.6s both;
}

.main-image {
    animation: fadeIn 0.8s ease-out 0.8s both;
}

.more-button {
    animation: fadeIn 0.8s ease-out 1s both;
}
/* 取消 company 页面的断点重排，保持与 Home 相同的“整画布等比缩放”逻辑 */