/* === 기본 세팅 === */
html, body {
    height: 100%;
    margin: 0;
    font-family: 'Inter', system-ui, -apple-system, Segoe UI, Roboto, 'Noto Sans KR', Arial, sans-serif;
}

/* 링크 초기화 */
a {
    color: inherit;
    text-decoration: none;
}

/* === 테마(공통 변수) === */
body {
    --fg: #000; /* 기본 전경색 */
    --bg: #fff; /* 기본 배경색 */
}

    body.landing-theme {
        --fg: #fff;
        --bg: url('/images/ai-hand3.jpg') no-repeat center center / cover;
    }

    body.default-theme {
        --fg: #000;
        --bg: #fff;
    }

/* 배경/전경 일괄 적용 */
body {
    background: var(--bg);
}

.brand, .menu a, .menu .logout-btn {
    color: var(--fg);
}

/* === 헤더 === */
.layout-header {
    position: absolute; /* 필요 시 sticky로 교체: position: sticky; top: 0; */
    top: 0;
    width: 100%;
    height: 80px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: transparent;
    z-index: 10;
}

.header-inner {
    width: 1440px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 36px;
}

.brand {
    font-weight: 700;
    font-size: 32px;
    letter-spacing: 0.5px;
}

/* 메뉴 */
.menu {
    display: flex;
    align-items: center;
    gap: 32px;
}

    .menu a {
        font-size: 18px;
        font-weight: 600;
        transition: opacity 0.3s;
    }

        .menu a:hover {
            opacity: 0.7;
        }

/* === 본문 === */
.layout-content {
    width: 100%;
    min-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    /* 헤더가 absolute라면 겹침 방지:
     padding-top: 80px;  // 필요 시 활성화 */
}

/* 유틸 */
.inline {
    display: inline;
}

/* 로그아웃 버튼을 링크처럼 보이게 */
.menu .logout-btn {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background: transparent !important;
    border: 0 !important;
    padding: 0;
    margin: 0;
    font: inherit;
    font-size: 18px;
    font-weight: 600;
    line-height: 1;
    cursor: pointer;
    transition: opacity 0.3s, text-decoration-color 0.2s;
}

    .menu .logout-btn:hover {
        opacity: 0.7;
        text-decoration: underline;
    }