/* =============================================================
   footer.css — 공통 푸터 (nk-footer)
   Figma: db 홈페이지 / Footer 컴포넌트 (instance 481:2236)
   색상·간격·타이포는 css/variables.css 의 --nk-* 토큰 재사용.
   (푸터 다크 영역 색상은 --nk-color-footer-* 토큰)
   ============================================================= */

.nk-footer {
  display: flex;
  flex-direction: column;
  gap: var(--nk-space-48);                /* 48px */
  width: 100%;
  padding: var(--nk-space-80) var(--nk-space-80) var(--nk-space-40); /* 80 80 40 */
  background: var(--nk-color-footer-bg);
  font: var(--nk-text-p12-r);             /* Pretendard 12 */
  color: var(--nk-color-footer-muted);
}

/* 상단: 브랜드 + 링크 컬럼 */
.nk-footer__top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--nk-space-48);
  width: 100%;
}

.nk-footer__brand {
  display: flex;
  flex-direction: column;
  gap: var(--nk-space-12);                /* 12px */
}
.nk-footer__logo-img {
  display: block;
  height: 53px;

}
.nk-footer__tagline {
  margin: 0;
  color: var(--nk-color-footer-muted);
}

.nk-footer__links {
  display: flex;
  align-items: flex-start;
  gap: var(--nk-space-48);
}
.nk-footer__col {
  display: flex;
  flex-direction: column;
  gap: var(--nk-space-12);
}
.nk-footer__col-title {
  margin: 0;
  color: var(--nk-color-footer-heading);
}
.nk-footer__link {
  color: var(--nk-color-footer-link);
  text-decoration: none;
  white-space: nowrap;
}
.nk-footer__link:hover {
  color: var(--nk-color-white);
  text-decoration: underline;
}
/* 법정 표시 의무가 있는 링크(개인정보처리방침)는 다른 링크와 구분되게 굵게 */
.nk-footer__link--strong {
  font-weight: var(--nk-font-weight-bold);
}

/* 구분선 */
.nk-footer__divider {
  width: 100%;
  height: 1px;
  background: var(--nk-color-footer-divider);
}

/* 하단: 회사 정보 + 법적 표기 */
.nk-footer__bottom {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--nk-space-48);
  width: 100%;
}
.nk-footer__info {
  display: flex;
  flex-direction: column;
  gap: var(--nk-space-12);
}
.nk-footer__company {
  margin: 0;
  color: var(--nk-color-footer-heading);
}
.nk-footer__info p,
.nk-footer__legal p {
  margin: 0;
}
.nk-footer__legal {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: var(--nk-space-4);                 /* 4px */
  color: var(--nk-color-footer-muted);
}

/* 태블릿 이하 */
@media (max-width: 768px) {
  .nk-footer {
    padding: var(--nk-space-48) var(--nk-space-24) var(--nk-space-32); /* 48 24 32 */
  }
  .nk-footer__top,
  .nk-footer__bottom {
    flex-direction: column;
    gap: var(--nk-space-32);
  }
  .nk-footer__bottom {
    align-items: flex-start;
  }
  .nk-footer__legal {
    align-items: flex-start;
  }
}

/* 모바일 이하 */
@media (max-width: 375px) {
  .nk-footer {
    padding: var(--nk-space-40) var(--nk-space-16) var(--nk-space-24); /* 40 16 24 */
  }
  .nk-footer__links {
    flex-wrap: wrap;
    gap: var(--nk-space-24);
  }
}
