/* 모바일에서 제목(SafeTravel)이 두 줄로 넘어가 잘리는 문제 보정 */
@media (max-width: 800px) {
    header {
        padding: 0 4%;
        gap: 8px;
    }
    .site-title {
        position: static !important;
        transform: none !important;
        left: auto !important;
        font-size: 20px !important;
        line-height: 1.2;
        white-space: nowrap;
    }
}
@media (max-width: 480px) {
    .site-title {
        font-size: 15px !important;
    }
    .header-right {
        gap: 6px;
    }
}

/* 헤더 제목(SafeTravel) + 부제목 */
.site-title {
    display: flex;
    flex-direction: column;
    align-items: center;
    line-height: 1;
}
.site-title .site-name {
    display: block;
}
.site-title .site-tagline {
    display: block;
    margin-top: 1px;
    font-size: 14px;
    line-height: 1.1;
    font-weight: 600;
    color: #5f6f86;
    letter-spacing: 0;
    white-space: nowrap;
}
@media (max-width: 800px) {
    .site-title {
        align-items: flex-start;
    }
    .site-title .site-tagline {
        margin-top: 2px;
        font-size: 11px;
    }
}
@media (max-width: 480px) {
    .site-title .site-tagline {
        font-size: 9.5px;
    }
}

/* 헤더 로고 이미지 (글자 제목 대체) - 모든 언어 로고는 같은 크기 캔버스 */
header {
    height: 132px !important;
}
.site-title .site-logo {
    display: block;
    height: 82px;
    width: auto;
    max-width: 100%;
}
.language-select {
    font-size: 16px !important;
    font-weight: 600;
    padding: 12px 40px 12px 16px !important;
    min-width: 132px;
    border-radius: 12px !important;
    border: 1px solid #c9d6e8 !important;
}
@media (max-width: 800px) {
    header { height: 98px !important; }
    .site-title .site-logo { height: 56px; }
    .language-select {
        font-size: 14px !important;
        padding: 10px 30px 10px 12px !important;
        background-position: right 10px center !important;
        min-width: 0;
    }
}
@media (max-width: 480px) {
    header { height: 88px !important; }
    .site-title .site-logo { height: 50px; }
    .language-select {
        font-size: 13px !important;
        padding: 9px 26px 9px 10px !important;
        background-position: right 8px center !important;
    }
}

/* 폰: 로그인 버튼 줄(사용자명/내 정보/관심 국가/로그아웃)이 좁아져 글자가 두 줄로 꺾이던 문제.
   줄이 모자라면 아래 줄로 넘기고, 버튼 글자는 한 줄로 둔다. */
@media (max-width: 600px) {
    .account-bar { padding: 10px 4%; }
    .account-actions { flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
    .account-actions .account-btn,
    .account-actions .user-info { margin-left: 0 !important; padding: 9px 13px !important; white-space: nowrap; font-size: 14px; }
}

/* 폰: 오른쪽에 떠 있는 빠른 메뉴 패널이 본문 글자를 가리므로 캐릭터와 TOP 버튼만 남긴다.
   (같은 이동 메뉴가 위쪽 메뉴 줄에 이미 있다) */
@media (max-width: 600px) {
    .quick-menu .quick-menu-panel { display: none !important; }
    /* 캐릭터는 화면 오른쪽 아래로 내려 본문 제목을 가리지 않게 한다 */
    .quick-menu { top: auto !important; bottom: 18px; transform: translateY(var(--quick-float-y, 0px)) !important; }
}
