/* ===============================================================
   facility-nav.css — 시설 페이지 공통 이동 요소

   네 페이지(천년주목숲길 · 발왕수 가든 · 스카이워크 · 평창 평화봉)가
   같은 자리, 같은 모양의 "돌아가기" 와 "다른 즐길거리" 를 쓴다.
   페이지마다 따로 두면 네 벌을 동시에 고쳐야 하므로 여기 한 곳에 모은다.

   ⚠ 각 페이지의 CSS 보다 뒤에 불러야 한다.
      기존 .back-link 규칙과 특이도가 같아, 순서로 이긴다.
   =============================================================== */

/* --- 돌아가기 --------------------------------------------------- */
/* 화면에 고정한다. 페이지가 길어 아래로 내려가도 빠져나갈 길이 보여야 한다.
   backlink.js 가 .back-link 를 찾아 히스토리 뒤로가기로 바꿔 단다
   (홈으로 이동시키면 메인이 처음부터 다시 로드된다). */
.fac-back {
    position: fixed;
    top: 22px;
    left: 22px;
    z-index: 120;

    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 9px 15px 9px 11px;

    border-radius: 999px;
    text-decoration: none;
    color: #F2F5FA;
    background: rgba(8, 13, 24, .5);
    border: 1px solid rgba(255, 255, 255, .13);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);

    font-family: 'Pretendard', 'Montserrat', -apple-system, sans-serif;
    font-size: .82rem;
    font-weight: 600;
    opacity: 1;
    transition: background-color .25s, border-color .25s;
}

/* 각 페이지 CSS 의 .back-link:hover { transform: translateX(-5px) } 를 막는다.
   고정 배치라 좌우로 흔들리면 어색하다. */
.fac-back:hover {
    background: rgba(8, 13, 24, .78);
    border-color: rgba(255, 255, 255, .3);
    opacity: 1;
    transform: none;
    color: #fff;
}

.fac-back svg {
    width: 17px;
    height: 17px;
    flex: none;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/* --- 맨 아래 : 다른 즐길거리로 --------------------------------- */
.fac-home {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
    text-decoration: none;
}

.fac-home span {
    font-family: 'Montserrat', sans-serif;
    font-size: .62rem;
    font-weight: 600;
    letter-spacing: .24em;
    color: rgba(233, 238, 247, .55);
}

.fac-home b {
    font-family: 'Pretendard', 'Montserrat', -apple-system, sans-serif;
    font-size: .95rem;
    font-weight: 700;
    color: #F2F5FA;
    transition: color .25s;
}

.fac-home:hover b {
    color: #E7C766;
}

/* --- 좁은 화면 --------------------------------------------------- */
@media (max-width: 640px) {
    .fac-back {
        top: 14px;
        left: 14px;
        padding: 8px 13px 8px 10px;
        font-size: .78rem;
    }
}