/* ================================================
   전 페이지 공통 컴포넌트 스타일

   각 페이지는 자기 <style> 블록에 레이아웃을 그대로 들고 있고,
   이 파일은 페이지마다 갈라지기 쉬운 "공통 요소의 색·크기·서체"만 잡는다.
   </head> 직전에 링크되어 페이지 인라인 스타일보다 뒤에 로드되므로,
   같은 우선순위(클래스 1개)의 값을 덮어쓴다.

   → 헤더 로고·푸터 타이포를 바꿀 일이 생기면 여기만 고칠 것.
   클래스가 두 벌(.footer-* / .f-*)인 것은 페이지마다 이름이 다르기 때문이다.
   ================================================ */

/* ── 헤더 로고 ──
   index.html 의 산세리프 볼드 형태를 기준으로 통일한다.
   (다른 페이지들은 Lora 세리프 1.1rem 을 쓰고 있었다) */
.nav-logo {
  font-family: 'Pretendard', -apple-system, sans-serif;
  font-size: 1.18rem;
  font-weight: 600;
  color: #2C2C2C;
  letter-spacing: -0.02em;
}

/* ── 푸터 ── */
.footer-logo,
.f-logo {
  color: #FFFFFF;
}

/* 주소·진료시간 본문 */
.footer-address,
.footer-hours,
.f-addr,
.f-hours {
  font-size: 14px;
  color: #8E8D8C;
}

/* "페이지", "바로가기" 등 칼럼 제목 */
.footer-section-title,
.f-st {
  font-size: 13px;
  color: #9A9895;
}

/* 링크 목록 */
.footer-links a,
.f-links a {
  color: #A9A8A6;
}
.footer-links a:hover,
.f-links a:hover {
  color: #FFFFFF;
}

/* 하단 저작권 줄 */
.footer-copy,
.f-copy {
  color: #8E8D8C;
}

/* ── 기본 CTA 버튼 ──
   index 의 정의를 단일 출처로 삼는다. faq.html 은 .btn-primary 를 마크업에만
   쓰고 규칙이 없어 버튼이 맨 텍스트로 렌더링되고 있었다.
   (--accent 계열 변수는 각 페이지 :root 에 모두 정의돼 있다) */
.btn-primary {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: var(--accent);
  color: #fff;
  padding: 16px 32px;
  border-radius: 100px;
  font-size: 0.95rem;
  font-weight: 500;
  letter-spacing: 0.02em;
  border: none;
  cursor: pointer;
  transition: all 0.4s var(--ease-spring);
  text-decoration: none;
}
.btn-primary .btn-icon {
  width: 26px; height: 26px;
  border-radius: 50%;
  background: rgba(255,255,255,0.2);
  display: flex; align-items: center; justify-content: center;
  font-size: 0.8rem;
  transition: transform 0.3s var(--ease-spring);
}
.btn-primary:hover {
  background: var(--accent-mid, #3d5030);
  transform: translateY(-2px);
  box-shadow: 0 12px 32px rgba(74,94,58,0.28);
}
.btn-primary:hover .btn-icon { transform: translateX(3px); }
.btn-primary:active { transform: scale(0.98); }