/* ============================================================
   ANK 세무회계 — 공통 베이스 (토큰 · 리셋 · 타이포 · 공용 아톰)
   * 브랜드 색상 토큰만 여기서 정의합니다.
   * 섹션 배경색은 각 섹션 CSS 파일(hero.css, footer.css 등)에서
     이 토큰을 참조하는 자기만의 지역 변수로 다시 선언합니다.
     → 이 파일의 토큰을 바꾸면 전역 브랜드 색이 바뀌지만,
       특정 섹션 배경만 바꾸고 싶다면 해당 섹션 파일의 지역 변수만 수정하면 됩니다.
   ============================================================ */

:root {
  --navy: #16314F;
  --blue: #2E5E8C;
  --midblue: #3F7CB8;
  --bg: #F7F9FB;
  --white: #FFFFFF;
  --text: #1F2A37;
  --text-muted: #5B6B7C;
  --border: #E1E7EE;
  --success-bg: #EEF5EE;
  --success-text: #2E6B3E;
  --danger: #B3423A;
  --radius: 12px;
  --shadow: 0 4px 16px rgba(22, 49, 79, 0.08);
  --max-width: 1080px;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: "Pretendard", "Noto Sans KR", -apple-system, BlinkMacSystemFont,
    "Malgun Gothic", sans-serif;
  color: var(--text);
  background: var(--bg);
  line-height: 1.7;
  word-break: keep-all;
}

img { max-width: 100%; display: block; }

a { color: var(--blue); text-decoration: none; }
a:hover { text-decoration: underline; }

.container {
  max-width: var(--max-width);
  margin: 0 auto;
  padding: 0 20px;
}

/* ---------------- 버튼 (공용 UI 아톰) ---------------- */

.btn {
  display: inline-block;
  padding: 13px 24px;
  border-radius: 8px;
  font-weight: 600;
  font-size: 0.95rem;
  cursor: pointer;
  border: none;
}

.btn-primary { background: var(--white); color: var(--navy); }
.btn-primary:hover { background: #E8EDF3; text-decoration: none; }

.btn-outline {
  background: transparent;
  color: var(--white);
  border: 1px solid rgba(255,255,255,0.6);
}
.btn-outline:hover { background: rgba(255,255,255,0.1); text-decoration: none; }

/* ---------------- 섹션 공용 레이아웃 (배경색은 포함하지 않음) ---------------- */

section { padding: 64px 0; }

.section-head { text-align: center; max-width: 640px; margin: 0 auto 40px; }
.section-head .eyebrow {
  color: var(--midblue);
  font-weight: 700;
  font-size: 0.85rem;
  letter-spacing: 0.03em;
  display: block;
  margin-bottom: 8px;
}
.section-head h2 { font-size: 1.6rem; color: var(--navy); margin: 0 0 12px; }
.section-head p { color: var(--text-muted); margin: 0; }

/* 보조 배경(밝은 흰색 스트라이프) 유틸리티.
   --alt-bg 는 섹션마다 지역적으로 재선언 가능 — 하나를 바꿔도 다른 section-alt에 영향 없음. */
.section-alt {
  --alt-bg: var(--white);
  background: var(--alt-bg);
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}