/* 트러스트 블루 — 핀테크 앱 감성, 굵은 타이포, 사이드 목차 */
:root {
  --bg: #ffffff; --surface: #ffffff; --surface-2: #F2F4F6; --card-bg: #F9FAFB;
  --text: #191F28; --muted: #6B7684; --line: #E5E8EB;
  --accent: #3182F6; --accent-ink: #fff; --accent-soft: #E8F3FF;
  --link: #1B64DA; --head-bg: rgba(255, 255, 255, .92); --foot-bg: #F9FAFB;
  --head-weight: 800; --title-tracking: -0.03em;
  --radius: 20px; --radius-img: 16px;
  --card-border: 0; --shadow: none; --shadow-hover: 0 12px 28px rgba(0, 27, 55, .08);
  --wrap: 1140px; --content: 700px; --gap: 22px;
}
:root[data-theme="dark"] {
  --bg: #17171C; --surface: #17171C; --surface-2: #202027; --card-bg: #202027;
  --text: #F2F2F5; --muted: #9E9EA8; --line: #2C2C35;
  --accent: #4C9AFF; --accent-soft: rgba(76, 154, 255, .14); --link: #6AACFF;
  --head-bg: rgba(23, 23, 28, .92); --foot-bg: #1C1C22;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #17171C; --surface: #17171C; --surface-2: #202027; --card-bg: #202027;
    --text: #F2F2F5; --muted: #9E9EA8; --line: #2C2C35;
    --accent: #4C9AFF; --accent-soft: rgba(76, 154, 255, .14); --link: #6AACFF;
    --head-bg: rgba(23, 23, 28, .92); --foot-bg: #1C1C22;
  }
}
.site-head { position: sticky; top: 0; z-index: 50; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.brand-letter { border-radius: 10px; }
.brand-name { font-weight: 800; }
.gnb a { font-weight: 600; color: var(--muted); }
.gnb a:hover, .gnb a[aria-current] { background: var(--surface-2); color: var(--text); }
.hero { padding: 64px 0 24px; }
.hero-eyebrow { background: var(--accent-soft); padding: 5px 12px; border-radius: 8px; letter-spacing: .06em; }
.hero-title { font-weight: 800; font-size: clamp(32px, 5.4vw, 52px); line-height: 1.28; }
.hero-desc { font-size: 18px; }
.section-title { font-size: 24px; font-weight: 800; }
.card-grid .card-media { border-radius: var(--radius-img); margin: 10px 10px 0; }
.card-grid .card-body { padding: 14px 20px 20px; }
.card-title { font-weight: 700; font-size: 18px; }
.card-cat { font-weight: 700; }
.post-title { font-weight: 800; }
.post-meta { font-weight: 500; }
.answer-box { background: var(--accent-soft); border-left: 0; border-radius: 16px; padding: 22px 24px; }
.ab-label::before { content: '✓ '; }
.ab-label { letter-spacing: 0; font-size: 14px; }
.answer-box p { font-weight: 500; }
.toc-inline { background: var(--surface-2); border: 0; border-radius: 16px; }
.post-body h2 { font-size: 26px; font-weight: 800; }
.post-body h3 { font-weight: 700; }
.post-body table { border-radius: 12px; overflow: hidden; }
.post-body th { background: var(--accent-soft); color: var(--text); }
.post-body blockquote { border-left: 0; background: var(--surface-2); border-radius: 14px; }
.faq-sec details { border: 0; background: var(--surface-2); border-radius: 16px; }
.cat-intro { border-radius: 16px; }
.paging a, .paging span { border: 0; background: var(--surface-2); border-radius: 12px; }
.btn-accent { border-radius: 14px; }
.site-foot { border-top: 0; }
