/* layout/nav-mobile.css — 부모 컴포넌트 오버라이드
   로드 순서: 부모 archf-* → common → animation → layout/* → page/{슬러그} */

/* ── 풀스크린 모바일 메뉴 ── */

/* 배경을 브랜드 메인색으로 통일한다 (부모 기본은 남색 반투명).
   :root 에 커스터마이저 값이 무조건 찍혀 폴백은 안 쓰이므로,
   변수를 쓰는 그 요소에서 다시 정의한다 */
.fullscreen-nav {
    --fullscreen-nav-bg: var(--main-color);
}

/* 1차 메뉴 hover — 부모는 --color-accent(#2E86AB 파랑). 터치하면 hover 가 남아 클릭 색처럼 보인다.
   같은 특정도(0,2,0)라 뒤에 실리는 이쪽이 이긴다 */
.fullscreen-nav__link:hover,
.fullscreen-nav__link:focus-visible,
.fullscreen-nav__link:active {
    color: var(--sub-color03);
}

/* 현재 위치 — assets/js/layout.js 가 스크롤에 맞춰 붙인다 (원페이지) */
.fullscreen-nav__link.is-active {
    color: var(--sub-color01);
    font-weight: 700;
}

.nav-close-btn {
    right: 20px;
    left: auto;
}

.fullscreen-nav__footer {
    display: none;
}

@media screen and (max-width: 1023px) {
    .fullscreen-nav .nav-close-btn {
        transform: unset;
    }
    .fullscreen-nav__nav{
        padding: 10px 20px 0;
    }
    .fullscreen-nav__item{
        padding-bottom: 8px;
    }
    .fullscreen-nav__row {
        padding-bottom: 8px;
    }
    .fullscreen-nav__sub{
        display: block;
        transition: max-height 0.35s ease;
        max-height: 0;
        overflow: hidden;
    }
    .fullscreen-nav__row .fullscreen-nav__sub-link, .fullscreen-nav__sub-item > .fullscreen-nav__sub-link {
        padding: 0.6rem 0 0.6rem 0.7rem;
        font-size: 14px;
    }
    .fullscreen-nav__item--has-children > .fullscreen-nav__row > .fullscreen-nav__link{
        padding-left: 5px;
    }
}