/* ==========================================================================
   공간 /space — 페이지 전용 스타일 (공용 컴포넌트: site.css · docs/front-components.md)
   본문은 공용 블록(.blocks)이 그린다. 블록은 덮어쓰지 않고, 공간 안내 번호 · 방문 안내만 다룬다.
   (.space · .space__* 는 Home 의 공간 섹션이다. 이 페이지는 .space-page · .space-… 를 쓴다.)
   ========================================================================== */

/* 공간 안내(.subnav) — 둘러보는 순서를 번호로 */
.space-route__index {
    margin-right: 10px;
    font-size: 11px;
    letter-spacing: .08em;
    color: var(--ink-3);
    font-variant-numeric: tabular-nums;
    transition: color .3s var(--ease);
}
.space-route a:hover .space-route__index,
.space-route a.is-current .space-route__index { color: var(--ink-2); }

/* 본문 — 서브내비 다음 첫 공간까지 */
.space-body { padding-top: clamp(64px, 7vw, 128px); }

/* ---------------------------------------------------------------- 방문 안내 */
/* 소개 페이지 '더 알아보기'와 같은 헤어라인 행: 큰 이름 · 영문 · 한 줄 설명 · 선 화살표 */
.space-next { padding-bottom: var(--section-y); }
.space-next__eyebrow { margin-bottom: clamp(36px, 4vw, 64px); }
.space-next__list { border-top: 1px solid var(--line); }
.space-next__list li + li { transition-delay: .12s; }

.space-next__link {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    column-gap: var(--col-gap);
    align-items: center;
    padding: clamp(30px, 3.2vw, 52px) 0;
    border-bottom: 1px solid var(--line);
    transition: color .4s var(--ease);
}
.space-next__title {
    grid-column: 1 / span 5;
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 4px 18px;
}
.space-next__label {
    font-size: clamp(26px, 2.7vw, 46px);
    font-weight: 300;
    line-height: 1.3;
    letter-spacing: -.03em;
}
.space-next__en {
    font-size: 11px;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--ink-3);
}
.space-next__text {
    grid-column: 7 / span 5;
    font-size: clamp(15px, 1.05vw, 17px);
    line-height: 1.8;
    color: var(--ink-2);
    transition: color .4s var(--ease);
}
.space-next__arrow {
    grid-column: 12;
    justify-self: end;
    width: 28px;
    transition: transform .45s var(--ease);
}

@media (hover: hover) {
    .space-next__list:hover .space-next__link,
    .space-next__list:hover .space-next__text { color: var(--ink-3); }
    .space-next__list .space-next__link:hover { color: var(--ink); }
    .space-next__list .space-next__link:hover .space-next__text { color: var(--ink-2); }
    .space-next__link:hover .space-next__arrow { transform: translateX(8px); }
}

@media (max-width: 767px) {
    .space-next__link {
        grid-template-columns: minmax(0, 1fr) auto;
        row-gap: 10px;
        padding: 28px 0;
    }
    .space-next__title { grid-column: 1; }
    .space-next__text { grid-column: 1; grid-row: 2; }
    .space-next__arrow { grid-column: 2; grid-row: 1 / span 2; width: 22px; }
}
