/* ============================================================
   공통 크롬 — 헤더(.st-rail) · 푸터(.st-footer)
   ------------------------------------------------------------
   4개 페이지가 모두 마지막에 로드한다. 헤더·푸터 스타일은
   여기서만 고친다(다른 파일의 옛 선언을 덮어쓰도록 마지막 로드).
   마크업 정본은 partials/header.html · partials/footer.html.
   ============================================================ */
:root {
  --st-chrome-accent: var(--accent, #E85528);
  --st-chrome-accent-hover: var(--accent-hover, #C8410F);
  --st-chrome-fg: var(--heading, #14181A);
  --st-chrome-body: var(--body, #4B5155);
  --st-chrome-muted: var(--muted, #6B7175);
  --st-chrome-line: var(--line, #EDEBE6);
  --st-chrome-line-btn: var(--line-btn, #DDDBD5);
  --st-chrome-tint: var(--tint, #F6F7F5);
  --st-chrome-wrap: var(--wrap, 1360px);
  --st-chrome-pad: var(--wrap-pad, 48px);
}

/* ---- 헤더 ---- */
.st-rail {
  position: sticky; top: 0; z-index: 60;
  width: auto; height: 88px;
  display: grid; grid-template-columns: minmax(0,1fr) auto minmax(0,1fr);
  align-items: center; gap: 32px;
  padding: 0 max(var(--st-chrome-pad), calc((100% - var(--st-chrome-wrap)) / 2 + var(--st-chrome-pad)));
  background: rgba(255,255,255,.92);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  border-right: 0; border-bottom: 1px solid var(--st-chrome-line);
  overflow: visible;
}
.st-rail__brand {
  justify-self: start; flex: none;
  display: flex; align-items: center; gap: 12px;
  padding: 0; text-decoration: none;
}
.st-rail__brand:hover { text-decoration: none; }
.st-rail__brand img { display: block; height: 52px; width: auto; }
.st-rail__in {
  display: inline-flex; align-items: center; justify-content: center;
  height: 22px; padding: 0 7px;
  border: 1px solid var(--st-chrome-line-btn); border-radius: 6px;
  font-size:13px; font-weight: 800; letter-spacing: .14em; line-height: 1;
  color: #8A9195;
}
.st-rail__place {
  font-size:20px; font-weight: 800; letter-spacing: -.03em;
  color: var(--st-chrome-fg); white-space: nowrap; padding: 0; border: 0;
}
.st-rail__label, .st-rail__no { display: none; }
.st-rail__list {
  justify-self: center;
  display: flex; align-items: center; justify-content: center; gap: 32px;
  margin: 0; padding: 0; list-style: none;
}
.st-rail__list li { margin: 0; list-style: none; }
.st-rail__list a {
  display: flex; align-items: center; min-height: 48px; padding: 0;
  text-decoration: none; white-space: nowrap;
}
.st-rail__list a:hover { text-decoration: none; }
.st-rail__txt { display: block; font-size:18px; font-weight: 600; color: #5A6165; }
.st-rail__txt br { display: none; }
.st-rail__list a:hover .st-rail__txt,
.st-rail__list a[aria-current="page"] .st-rail__txt { color: var(--st-chrome-accent); font-weight: 700; }
.st-rail__cta {
  justify-self: end; flex: none; margin: 0;
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 48px; padding: 0 22px; border-radius: 999px;
  background: var(--st-chrome-accent); color: #fff;
  font-size:17px; font-weight: 700; white-space: nowrap;
  text-align: center; text-decoration: none;
  transition: background .28s cubic-bezier(.16,1,.3,1);
}
.st-rail__cta:hover { background: var(--st-chrome-accent-hover); color: #fff; text-decoration: none; }

@media (max-width: 1023px) {
  .st-rail {
    display: flex; flex-wrap: wrap; height: auto;
    gap: 12px 24px; padding: 14px var(--st-chrome-pad);
  }
  .st-rail__brand img { height: 44px; }
  .st-rail__list { order: 3; flex: 0 0 100%; justify-content: flex-start; flex-wrap: wrap; gap: 10px 22px; }
  .st-rail__cta { margin-left: auto; }
}
@media (max-width: 767px) {
  .st-rail { gap: 10px 16px; }
  .st-rail__brand img { height: 36px; }
  .st-rail__place { font-size:18px; }
}
@media print { .st-rail { display: none; } }

/* ---- 푸터 ---- */
.st-footer { margin-top: 0; border-top: 1px solid var(--st-chrome-line); background: var(--st-chrome-tint); }
.st-footer__inner {
  max-width: var(--st-chrome-wrap); margin: 0 auto;
  padding: 52px var(--st-chrome-pad) 60px;
  display: grid; grid-template-columns: 360px 1fr; gap: 56px; align-items: start;
}
.st-footer__brand { display: flex; align-items: center; gap: 14px; margin-bottom: 26px; }
.st-footer__brand img { display: block; height: 52px; width: auto; }
.st-footer__in {
  display: inline-flex; align-items: center; justify-content: center;
  height: 26px; padding: 0 9px;
  border: 1px solid var(--st-chrome-line-btn); border-radius: 7px;
  font-size:14px; font-weight: 800; letter-spacing: .14em; line-height: 1; color: #8A9195;
}
.st-footer__place { font-size:24px; font-weight: 800; letter-spacing: -.03em; color: var(--st-chrome-fg); white-space: nowrap; }
.st-footer dl {
  margin: 0; display: grid; grid-template-columns: 76px 1fr; gap: 8px 0;
  font-size:18px; line-height: 1.5; color: var(--st-chrome-body);
}
.st-footer dt { font-weight: 700; color: var(--st-chrome-fg); }
.st-footer dd { margin: 0; }
.st-footer__copy { margin: 0; font-size:18px; line-height: 1.625; color: var(--st-chrome-muted); }
.st-footer__copy p { margin: 0; }
.st-footer__copy p + p { margin-top: 12px; }
.st-footer__copy strong { color: var(--st-chrome-fg); }

@media (max-width: 1199px) {
  .st-footer__inner { grid-template-columns: 1fr; gap: 28px; padding: 44px var(--st-chrome-pad) 48px; }
}
@media (max-width: 767px) {
  .st-footer__inner { gap: 24px; padding: 32px var(--st-chrome-pad) 40px; }
  .st-footer dl { grid-template-columns: 92px 1fr; }
}