/* ==========================================================================
   파일명 : variables.css
   설명 : 디자인 토큰 (색상, 폰트, 사이즈 변수)
   ========================================================================== */
:root {
    color-scheme: light dark;
    /* [Typography] 고령자 배려: 기본 16px -> 18px로 상향 조정 */
    --font-base: 'Pretendard', 'Malgun Gothic', sans-serif;
    --font-size-base: 18px; /* 여기가 핵심! 기본을 키웠음 */
    --line-height-base: 1.7; /* 글자가 커진 만큼 줄 간격도 넉넉하게 */

    /* [Brand Colors] 명도 대비 4.5:1 이상 준수 */
    --primary: #0056b3;        /* 신뢰의 파란색 */
    --primary-dark: #004494;
    --secondary: #00a8cc;
    
    /* [Text Colors] */
    --text-main: #111111;      /* 가독성 높은 짙은 검정 */
    --text-sub: #555555;
    --text-white: #ffffff;

    /* [Backgrounds] */
    --bg-body: #ffffff;
    --bg-light: #f8f9fa;
    --bg-footer: #2c3e50;

    /* [Layout] */
    --container-width: 1280px; /* 글자가 커졌으니 폭도 조금 넓게 */
    --header-height: 90px;     /* 헤더도 시원하게 */
}

/* ── 다크모드 변수 오버라이드 ── */
@media (prefers-color-scheme: dark) {
    :root {
        color-scheme: dark;
        --bg-body: #1e1e2e;
        --bg-light: #252540;
        --bg-footer: #0d0d1e;
        --text-main: #e0e0e0;
        --text-sub: #9090b0;
    }
}