@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@700&display=swap');

/* --- 페이지 공통 레이아웃 --- */
.page-wrapper {
    overflow-x: hidden;
}

/* --- Hero 공통 규격 (기본 뼈대) --- */
.hero-base {
    position: relative;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background-color: #000;
}
    /* 내부 이미지 및 오버레이 공통 스타일 */
    .hero-base .hero-img,
    .hero-base .video-container {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        z-index: 1;
        opacity: 0.75;
        transition: opacity 0.5s ease; /* 부드러운 화면전환 */
    }
    .hero-base .video-bg {
        width: 100%;
        height: 100%;
        object-fit: cover; /* 비디오가 영역을 꽉 채우도록 설정 */
    }
    .hero-base .hero-overlay {
        position: relative;
        z-index: 3;
        width: 100%;
        text-shadow: 0 2px 15px rgba(0,0,0,0.5);
        color: #fff;
    }
    /* 비디오 위에 덮는 어두운 필터 */
    .hero-base .video-overlay {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(rgba(0, 20, 40, 0.6), rgba(0, 30, 60, 0.7));
        z-index: 2; /* 비디오보다는 위, 텍스트보다는 아래 */
    }

/* --- 메인 서브페이지 전용 (Full Height) --- */
.page-hero {
    height: 90vh;
    min-height: 600px;
}

/* --- 2. 일반 서브페이지 전용 (Fixed Height) --- */
.sub-hero {
    height: 40vh; /* 상부 이미지 구역 확보 */
    min-height: 350px;
}



/* --- Scroll Down 인디케이터 --- */
.scroll-down-indicator {
    position: absolute;
    bottom: 60px; /* 바닥에서 위로 위치 조정값 */
    left: 50%;
    transform: translateX(-50%);
    color: #fff;
    text-align: center;
    z-index: 10;
    cursor: pointer;
    animation: bounce 2s infinite; /* 무한 바운스 애니메이션 */
    text-align: center;
}

@keyframes bounce {
    0%, 20%, 50%, 80%, 100% {
        transform: translate(-50%, 0);
    }

    40% {
        transform: translate(-50%, -15px);
    }

    60% {
        transform: translate(-50%, -7px);
    }
}

/* 섹션 공용 여백 */
.page-section {
    padding: 100px 0;
    position: relative;
}

.max-w-600 {
    max-width: 600px;
    margin: 0 auto;
}

.max-w-800 {
    max-width: 800px;
    margin: 0 auto;
}

/* 설명문 줄간격 및 가독성 */
.lh-relaxed {
    line-height: 1.8; /* [cite: 1435] */
}


/* 자막/라벨 스타일: 글자 간격을 넓혀 고급스러운 느낌 제공 */
.tracking-wider {
    letter-spacing: 0.1rem; /* [cite: 1433] */
}

.tracking-widest {
    letter-spacing: 0.2rem; /* 핵심 가치 영문 서브 타이틀 등에 사용 */
}