/* ============================================================
   KOR-INFO DESIGN SYSTEM v2
   ============================================================ */

@import url('https://cdn.jsdelivr.net/npm/pretendard@1.3.9/dist/web/variable/pretendardvariable.css');

/* ── 변수 ────────────────────────────────────────────────────── */
:root {
  --font:      'Pretendard Variable', Pretendard, -apple-system, 'Apple SD Gothic Neo', sans-serif;
  --bg:        #ffffff;
  --bg-2:      #f7f7f6;
  --text:      #111111;
  --text-2:    #505050;
  --text-3:    #aaaaaa;
  --border:    #e8e8e8;
  --radius:    5px;
  --w-content: 700px;
  --w-wide:    1120px;
}

/* ── 전역 ────────────────────────────────────────────────────── */
*, *::before, *::after {
  font-family: var(--font) !important;
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
  box-sizing: border-box;
}

html { font-size: 16px; scroll-behavior: smooth; }

body {
  background: #f4f4f2 !important;
  color: var(--text) !important;
  letter-spacing: -0.02em !important;
  word-break: keep-all !important;
}

/* ── 제거: 상단 구독 바 ──────────────────────────────────────── */
.blogsy-topbar,
[class*="topbar"] { display: none !important; }

/* ── 제거: 헤더 구독 버튼 ───────────────────────────────────── */
.pt-header-widget__button,
[class*="widget__button"],
a[href="#"].blogsy-btn { display: none !important; }

/* ── 제거: 불필요 메타 (댓글, 아바타) ──────────────────────── */
.meta-item.comments,
.meta-1,
.author-avatar,
.single-author-box { display: none !important; }

/* ── 제거: 브레드크럼 ───────────────────────────────────────── */
.breadcrumb-wrapper { display: none !important; }

/* ── 제거: 사이드바 위젯 타이틀 등 불필요 ──────────────────── */
.sidebar-container { display: none !important; }

/* ── 제거: 포스트 하단 공유 버튼 클러터 ────────────────────── */
.single-date-updated { display: none !important; }

/* ══════════════════════════════════════════════════════════════
   헤더
══════════════════════════════════════════════════════════════ */
#masthead, .site-header,
header.header, .blogsy-header,
[class*="main-header"],
.pt-header, .pt-header-inner {
  background: #fff !important;
  border-bottom: 1px solid var(--border) !important;
  box-shadow: none !important;
}

.pt-header-container {
  max-width: var(--w-wide) !important;
  padding: 0 32px !important;
}

/* 로고 */
.pt-logo a, .site-title a,
[class*="logo"] a {
  font-weight: 800 !important;
  font-size: 1.05rem !important;
  letter-spacing: -0.04em !important;
  color: var(--text) !important;
  text-decoration: none !important;
}

/* 내비 링크 */
.blogsy-header-nav a,
.primary-menu a,
nav.main-navigation a {
  font-size: 0.8rem !important;
  font-weight: 500 !important;
  letter-spacing: -0.01em !important;
  color: var(--text-2) !important;
  text-decoration: none !important;
  transition: color 0.12s !important;
}
.blogsy-header-nav a:hover { color: var(--text) !important; }

/* ══════════════════════════════════════════════════════════════
   레이아웃
══════════════════════════════════════════════════════════════ */
.main-wrapper { padding: 0 !important; }

.content-wrapper { background: transparent !important; }

.pt-container { max-width: var(--w-wide) !important; }

.page-content-wrapper.sidebar-none-narrow > .content-container,
.page-content-wrapper.sidebar-none > .content-container,
.page-content-wrapper > .content-container {
  max-width: var(--w-content) !important;
  margin: 32px auto !important;
  float: none !important;
  padding: 0 16px !important;
  width: 100% !important;
}

/* 포스트 카드 래퍼 */
.single-content.card-layout-w,
article.single-content {
  background: #fff !important;
  border: none !important;
  box-shadow: 0 0 0 1px rgba(0,0,0,0.05), 0 2px 16px rgba(0,0,0,0.04) !important;
  border-radius: 8px !important;
  overflow: hidden !important;
}

/* ══════════════════════════════════════════════════════════════
   히어로 (썸네일 + 제목)
══════════════════════════════════════════════════════════════ */
.single-hero-outside { display: none !important; }

.single-hero-inside { padding: 0 !important; }

/* 썸네일 이미지 */
.single-hero-1 .image-container img,
.wp-post-image {
  display: block !important;
  width: 100% !important;
  max-height: 380px !important;
  object-fit: cover !important;
  border-radius: 0 !important;
}

/* 제목 영역 */
.single-hero-title {
  padding: 28px 40px 0 !important;
}

/* 카테고리 배지 */
.single-hero-title .category {
  margin-bottom: 12px !important;
}
.single-hero-title .category a {
  display: inline-block !important;
  font-size: 0.7rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: var(--text-2) !important;
  text-decoration: none !important;
  background: var(--bg-2) !important;
  padding: 3px 10px !important;
  border-radius: 3px !important;
  border-bottom: none !important;
}

/* H1 포스트 제목 */
.single-hero-title h1.title,
.single-page-title,
h1.entry-title {
  font-size: 1.9rem !important;
  font-weight: 800 !important;
  line-height: 1.28 !important;
  letter-spacing: -0.045em !important;
  color: #0a0a0a !important;
  margin: 0 0 20px !important;
  word-break: keep-all !important;
}

/* 메타 (날짜, 읽기시간) */
.single-hero-meta {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  padding: 0 0 24px !important;
  border-bottom: 1px solid var(--border) !important;
}

.meta-2 { display: flex !important; align-items: center !important; gap: 10px !important; }

.meta-2 .top { display: none !important; }   /* "By 작성자명" 숨김 */

.meta-2 .bottom {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

.meta-item.date,
.meta-item.reading-time {
  font-size: 0.76rem !important;
  color: var(--text-3) !important;
  font-weight: 400 !important;
  letter-spacing: 0.01em !important;
}

.meta-item.reading-time::before {
  content: '·' !important;
  margin-right: 10px !important;
  color: var(--text-3) !important;
}

.meta-3 { display: none !important; }

/* ══════════════════════════════════════════════════════════════
   본문
══════════════════════════════════════════════════════════════ */
.single-content-inner {
  padding: 36px 40px 56px !important;
  font-size: 16.5px !important;
  line-height: 1.98 !important;
  letter-spacing: -0.022em !important;
  color: #1c1c1c !important;
  word-break: keep-all !important;
}

.single-content-inner p {
  margin-bottom: 1.3em !important;
  color: #222 !important;
  font-size: inherit !important;
  line-height: inherit !important;
}

/* H2 */
.single-content-inner h2 {
  font-size: 1.22em !important;
  font-weight: 700 !important;
  letter-spacing: -0.032em !important;
  color: #080808 !important;
  margin-top: 2.8em !important;
  margin-bottom: 0.75em !important;
  padding: 0 0 0 13px !important;
  border: none !important;
  position: relative !important;
  line-height: 1.35 !important;
}
.single-content-inner h2::before {
  content: '' !important;
  position: absolute !important;
  left: 0 !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 3px !important;
  height: 0.9em !important;
  background: #111 !important;
  border-radius: 2px !important;
}

/* H3 */
.single-content-inner h3 {
  font-size: 1.01em !important;
  font-weight: 600 !important;
  letter-spacing: -0.02em !important;
  color: #111 !important;
  margin-top: 1.9em !important;
  margin-bottom: 0.45em !important;
  padding: 0 !important;
}
.single-content-inner h3::before { display: none !important; content: none !important; }

/* 링크 */
.single-content-inner a {
  color: inherit !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
  text-decoration-thickness: 1px !important;
  text-decoration-color: #ccc !important;
  border-bottom: none !important;
  transition: text-decoration-color 0.15s !important;
}
.single-content-inner a:hover {
  text-decoration-color: #555 !important;
}

/* ══════════════════════════════════════════════════════════════
   인포박스
══════════════════════════════════════════════════════════════ */
.wiki-infobox {
  float: right !important;
  clear: right !important;
  margin: 0 0 1.6em 2em !important;
  border: 1px solid var(--border) !important;
  border-collapse: collapse !important;
  font-size: 0.79em !important;
  width: 205px !important;
  background: var(--bg-2) !important;
  border-radius: var(--radius) !important;
  overflow: hidden !important;
  box-shadow: none !important;
}
.wiki-infobox thead th {
  background: #111 !important;
  color: #fff !important;
  padding: 10px 12px !important;
  text-align: center !important;
  font-size: 0.86em !important;
  font-weight: 600 !important;
  letter-spacing: -0.01em !important;
  border: none !important;
}
.wiki-infobox tbody td {
  padding: 5px 10px !important;
  border-top: 1px solid #efefef !important;
  color: #333 !important;
  vertical-align: top !important;
}
.wiki-infobox tbody td:first-child {
  font-weight: 600 !important;
  white-space: nowrap !important;
  background: #f0f0ef !important;
  width: 58px !important;
  color: #888 !important;
}

/* ══════════════════════════════════════════════════════════════
   이미지
══════════════════════════════════════════════════════════════ */
.wiki-img-right {
  float: right !important; clear: right !important;
  margin: 0.3em 0 1.3em 1.8em !important;
  max-width: 145px !important; width: 16% !important;
  border-radius: var(--radius) !important;
  overflow: hidden !important;
  border: 1px solid var(--border) !important;
  box-shadow: 0 1px 6px rgba(0,0,0,0.07) !important;
}
.wiki-img-left {
  float: left !important; clear: left !important;
  margin: 0.3em 1.8em 1.3em 0 !important;
  max-width: 135px !important; width: 15% !important;
  border-radius: var(--radius) !important;
  overflow: hidden !important;
  border: 1px solid var(--border) !important;
  box-shadow: 0 1px 6px rgba(0,0,0,0.07) !important;
}
.wiki-img-right img, .wiki-img-left img {
  width: 100% !important; height: auto !important; display: block !important;
}
.wiki-img-right figcaption, .wiki-img-left figcaption {
  font-size: 0.71em !important; color: var(--text-3) !important;
  padding: 5px 8px !important; background: var(--bg-2) !important;
  text-align: center !important; line-height: 1.4 !important;
}

/* ══════════════════════════════════════════════════════════════
   목차
══════════════════════════════════════════════════════════════ */
.wiki-toc {
  background: var(--bg-2) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  padding: 14px 20px !important;
  margin: 1.6em 0 2.2em !important;
  display: inline-block !important;
  min-width: 185px !important;
  max-width: 360px !important;
  font-size: 0.83em !important;
  line-height: 1.7 !important;
}
.wiki-toc .toc-title {
  font-size: 0.7em !important; font-weight: 700 !important;
  text-transform: uppercase !important; letter-spacing: 0.1em !important;
  color: var(--text-3) !important; margin-bottom: 9px !important;
}
.wiki-toc ol { margin: 0 !important; padding-left: 1.2em !important; }
.wiki-toc li { margin: 2px 0 !important; }
.wiki-toc a {
  color: var(--text-2) !important; text-decoration: none !important; border: none !important;
}
.wiki-toc a:hover { color: var(--text) !important; text-decoration: underline !important; }

/* ══════════════════════════════════════════════════════════════
   커스텀 컴포넌트
══════════════════════════════════════════════════════════════ */

/* 콜아웃 */
.callout {
  border-left: 2px solid #ccc !important;
  background: var(--bg-2) !important;
  padding: 13px 17px !important;
  margin: 1.9em 0 !important;
  border-radius: 0 var(--radius) var(--radius) 0 !important;
  font-size: 0.91em !important;
  line-height: 1.85 !important;
  color: #2a2a2a !important;
}
.callout strong {
  display: block !important; font-size: 0.7em !important;
  text-transform: uppercase !important; letter-spacing: 0.1em !important;
  color: var(--text-3) !important; margin-bottom: 6px !important;
  font-weight: 700 !important;
}

/* 풀쿼트 */
.pull-quote {
  font-size: 1.12em !important; font-weight: 700 !important;
  line-height: 1.6 !important; letter-spacing: -0.03em !important;
  color: var(--text) !important;
  border-top: 1.5px solid var(--text) !important;
  border-bottom: 1.5px solid var(--text) !important;
  padding: 18px 24px !important;
  margin: 2.4em 0 !important;
  text-align: center !important;
}

/* 평점 박스 */
.rating-box {
  display: flex !important; align-items: stretch !important;
  background: #111 !important; color: #fff !important;
  border-radius: var(--radius) !important; overflow: hidden !important;
  margin: 2em 0 !important; font-size: 0.88em !important;
}
.rating-box .rating-label {
  padding: 14px 18px !important; font-size: 0.68em !important;
  text-transform: uppercase !important; letter-spacing: 0.1em !important;
  color: #777 !important; font-weight: 700 !important;
  background: #0d0d0d !important; border-right: 1px solid #2a2a2a !important;
  display: flex !important; align-items: center !important; white-space: nowrap !important;
}
.rating-box .rating-score {
  padding: 14px 18px !important; font-size: 1.85em !important;
  font-weight: 800 !important; letter-spacing: -0.04em !important;
  display: flex !important; align-items: center !important; line-height: 1 !important;
}
.rating-box .rating-desc {
  padding: 14px 18px !important; font-size: 0.84em !important;
  line-height: 1.6 !important; color: #999 !important;
  border-left: 1px solid #2a2a2a !important;
  display: flex !important; align-items: center !important;
}

/* 하이라이트 블록 */
.highlight-block {
  background: var(--bg-2) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  padding: 14px 18px !important;
  margin: 1.9em 0 !important;
  font-size: 0.91em !important;
  line-height: 1.85 !important;
  color: #1a1a1a !important;
}
.highlight-block strong {
  display: block !important; font-size: 0.7em !important;
  text-transform: uppercase !important; letter-spacing: 0.1em !important;
  color: var(--text-3) !important; margin-bottom: 7px !important; font-weight: 700 !important;
}

/* 구분선 */
.section-divider {
  border: none !important;
  height: 1px !important;
  background: var(--border) !important;
  margin: 2.5em 0 !important;
}

/* ══════════════════════════════════════════════════════════════
   FAQ
══════════════════════════════════════════════════════════════ */
.faq-section {
  margin-top: 2.8em !important;
  padding-top: 2em !important;
  border-top: 1px solid var(--border) !important;
  background: none !important;
  border-left: none !important; padding-left: 0 !important;
  border-radius: 0 !important; box-shadow: none !important;
}
.faq-section > h2 {
  font-size: 0.68em !important; font-weight: 700 !important;
  text-transform: uppercase !important; letter-spacing: 0.1em !important;
  color: var(--text-3) !important; border: none !important;
  margin: 0 0 1.4em !important; padding: 0 !important;
}
.faq-section > h2::before, .faq-section > h2::after {
  display: none !important; content: none !important; background: none !important;
}
.faq-section dt {
  font-weight: 600 !important; font-size: 0.94em !important;
  color: var(--text) !important; margin-top: 1.3em !important;
  padding: 0 !important; border: none !important;
}
.faq-section dt:first-of-type { margin-top: 0 !important; }
.faq-section dd {
  margin: 5px 0 0 0 !important; padding: 0 !important;
  color: var(--text-2) !important; font-size: 0.9em !important; line-height: 1.85 !important;
}

/* clearfix */
.clearfix::after { content: '' !important; display: table !important; clear: both !important; }

/* ══════════════════════════════════════════════════════════════
   포스트 하단
══════════════════════════════════════════════════════════════ */
/* 태그 */
.single-post-tags {
  padding: 16px 40px !important;
  border-top: 1px solid var(--border) !important;
}
.single-post-tags a {
  display: inline-block !important;
  font-size: 0.75rem !important; font-weight: 500 !important;
  color: var(--text-2) !important; background: var(--bg-2) !important;
  border: 1px solid var(--border) !important;
  padding: 3px 10px !important; border-radius: 3px !important;
  margin: 2px 3px !important; text-decoration: none !important;
  transition: background 0.12s, border-color 0.12s !important;
}
.single-post-tags a:hover {
  background: #eee !important; border-color: #ccc !important;
}

/* 이전/다음 포스트 */
.single-next-prev-posts-container {
  border-top: 1px solid var(--border) !important;
  padding: 20px 40px !important;
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 16px !important;
}
.single-next-prev-posts-title {
  font-size: 0.7rem !important; font-weight: 700 !important;
  text-transform: uppercase !important; letter-spacing: 0.08em !important;
  color: var(--text-3) !important; margin-bottom: 6px !important;
}
.next-post a, .prev-post a {
  font-size: 0.88em !important; font-weight: 600 !important;
  letter-spacing: -0.02em !important; color: var(--text) !important;
  text-decoration: none !important; line-height: 1.4 !important;
}
.next-post a:hover, .prev-post a:hover { color: var(--text-2) !important; }

/* ══════════════════════════════════════════════════════════════
   아카이브 / 목록
══════════════════════════════════════════════════════════════ */
.default-post-list-item .post-wrapper-inner,
.card-layout {
  border: 1px solid var(--border) !important;
  box-shadow: none !important;
  border-radius: 7px !important;
  transition: border-color 0.15s, box-shadow 0.15s !important;
  background: #fff !important;
}
.default-post-list-item .post-wrapper-inner:hover {
  border-color: #bbb !important;
  box-shadow: 0 2px 12px rgba(0,0,0,0.06) !important;
}

/* ══════════════════════════════════════════════════════════════
   푸터
══════════════════════════════════════════════════════════════ */
#colophon, .site-footer, footer {
  border-top: 1px solid var(--border) !important;
  background: var(--bg) !important;
  box-shadow: none !important;
  font-size: 0.78rem !important;
  color: var(--text-3) !important;
  margin-top: 24px !important;
}

/* ══════════════════════════════════════════════════════════════
   모바일 ( ≤ 680px )
══════════════════════════════════════════════════════════════ */
@media (max-width: 680px) {
  .single-hero-title { padding: 20px 20px 0 !important; }
  .single-hero-title h1.title, h1.entry-title {
    font-size: 1.55rem !important;
  }
  .single-content-inner { padding: 24px 20px 44px !important; }
  .single-post-tags, .single-next-prev-posts-container {
    padding-left: 20px !important; padding-right: 20px !important;
  }
  .single-next-prev-posts-container {
    grid-template-columns: 1fr !important;
  }
  .wiki-infobox {
    float: none !important; width: 100% !important; margin: 0 0 1.4em !important;
  }
  .wiki-img-right, .wiki-img-left {
    float: none !important; width: 100% !important;
    max-width: 100% !important; margin: 0 0 1.2em !important;
  }
  .rating-box { flex-direction: column !important; }
  .rating-box > * { border: none !important; padding: 10px 16px !important; }
  .pull-quote { font-size: 1em !important; padding: 14px !important; }
  .page-content-wrapper > .content-container {
    margin: 16px auto !important; padding: 0 12px !important;
  }
}

/* ══════════════════════════════════════════════════════════════
   관련 글
══════════════════════════════════════════════════════════════ */
.korinfo-related {
  margin-top: 3em;
  padding-top: 2em;
  border-top: 1px solid var(--border);
}
.korinfo-related__title {
  font-size: 0.85em !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  color: var(--text-3) !important;
  margin: 0 0 1.2em !important;
  border-bottom: none !important;
  padding-bottom: 0 !important;
}
.korinfo-related__title::before { display: none !important; }
.korinfo-related__list {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 0.9em !important;
}
.korinfo-related__item {
  display: flex !important;
  align-items: flex-start !important;
  gap: 0.9em !important;
  padding: 0.75em 0 !important;
  border-bottom: 1px solid var(--border) !important;
}
.korinfo-related__item:last-child {
  border-bottom: none !important;
}
.korinfo-related__thumb {
  flex-shrink: 0 !important;
  width: 68px !important;
  height: 50px !important;
  border-radius: 3px !important;
  overflow: hidden !important;
  display: block !important;
}
.korinfo-related__thumb img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}
.korinfo-related__body {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.25em !important;
  min-width: 0 !important;
}
.korinfo-related__link {
  font-size: 0.92em !important;
  font-weight: 600 !important;
  color: var(--text) !important;
  text-decoration: none !important;
  border-bottom: none !important;
  line-height: 1.45 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}
.korinfo-related__link:hover {
  color: #1a56db !important;
  border-bottom: none !important;
}
.korinfo-related__date {
  font-size: 0.76em !important;
  color: var(--text-3) !important;
}
@media (max-width: 640px) {
  .korinfo-related__thumb { width: 56px !important; height: 42px !important; }
}
