/* =========================================================
   AHA WEB — GLOBAL TYPOGRAPHY
   - 공통 헤더에서 Pretendard Variable 1회 로드
   - 사이트 전체 기본 폰트 상속
   - 아이콘 폰트 보호를 위해 body * !important 사용 안 함
========================================================= */
html,
body,
button,
input,
select,
textarea,
table {
    font-family:
        "Pretendard Variable",
        "Pretendard",
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        "Noto Sans KR",
        Arial,
        sans-serif;
}

html,
body {
    font-weight: 400;
    letter-spacing: -0.02em;
}

body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

button,
input,
select,
textarea {
    font: inherit;
}

/* Font Awesome 아이콘 보호 */
.fa,
.fas,
.far,
.fab,
.fa::before,
.fas::before,
.far::before,
.fab::before {
    font-family: FontAwesome !important;
}



/* =========================================================
   PAGE OFFSET
   메인: 히어로 위 fixed 헤더라 여백 없음
   서브/게시판: fixed 헤더 높이만큼 콘텐츠 시작점 확보
========================================================= */
body {
    margin: 0;

}

/* =========================================================
   COMMON HEADER
========================================================= */
.aha-site-header,
.aha-site-header * {
    box-sizing: border-box;
}

.aha-site-header {
    --aha-header-text: #ffffff;
    --aha-header-muted: #b8b3c2;
    --aha-header-line: rgba(255,255,255,.10);
    --aha-header-bg: rgba(14,10,28,.46);
    --aha-header-button-bg: rgba(255,255,255,.045);
    --aha-header-menu-bg: #0f0d18;

    position: fixed;
    top: 0;
    left: 0;
    z-index: 2147483000;
    width: 100%;
    border-bottom: 1px solid var(--aha-header-line);
    background: transparent;
    color: var(--aha-header-text);
    font-family: "Pretendard Variable", "Pretendard", "Noto Sans KR", Arial, sans-serif;
    transition:
        background-color .28s ease,
        border-color .28s ease,
        box-shadow .28s ease,
        color .28s ease;
}

/* 메인 히어로 위에서만 투명 */
.aha-site-header.is-home:not(.is-scrolled) {
    background: transparent;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    box-shadow: none;
}

/* 서브/게시판 + 메인 스크롤 이후는 반투명 GLASS */
.aha-site-header.is-subpage,
.aha-site-header.is-home.is-scrolled {
    border-bottom-color: transparent;
    background: var(--aha-header-bg);
    -webkit-backdrop-filter: blur(14px) saturate(120%);
    backdrop-filter: blur(14px) saturate(120%);
    box-shadow: 0 6px 22px rgba(0,0,0,.08);
}

/* =========================================================
   LIGHT THEME — 모든 페이지 공통
========================================================= */
body.aha-light-theme .aha-site-header {
    --aha-header-text: #222222;
    --aha-header-muted: #5a5661;
    --aha-header-line: rgba(23,21,29,.09);
    --aha-header-bg: rgba(250,249,255,.76);
    --aha-header-button-bg: rgba(23,21,29,.045);
    --aha-header-menu-bg: #ffffff;
}

.aha-site-header.is-subpage {
    --aha-header-text: #222222;
    --aha-header-muted: #5a5661;
    --aha-header-line: rgba(23,21,29,.09);
    --aha-header-bg: var(--aha-color-subpage-header, #ffffff);
    --aha-header-button-bg: rgba(23,21,29,.045);
    --aha-header-menu-bg: #ffffff;
    background: var(--aha-color-subpage-header, #ffffff);
}

/* HOME은 Portfolio 구간에서만 밝은 헤더 변수 사용 */
.aha-site-header.is-home.is-light-section {
    --aha-header-text: #222222;
    --aha-header-muted: #5a5661;
    --aha-header-line: rgba(23,21,29,.09);
    --aha-header-bg: rgba(250,249,255,.76);
    --aha-header-button-bg: rgba(23,21,29,.045);
    --aha-header-menu-bg: #ffffff;
}

body.aha-light-theme .aha-site-header.is-subpage,
body.aha-light-theme .aha-site-header.is-home.is-scrolled,
.aha-site-header.is-home.is-light-section {
    box-shadow: 0 8px 26px rgba(26,21,42,.045);
}

/* =========================================================
   INNER
========================================================= */
.aha-header-inner {
    position: relative;
    z-index: 2;
    width: 100%;
    height: 74px;
    margin: 0;
    padding: 0 54px;
    display: grid;
    grid-template-columns: minmax(0,1fr) auto minmax(0,1fr);
    align-items: center;
    gap: 20px;
}

/* =========================================================
   LOGO
========================================================= */
.aha-site-logo {
    justify-self: start;
    display: inline-flex;
    align-items: center;
    text-decoration: none !important;
}

.aha-site-logo img {
    display: block;
    width: 130px;
    max-width: 100%;
    height: auto;
    transition: filter .25s ease;
}

/* 다크 테마: 메인/서브/게시판 모두 흰 로고 */
body:not(.aha-light-theme) .aha-site-header .aha-site-logo img {
    filter: brightness(0) invert(1);
}

/* 라이트 테마: 원본 컬러 로고 */
body.aha-light-theme .aha-site-header .aha-site-logo img {
    filter: none;
}

body:not(.aha-light-theme) .aha-site-header.is-home.is-light-section .aha-site-logo img {
    filter: none;
}

/* =========================================================
   PC NAV
========================================================= */
.aha-site-nav {
    justify-self: center;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 34px;
    min-width: 0;
}

.aha-site-nav a {
    position: relative;
    padding: 28px 0;
    color: var(--aha-header-text) !important;
    font-size: 17px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
    white-space: nowrap;
    text-decoration: none !important;
    transition: color .2s ease;
}

.aha-site-nav a::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 18px;
    width: 0;
    height: 2px;
    border-radius: 999px;
    background: var(--aha-primary);
    transition: width .2s ease;
}

.aha-site-nav a:hover,
.aha-site-nav a:focus-visible {
    color: #7875ff !important;
}

.aha-site-nav a.is-active {
    color: var(--aha-primary) !important;
}

.aha-site-nav a:hover::after,
.aha-site-nav a:focus-visible::after {
    width: 100%;
    background: #7875ff;
}

.aha-site-nav a.is-active::after {
    width: 100%;
}

/* =========================================================
   ACTIONS
========================================================= */
.aha-header-actions {
    justify-self: end;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    min-width: 0;
    white-space: nowrap;
}

.aha-header-admin,
.aha-header-logout,
.aha-header-login {
    height: 42px;
    padding: 0 15px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--aha-header-line);
    border-radius: 10px;
    color: var(--aha-header-muted) !important;
    background: var(--aha-header-button-bg);
    font-size: 13px;
    font-weight: 700;
    line-height: 1;
    text-decoration: none !important;
    transition: border-color .2s ease, color .2s ease, background .2s ease;
}

.aha-header-admin:hover,
.aha-header-logout:hover,
.aha-header-login:hover {
    border-color: var(--aha-primary);
    color: var(--aha-primary-hover) !important;
    background: var(--aha-primary-soft);
}

.aha-header-admin:focus-visible,
.aha-header-logout:focus-visible,
.aha-header-login:focus-visible,
.aha-header-contact:focus-visible,
.aha-mobile-toggle:focus-visible {
    outline: 3px solid var(--aha-primary);
    outline-offset: 3px;
}

/* =========================================================
   PROJECT BUTTON
========================================================= */
.aha-header-contact,
.aha-header-contact:link,
.aha-header-contact:visited,
.aha-header-contact:hover,
.aha-header-contact:focus,
.aha-header-contact:active {
    flex: 0 0 auto;
    height: 42px;
    padding: 0 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #7875ff;
    border-radius: 999px;
    color: #ffffff !important;
    background: #7875ff;
    box-shadow: 0 8px 22px rgba(79,47,193,.20);
    font-size: 14px;
    font-weight: 800;
    line-height: 1;
    white-space: nowrap;
    text-decoration: none !important;
    transition: background .2s ease, transform .2s ease;
}

.aha-header-contact:hover {
    border-color: var(--aha-primary);
    background: var(--aha-primary);
    transform: translateY(-2px);
}

.aha-site-header.is-subpage .aha-header-contact,
.aha-site-header.is-subpage .aha-header-contact:link,
.aha-site-header.is-subpage .aha-header-contact:visited {
    border-color: var(--aha-primary);
    background: var(--aha-primary);
}

/* =========================================================
   THEME TOGGLE — 메인 / 서브 / 게시판 공통
========================================================= */
.aha-theme-toggle {
    position: relative;
    z-index: 3;
    flex: 0 0 58px;
    width: 58px;
    height: 30px;
    margin: 0;
    padding: 0;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.15);
    border-radius: 999px;
    background: rgba(255,255,255,.05);
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    transition: border-color .25s ease, background .25s ease, box-shadow .25s ease;
}

.aha-theme-toggle:hover {
    border-color: var(--aha-primary);
    background: var(--aha-primary-soft);
    box-shadow: 0 0 0 4px rgba(124,103,255,.045);
}

.aha-theme-track {
    position: absolute;
    inset: 0;
    display: block;
}

.aha-theme-knob {
    position: absolute;
    top: 4px;
    left: 4px;
    z-index: 1;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: var(--aha-primary);
    box-shadow: 0 4px 10px rgba(79,47,193,.24);
    transition: left .3s cubic-bezier(.2,.75,.25,1), background .25s ease, box-shadow .25s ease;
}

.aha-theme-icon {
    position: absolute;
    top: 50%;
    z-index: 2;
    width: 13px;
    height: 13px;
    transform: translateY(-50%);
    pointer-events: none;
    transition: opacity .25s ease, color .25s ease;
}

.aha-theme-icon svg {
    display: block;
    width: 100%;
    height: 100%;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.aha-theme-icon-sun {
    left: 8px;
    opacity: 0;
    color: var(--aha-primary);
}

.aha-theme-icon-moon {
    right: 8px;
    opacity: 1;
    color: #ddd8e7;
}

body.aha-light-theme .aha-theme-toggle {
    border-color: rgba(23,21,29,.12);
    background: rgba(23,21,29,.045);
    box-shadow: none;
}

body.aha-light-theme .aha-theme-knob {
    left: 32px;
    background: #ffffff;
    box-shadow: 0 4px 10px rgba(40,32,68,.14);
}

body.aha-light-theme .aha-theme-icon-sun { opacity: 1; }
body.aha-light-theme .aha-theme-icon-moon { opacity: 0; }

/* =========================================================
   MOBILE NAV
========================================================= */
.aha-mobile-nav {
    display: none;
    margin: 0;
    padding: 0;
}

.aha-mobile-nav > summary {
    list-style: none;
}

.aha-mobile-nav > summary::-webkit-details-marker {
    display: none;
}

.aha-mobile-nav > summary::marker {
    display: none;
    content: "";
}

.aha-mobile-toggle {
    display: none;
    width: 44px;
    height: 44px;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}

.aha-mobile-toggle span {
    display: block;
    width: 21px;
    height: 2px;
    margin: 2.5px auto;
    border-radius: 99px;
    background: #7875ff;
    transition: transform .22s ease, opacity .18s ease;
}

.aha-mobile-nav[open] > .aha-mobile-toggle span:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
}

.aha-mobile-nav[open] > .aha-mobile-toggle span:nth-child(2) {
    opacity: 0;
}

.aha-mobile-nav[open] > .aha-mobile-toggle span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
}

.aha-mobile-menu {
    display: none;
}

/* =========================================================
   SUB / BOARD WRAPPER
   기존 게시판 레이아웃은 유지. 헤더만 공통화.
========================================================= */


/* =========================================================
   RESPONSIVE
========================================================= */
@media (max-width: 1320px) {
    .aha-header-inner {
        padding: 0 24px;
        gap: 16px;
    }

    .aha-site-nav {
        gap: 24px;
    }

    .aha-header-contact {
        padding-left: 17px;
        padding-right: 17px;
    }
}

@media (max-width: 1180px) {
    .aha-site-header {
        overflow: visible !important;
        isolation: isolate;
    }

    .aha-header-inner {
        width: calc(100% - 40px);
        margin: 0 auto;
        padding: 0;
        display: flex;
        align-items: center;
        gap: 8px;
        overflow: visible;
    }

    .aha-site-nav {
        display: none;
    }

    /* 모바일 헤더에서도 테마 버튼은 항상 노출 */
    .aha-header-actions {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        margin-left: auto;
        gap: 8px;
    }

    .aha-header-actions .aha-header-admin,
    .aha-header-actions .aha-header-logout,
    .aha-header-actions .aha-header-login,
    .aha-header-actions .aha-header-contact {
        display: none !important;
    }

    .aha-mobile-nav {
        position: relative;
        z-index: 5;
        display: block;
        flex: 0 0 44px;
        width: 44px;
        height: 44px;
        overflow: visible;
    }

    .aha-mobile-nav > .aha-mobile-toggle {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        width: 44px;
        height: 44px;
    }

    .aha-mobile-nav > .aha-mobile-menu {
        position: fixed;
        top: 74px;
        right: 0;
        left: 0;
        z-index: 2147483004;
        width: 100%;
        max-width: none;
        margin: 0;
        padding: 8px 16px 18px;
        border-top: 1px solid var(--aha-header-line);
        background: var(--aha-header-menu-bg);
        box-shadow: 0 18px 40px rgba(0,0,0,.12);
    }

    .aha-mobile-nav[open] > .aha-mobile-menu {
        display: block;
    }

    .aha-mobile-nav > .aha-mobile-menu > a {
        width: 100%;
        min-height: 50px;
        margin: 0;
        padding: 0 14px;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        border: 0;
        border-bottom: 1px solid var(--aha-header-line);
        background: transparent;
        color: var(--aha-header-muted) !important;
        font-size: 15px;
        font-weight: 700;
        line-height: 1;
        text-decoration: none !important;
    }

    .aha-mobile-nav > .aha-mobile-menu > a:hover,
    .aha-mobile-nav > .aha-mobile-menu > a:focus {
        color: var(--aha-primary-hover) !important;
    }

    .aha-mobile-nav > .aha-mobile-menu > .aha-mobile-contact,
    .aha-mobile-nav > .aha-mobile-menu > .aha-mobile-contact:link,
    .aha-mobile-nav > .aha-mobile-menu > .aha-mobile-contact:visited,
    .aha-mobile-nav > .aha-mobile-menu > .aha-mobile-contact:hover,
    .aha-mobile-nav > .aha-mobile-menu > .aha-mobile-contact:focus,
    .aha-mobile-nav > .aha-mobile-menu > .aha-mobile-contact:active {
        min-height: 50px;
        margin-top: 12px;
        border: 0;
        border-radius: 999px;
        justify-content: center;
        color: #ffffff !important;
        background: var(--aha-primary);
        font-weight: 800;
    }
}

@media (max-width: 900px) {


    .aha-header-inner {
        width: calc(100% - 32px);
        height: 66px;
        gap: 7px;
    }

    .aha-site-logo img {
        width: 120px;
    }

    .aha-theme-toggle {
        flex-basis: 58px;
        width: 58px;
        height: 30px;
    }

    .aha-mobile-nav,
    .aha-mobile-nav > .aha-mobile-toggle {
        width: 44px;
        height: 44px;
    }

    .aha-mobile-nav > .aha-mobile-menu {
        top: 66px;
        max-height: calc(100dvh - 66px);
        overflow-y: auto;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
    }


}

@media (max-width: 420px) {
    .aha-header-inner {
        width: calc(100% - 24px);
        gap: 4px;
    }

    .aha-site-logo img {
        width: 112px;
    }

    .aha-theme-toggle {
        transform: scale(.94);
        transform-origin: center right;
    }

    .aha-mobile-nav,
    .aha-mobile-nav > .aha-mobile-toggle {
        width: 42px;
        height: 42px;
    }
}


/* =========================================================
   MOBILE MENU — FULL SCREEN / LEFT ALIGN REDESIGN
   - 레퍼런스처럼 헤더 + 풀스크린 메뉴를 하나의 화면처럼 구성
   - DARK / LIGHT 공통 대응
========================================================= */
@media (max-width: 1180px) {
    /* 메뉴 오픈 중에는 헤더와 메뉴 배경을 완전히 연결 */
    body.aha-mobile-menu-open {
        overflow: hidden;
    }

    html.aha-mobile-menu-open {
        overflow: hidden;
    }

    body.aha-mobile-menu-open .aha-site-header,
    body.aha-mobile-menu-open .aha-site-header.is-home:not(.is-scrolled),
    body.aha-mobile-menu-open .aha-site-header.is-home.is-scrolled,
    body.aha-mobile-menu-open .aha-site-header.is-subpage {
        background: var(--aha-header-menu-bg) !important;
        -webkit-backdrop-filter: none !important;
        backdrop-filter: none !important;
        border-bottom-color: transparent !important;
        box-shadow: none !important;
    }

    /* 닫힌 상태: 기존처럼 테마 토글 노출 */
    .aha-header-actions .aha-theme-toggle {
        display: block;
    }

    /* 열린 상태: 토글 대신 상단 문의 버튼 노출 */
    body.aha-mobile-menu-open .aha-header-actions .aha-theme-toggle {
        display: none !important;
    }

    body.aha-mobile-menu-open .aha-header-actions .aha-header-contact {
        display: inline-flex !important;
        height: 40px;
        padding: 0 17px;
        border-radius: 999px;
        font-size: 13px;
        font-weight: 800;
        box-shadow: none;
        transform: none !important;
    }

    /* 햄버거 / 닫기 버튼 */
    .aha-mobile-nav > .aha-mobile-toggle {
        position: relative;
        z-index: 2147483007;
        border-radius: 12px;
        transition: background-color .22s ease;
    }

    .aha-mobile-nav[open] > .aha-mobile-toggle {
        border-radius: 0;
        background: transparent;
    }

    body.aha-light-theme .aha-mobile-nav[open] > .aha-mobile-toggle {
        background: transparent;
    }

    .aha-mobile-nav[open] > .aha-mobile-toggle span {
        background: #7875ff;
    }

    /* 풀스크린 메뉴 */
    .aha-mobile-nav > .aha-mobile-menu {
        position: fixed;
        top: 74px;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 2147483004;
        width: 100%;
        height: auto;
        max-width: none;
        max-height: none;
        margin: 0;
        padding: 0;
        overflow: hidden;
        border: 0;
        background: var(--aha-header-menu-bg);
        box-shadow: none;
        color: var(--aha-header-text);
    }

    .aha-mobile-nav[open] > .aha-mobile-menu {
        display: block;
        animation: ahaMobileMenuIn .28s cubic-bezier(.2,.75,.2,1) both;
    }

    .aha-mobile-menu-shell {
        width: 100%;
        height: 100%;
        min-height: 0;
        padding: clamp(96px, 16vh, 150px) 28px calc(24px + env(safe-area-inset-bottom));
        display: flex;
        flex-direction: column;
        align-items: stretch;
        overflow-y: auto;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
    }

    /* 메인 메뉴 — 큼직하고 완전 왼쪽 정렬 */
    .aha-mobile-menu-links {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: clamp(17px, 3.8vh, 38px);
        text-align: left !important;
    }

    .aha-mobile-menu-links > a,
    .aha-mobile-menu-links > a:link,
    .aha-mobile-menu-links > a:visited {
        position: relative;
        width: auto;
        min-height: 0;
        margin: 0;
        padding: 0;
        border: 0;
        background: transparent;
        color: var(--aha-header-text) !important;
        font-size: clamp(36px, 9.6vw, 52px);
        font-weight: 600;
        line-height: 1.02;
        letter-spacing: 0em;
        text-align: left !important;
        text-decoration: none !important;
        white-space: nowrap;
        transition: color .18s ease, transform .18s ease;
    }

    .aha-mobile-menu-links > a:hover,
    .aha-mobile-menu-links > a:focus-visible,
    .aha-mobile-menu-links > a:active {
        color: #7875ff !important;
        transform: translateX(5px);
    }

    .aha-mobile-menu-links > a.is-active {
        color: var(--aha-primary) !important;
        transform: translateX(5px);
    }

    /* 관리자 메뉴는 메인 GNB와 시각적으로 분리 */
    .aha-mobile-admin-links {
        width: 100%;
        margin-top: 34px;
        padding-top: 18px;
        display: flex;
        flex-wrap: wrap;
        gap: 10px 18px;
        border-top: 1px solid var(--aha-header-line);
    }

    .aha-mobile-admin-links a {
        color: var(--aha-header-muted) !important;
        font-size: 13px;
        font-weight: 700;
        line-height: 1.5;
        text-decoration: none !important;
    }

    /* 화면 하단 정보 */
    .aha-mobile-menu-foot {
        margin-top: auto;
        padding-top: 40px;
        text-align: left;
    }

    .aha-mobile-menu-brand {
        margin: 0 0 6px;
        color: var(--aha-header-text);
        font-size: 14px;
        font-weight: 800;
        line-height: 1.35;
        letter-spacing: -.02em;
    }

    .aha-mobile-menu-tagline {
        margin: 0;
        color: var(--aha-header-muted);
        font-size: 12px;
        font-weight: 600;
        line-height: 1.5;
        letter-spacing: .04em;
    }

    @keyframes ahaMobileMenuIn {
        from {
            opacity: 0;
            transform: translateY(-8px);
        }
        to {
            opacity: 1;
            transform: translateY(0);
        }
    }
}

@media (max-width: 900px) {
    .aha-mobile-nav > .aha-mobile-menu {
        top: 66px;
    }

    .aha-mobile-menu-shell {
        padding-top: clamp(96px, 16vh, 144px);
        padding-right: 24px;
        padding-left: 24px;
    }
}

@media (max-width: 420px) {
    body.aha-mobile-menu-open .aha-header-actions .aha-header-contact {
        height: 38px;
        padding: 0 14px;
        font-size: 12px;
    }

    .aha-mobile-menu-shell {
        padding-top: clamp(82px, 14vh, 118px);
        padding-right: 20px;
        padding-left: 20px;
    }

    .aha-mobile-menu-links > a,
    .aha-mobile-menu-links > a:link,
    .aha-mobile-menu-links > a:visited {
        font-size: clamp(24px, 7.5vw, 34px);
    }
}

/* 사이트 전역 테마 전환 UI는 현재 사용하지 않음 */
.aha-theme-toggle {
    display: none !important;
}