﻿.page-header-section {
    width: 100%;
    overflow: hidden;
}

/* 1. PC 端布局：固定高度或视口高度，确保右侧主体不被遮挡 */
.page-header-bg {
    width: 100%;
    height: 45vh;
    min-height: 380px;
    background-repeat: no-repeat;
    background-size: cover;
    /* 关键：定位靠右，确保狗狗在 PC 端完美露脸 */
    background-position: right center;
    position: relative;
}

/* 2. 字体系数微调 */
.page-header-section .fw-extrabold {
    font-weight: 800;
}

.page-header-section .tracking-wider {
    letter-spacing: 1.5px;
}

.page-header-section .leading-relaxed {
    line-height: 1.6;
    font-size: 0.95rem;
}

@media (max-width: 767.98px) {
    .page-header-bg {
        height: auto !important;
        min-height: auto !important;
        /* 强制转换为 16:9 比例 */
        aspect-ratio: 16 / 9 !important;
        /* 移动端图片完全拉满覆盖 */
        background-size: 100% 100% !important;
        background-position: center center !important;
    }

    /* 移动端文字排版优化：半透明暗化背景或直接靠左居中 */
    .page-header-section .promo-text-col {
        padding: 1.5rem;
        /* 如果你的背景图颜色太亮影响文字阅读，可以取消注释下面这行加个微型保护色 */
        /* background: rgba(255, 255, 255, 0.85); */
        /* border-radius: 8px; */
    }

    .page-header-section .display-5 {
        font-size: 1.8rem !important;
    }

    .page-header-section .leading-relaxed {
        font-size: 0.85rem !important;
    }
}
