/* =========================================================
   NEW LIFE CIVILIZATION / SIMTECH STEP07
   공유 푸터 디자인  —  footer.css
   업로드 위치: /www/newlife/footer.css
   ⇒ 푸터 색·간격은 아래 변수(:root)만 바꾸면 전 페이지 반영.
   ========================================================= */
:root{
  --nlf-text:rgba(255,255,255,.55);   /* 푸터 기본 글자색 */
  --nlf-link:rgba(255,255,255,.62);   /* 링크 색 */
  --nlf-hover:#ffffff;                /* 링크/아이콘 호버 색 */
  --nlf-accent:#18d6a7;               /* 아이콘 호버 테두리 강조색 */
  --nlf-border:rgba(255,255,255,.12); /* 상단 구분선 */
}

.nl-footer{
  border-top:1px solid var(--nlf-border);
  padding:26px 0 38px;
  color:var(--nlf-text);
  font-size:14px;
}
.nl-foot-wrap{
  max-width:1420px;
  margin:0 auto;
  padding:0 5vw;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px 26px;
  flex-wrap:wrap;
}
.nl-copy{ letter-spacing:.01em }

.nl-foot-links{ display:flex; align-items:center; gap:14px; flex-wrap:wrap }
.nl-foot-links a{ color:var(--nlf-link); text-decoration:none; transition:color .2s ease }
.nl-foot-links a:hover{ color:var(--nlf-hover) }
.nl-foot-links .sep{ opacity:.4 }

.nl-foot-social{ display:flex; align-items:center; gap:10px }
.nl-foot-social a{
  width:32px; height:32px;
  display:inline-flex; align-items:center; justify-content:center;
  border:1px solid rgba(255,255,255,.18);
  border-radius:999px;
  color:var(--nlf-link);
  transition:color .2s ease, border-color .2s ease;
}
.nl-foot-social a:hover{ color:var(--nlf-hover); border-color:var(--nlf-accent) }
.nl-foot-social svg{ width:16px; height:16px; fill:currentColor; display:block }

article.card[data-auto-link],
.newsitem[data-auto-link]{
  transition:transform .18s ease,border-color .18s ease,background .18s ease;
}
article.card[data-auto-link]:hover,
article.card[data-auto-link]:focus-visible,
.newsitem[data-auto-link]:hover,
.newsitem[data-auto-link]:focus-visible{
  transform:translateY(-3px);
  border-color:rgba(24,214,167,.55)!important;
  background:rgba(255,255,255,.085)!important;
  outline:0;
}
article.card[data-auto-link] h3:after,
.newsitem[data-auto-link] strong:after{
  content:"  →";
  color:var(--nlf-accent);
  font-weight:950;
}

/* 반응형: 좁은 화면에서는 세로 중앙 정렬 */
@media (max-width:760px){
  .nl-foot-wrap{ flex-direction:column; text-align:center; gap:16px }
}