/*
 * 사이트 공통 푸터 — 슈퍼인턴 앱(jobtracker)의 `site-footer` 를 그대로 옮긴 것.
 * 원본: 면접질문 디자인 내보내기 `src/app/screens/auth/style.css` 의 site footer 블록.
 * 원본은 DDS 토큰(--o8·--n60 …)을 쓰지만 합격 자료집 페이지에는 그 토큰이 없어서 값을 풀어 적었다.
 *   --o8 rgba(0,0,0,.08) · --o16 rgba(0,0,0,.16) · --n30 #ccc · --n50 #888 · --n60 #666 · --n90 #1c1c1c
 * 링크는 원본도 전부 `#` 이다(목적지 미정).
 */
.site-footer{border-top:1px solid rgba(0,0,0,.08);background:transparent;padding:32px 20px}
.site-footer .fwrap{max-width:1920px;margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:24px}
.site-footer .flinks{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;row-gap:12px;column-gap:16px}
.site-footer .flinks a{font-size:14px;line-height:22px;font-weight:400;color:#666;text-decoration:none}
.site-footer .flinks a:first-child{font-weight:500;color:#1c1c1c}
/* 링크 줄의 구분자만 caption1(13/20). 주소 줄 안의 `|` 는 본문(12/18)을 상속한다 — 원본 실측 */
.site-footer .flinks .sep{font-size:13px;line-height:20px;font-weight:400}
.site-footer .sep{color:rgba(0,0,0,.16)}
/* 원본 앱에서 이 블록은 Pretendard 가 아니라 기본 sans 로 렌더된다 — 원본 주석을 따라 그대로 둔다 */
.site-footer .finfo{display:flex;flex-direction:column;align-items:center;gap:4px;
  font-family:ui-sans-serif,system-ui,sans-serif;
  font-size:12px;line-height:18px;font-weight:400;color:#888}
.site-footer .frow{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;column-gap:8px;row-gap:4px}
.site-footer .fkv{display:flex;flex-wrap:wrap;align-items:center;column-gap:2px;row-gap:4px}
.site-footer .fcolon{color:#ccc}

/* 하단 고정 구매 바(`.guide-bottom-bar`, 높이 약 84px)가 **화면에 있을 때만** 푸터가 가리지 않게 그만큼 띄운다.
   바는 상세 화면에서만 그려지므로 클래스로 고정하지 않고 `:has()` 로 판정한다(목록 화면에 빈 여백이 생기지 않게).
   구매 바는 768px 이하에서 숨겨지므로 여백도 거기서 원래대로 돌린다. */
body:has(.guide-bottom-bar) .site-footer{padding-bottom:116px}
@media (max-width: 768px){ body:has(.guide-bottom-bar) .site-footer{padding-bottom:32px} }