/* 상단 헤더 영역 */
.main-header {
    background-color: #ffffff;
    border-bottom: 1px solid #eee;
    padding: 15px 0;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    position: sticky; /* 상단 고정 (선택 사항) */
    top: 0;
    z-index: 1000;
}

/* 네비게이션 컨테이너 */
.nav-container {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 20px;
}

/* --- 로고 애니메이션 레이아웃 --- */
.logo {
    display: flex;             
    align-items: center;       /* 수직 중앙 정렬의 핵심 */
    font-size: 1.5rem;
    font-weight: bold;
    color: #28a745;            
    text-decoration: none;
    line-height: 1;            /* 부모의 라인 높이를 초기화하여 기준점 통일 */
}

.logo-text {
    display: inline-block;
    line-height: 1.8rem;       /* 우측 슬라이더 높이와 일치시킴 */
}

/* "공구공구/0909"가 보일 창문 */
.logo-slider-container {
    height: 1.8rem;            
    overflow: hidden;          
    margin-left: 8px;          
    /* 텍스트가 위로 치우쳐 보일 때 아래 마진으로 미세 조정 */
    margin-top: 2px;           
}

/* 실제로 위로 움직이는 박스 */
.logo-slider {
    display: flex;
    flex-direction: column;
    animation: logoSlideUp 5s infinite ease-in-out;
}

/* 슬라이드되는 개별 텍스트 */
.logo-point {
    height: 1.8rem;
    line-height: 1.8rem;       /* 텍스트가 상자에 꽉 차게 정렬 */
    display: block;
    /* 폰트에 따라 미세하게 위치가 다를 수 있어 추가 */
    vertical-align: middle;    
}

/* 애니메이션 동작 (수치는 그대로 유지) */
@keyframes logoSlideUp {
    0%, 45% { transform: translateY(0); }             
    50%, 95% { transform: translateY(-1.8rem); }      
    100% { transform: translateY(-3.6rem); }          
}

/* 오른쪽 메뉴 영역 */
.nav-right {
    display: flex;
    align-items: center;
    gap: 15px;
}

.user-info {
    font-size: 0.9rem;
    color: #555;
    margin-right: 10px;
}

.nav-btn {
    text-decoration: none;
    color: #333;
    font-size: 0.95rem;
    padding: 8px 12px;
    border-radius: 4px;
    transition: 0.2s;
}

.nav-btn:hover {
    background-color: #f8f9fa; /* 오타 수정: #f8f9af -> #f8f9fa (연회색) */
}

/* 회원가입 버튼 강조 */
.nav-btn.signup {
    background-color: #28a745;
    color: white;
}

.nav-btn.signup:hover {
    background-color: #218838;
}