/* services.html 전용 — 센터 정렬 히어로 + 리스트 */
:root {
  --color-primary: hsl(340 26% 34%);
  --color-secondary: hsl(340 20% 46%);
  --color-accent: hsl(38 62% 50%);
  --color-bg: #FAF6F7;
  --color-surface: #FFFFFF;
  --color-text: #2C2126;
  --color-text-muted: #6C5B62;
  --color-border: rgba(59, 26, 41, 0.14);
  --font-display: 'Pretendard', sans-serif;
  --font-body: 'Noto Sans KR', sans-serif;
}
h1, h2, h3, .font-display { font-weight: 800; }

.hero--center { text-align: center; }
.hero--center .hero__sub { margin-left: auto; margin-right: auto; }
.hero--center .hero__cta { justify-content: center; }

.svc-list { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-3); }
.svc-list a {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: var(--space-4) var(--space-3);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  font-family: var(--font-display);
  font-weight: 600;
  font-size: var(--fs-lg);
  transition: border-color 0.2s ease;
}
.svc-list a:hover { border-color: var(--color-accent); }
.svc-list svg { display: none; }
@media (max-width: 780px) {
  .svc-list { grid-template-columns: repeat(2, 1fr); }
}
