/* ===================================================
   네비게이션과 히어로 섹션 완벽 연결 CSS
   - 배경 이미지가 네비 뒤에서 보임
   =================================================== */

/* 네비게이션 바 높이 계산용 */
:root {
    --nav-height: 182px; /* 네비게이션 바 높이 (140px × 1.3 = 182px, 글자 크기 1.3배 대응) */
    --spacing-gap: 100px; /* 네비와 콘텐츠 사이 여백 (적절한 간격) */
}

/* 히어로 섹션이 페이지 최상단부터 시작 (네비 뒤로) */
.hero {
    margin-top: 0 !important;
    padding-top: calc(var(--nav-height) + var(--spacing-gap)) !important; /* 182px + 100px = 282px */
}

/* 네비게이션 바와의 간격 완전 제거 */
nav + .hero,
nav + section.hero {
    margin-top: 0 !important;
}

/* body에 네비게이션 높이만큼 padding-top 제거 */
body {
    padding-top: 0 !important;
}

/* 네비게이션이 fixed이므로 히어로가 맨 위부터 시작 */
section#home {
    position: relative !important;
}