/*
 * 공개 블로그(comna.kr/posts) — 원본 comna-studio 공개 화면을 그대로 옮긴 손 CSS.
 *  · 글 화면: components/public/post-detail.module.css(= 기존 comna.kr PostDetailPage) — 클래스 접두 pd-
 *  · 목록·헤더·용어사전: 원본 Tailwind 클래스를 같은 값으로 풀어 썼다(Tailwind 기본 스케일: 1 = 4px).
 *  · 글자 크기는 D-22(본문 17px / 모바일 16px, 폭 800px) 그대로. Tailwind preflight 의 리셋도 같이 둔다.
 */

/* ── preflight(원본 Tailwind 와 같은 리셋) ─────────────────────────────────── */
*, ::before, ::after { box-sizing: border-box; border: 0 solid #e5e7eb; }
html { -webkit-text-size-adjust: 100%; line-height: 1.5; tab-size: 4; }
body { margin: 0; line-height: inherit; background: #fff; color: #1a1d2e; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
  font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Noto Sans KR", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji";
  word-break: keep-all; overflow-wrap: break-word; }
h1, h2, h3, h4, p, blockquote, figure, ul, ol { margin: 0; }
h1, h2, h3, h4 { font-size: inherit; font-weight: inherit; }
ul, ol { list-style: none; padding: 0; }
a { color: inherit; text-decoration: inherit; }
img, svg { display: block; vertical-align: middle; }
img { max-width: 100%; height: auto; }
table { text-indent: 0; border-color: inherit; border-collapse: collapse; }
button, input { font-family: inherit; font-size: 100%; line-height: inherit; color: inherit; margin: 0; padding: 0; }
b, strong { font-weight: bolder; }
:focus-visible { outline: 2px solid #5c67ff; outline-offset: 2px; }
@media (max-width: 767px) { input { font-size: max(16px, 1em) !important; } }

/* ── 레이아웃 셸(원본 app/(public)/layout.tsx) ─────────────────────────────── */
.site { display: flex; min-height: 100vh; flex-direction: column; background: #fff; }
.site-main { flex: 1; }
.site-footer { margin-top: 96px; border-top: 1px solid #e4e7ef; padding: 24px 0; text-align: center; font-size: 13px; color: #9ba1b0; }

/* ── 상단 헤더(원본 site-header.tsx — comna.kr 헤더 실측값) ────────────────── */
.sh { position: sticky; top: 0; z-index: 30; display: flex; height: 56px; width: 100%; background: #fff; }
.sh-inner { margin: 0 auto; display: flex; width: 100%; max-width: clamp(1100px, 90vw, 1760px); align-items: center; justify-content: space-between; padding: 0 20px; }
.sh-logo img { height: 17px; width: 80px; }
.sh-nav { display: none; }
.sh-nav ul { display: flex; align-items: center; gap: 20px; }
.sh-item { display: inline-block; border-radius: 8px; padding: 16px; font-size: 14px; font-weight: 500; letter-spacing: -0.28px; color: #000; }
.sh-item:hover { background: #9696964d; }
.sh-item.is-current { font-weight: 600; }
.sh-item.is-login { color: #2b6fff; }
.sh-mobile { display: flex; align-items: center; }
.sh-mobile-about { margin-right: 18px; font-size: 15px; font-weight: 500; letter-spacing: -0.28px; color: #333; }
.sh-menu-btn { display: flex; height: 40px; width: 40px; align-items: center; justify-content: center; color: #333; background: none; cursor: pointer; }
.sh-dim { position: fixed; inset: 0; z-index: 40; background: rgb(0 0 0 / .5); }
.sh-drawer { position: fixed; top: 0; right: -300px; z-index: 50; height: 100%; width: 277px; background: #0a1020; padding-top: 12px; box-shadow: -5px 5px 15px #00000080; transition: right .1s ease-in-out; }
.sh-drawer a { display: block; padding: 20px 16px; font-size: 20px; font-weight: 500; color: #fff; }
.sh-close { position: absolute; left: -59px; top: 16px; display: flex; height: 36px; width: 36px; align-items: center; justify-content: center; border-radius: 9999px; background: #fff; color: #000; cursor: pointer; }
.sh-toggle { display: none; }
.sh-toggle:checked ~ .sh-drawer { right: 0; }
.sh-toggle:not(:checked) ~ .sh-dim, .sh-toggle:not(:checked) ~ .sh-drawer .sh-close { display: none; }
@media (min-width: 768px) {
  .sh { height: 60px; }
  .sh-logo img { height: 23.7px; width: 110px; }
  .sh-nav { display: block; }
  .sh-mobile, .sh-dim, .sh-drawer { display: none !important; }
}
@media (min-width: 1320px) {
  .sh { height: 72px; }
  .sh-inner { max-width: clamp(1320px, 90vw, 2112px); padding: 0 24px; }
  .sh-logo img { height: 28.4px; width: 132px; }
  .sh-nav ul { gap: 24px; }
  .sh-item { border-radius: 9.6px; padding: 19.2px; font-size: 16.8px; letter-spacing: -0.34px; }
}

/* ── 목록(원본 app/(public)/posts/page.tsx · post-parts.tsx) ──────────────── */
.wrap { margin: 0 auto; max-width: 1200px; padding: 0 16px; }
.list-h1 { padding-top: 40px; font-size: 30px; font-weight: 800; letter-spacing: -0.025em; color: #1a1d2e; }

.list-sec { padding-top: 48px; }
.list-head { display: flex; flex-direction: column; gap: 16px; padding-bottom: 20px; }
.list-h2 { flex-shrink: 0; font-size: 24px; font-weight: 700; color: #1a1d2e; }
.list-h2 span { margin-left: 8px; font-size: 18px; font-weight: 600; color: #9ba1b0; }
.search { position: relative; width: 100%; }
.search svg { pointer-events: none; position: absolute; left: 14px; top: 50%; transform: translateY(-50%); color: #9ba1b0; }
.search input { height: 44px; width: 100%; border-radius: 10px; border: 1px solid #e4e7ef; background: #fff; padding: 0 16px 0 40px; font-size: 15px; color: #1a1d2e; }
.search input::placeholder { color: #9ba1b0; }
.search input:focus { border-color: #5c67ff; outline: none; box-shadow: 0 0 0 2px rgb(92 103 255 / .2); }
.gl-link { display: flex; align-items: center; gap: 12px; border-radius: 14px; border: 1px solid rgb(92 103 255 / .2); background: #fff; padding: 12px 16px; box-shadow: 0 1px 2px rgba(16,24,40,.06); transition: border-color .15s; }
.gl-link:hover { border-color: #5c67ff; }
.gl-link-icon { display: flex; height: 36px; width: 36px; align-items: center; justify-content: center; border-radius: 10px; background: #eef0ff; color: #5c67ff; }
.gl-link-label { font-size: 15px; font-weight: 700; color: #1a1d2e; }
.gl-link > svg:last-child { margin-left: 8px; color: #9ba1b0; }
.q-note { margin-top: 16px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 15px; color: #5a6072; }
.q-note b { color: #1a1d2e; }
.q-note a { display: inline-flex; align-items: center; gap: 4px; font-weight: 600; color: #5c67ff; }
.q-note a:hover { text-decoration: underline; }
/* 카테고리 칩(원본 chip-scroller.tsx + FilterChip) */
.chips-wrap { position: relative; margin-top: 20px; }
.chips { display: flex; gap: 8px; overflow-x: auto; scroll-behavior: smooth; padding-bottom: 4px; -ms-overflow-style: none; scrollbar-width: none; }
.chips::-webkit-scrollbar { display: none; }
.chip { display: inline-flex; height: 48px; flex-shrink: 0; align-items: center; gap: 10px; border-radius: 9999px; border: 1px solid #e4e7ef; background: #fff; padding: 0 20px 0 6px; font-size: 15px; font-weight: 600; color: #5a6072; transition: color .15s, border-color .15s, background-color .15s; }
.chip.chip-plain { padding-left: 24px; }
.chip:hover { border-color: rgb(92 103 255 / .4); color: #1a1d2e; }
.chip.is-active { border-color: #1a1d2e; background: #1a1d2e; color: #fff; }
.chip-ico { display: flex; height: 36px; width: 36px; align-items: center; justify-content: center; border-radius: 9999px; color: #fff; }
.chips-fade { pointer-events: none; position: absolute; top: 0; bottom: 0; width: 80px; }
.chips-fade-l { left: 0; background: linear-gradient(to right, #fff, rgb(255 255 255 / .8), transparent); }
.chips-fade-r { right: 0; background: linear-gradient(to left, #fff, rgb(255 255 255 / .8), transparent); }
.chips-btn { position: absolute; top: 50%; display: flex; height: 40px; width: 40px; transform: translateY(-50%); align-items: center; justify-content: center; border-radius: 9999px; border: 1px solid #e4e7ef; background: #fff; color: #5a6072; box-shadow: 0 1px 2px rgba(16,24,40,.06); cursor: pointer; }
.chips-btn:hover { border-color: rgb(92 103 255 / .4); color: #1a1d2e; }
.chips-btn-l { left: 0; } .chips-btn-r { right: 0; }
[hidden] { display: none !important; }

/* M&A 브리핑 리포트(원본 report-links.tsx) */
.reports { margin-top: 20px; border-radius: 14px; border: 1px solid #e4e7ef; background: #f6f7f9; padding: 16px; }
.reports-h { margin-bottom: 12px; display: flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 700; color: #1a1d2e; }
.reports-h svg { color: #5c67ff; }
.reports-list { display: flex; flex-wrap: wrap; gap: 8px; }
.report-chip, .report-btn { display: inline-flex; align-items: center; border-radius: 9999px; border: 1px solid rgb(92 103 255 / .25); background: #fff; padding: 8px 16px; font-size: 14px; font-weight: 600; color: #2e36b8; transition: border-color .15s, background-color .15s; }
.report-btn { flex-shrink: 0; gap: 6px; border-color: rgb(92 103 255 / .3); }
.report-btn svg { color: #5c67ff; }
.report-chip:hover, .report-btn:hover { border-color: #5c67ff; background: #eef0ff; }
.pd-title-row { display: flex; width: 100%; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; }

/* 주요 글 — 히어로 1 + 가로형 2(원본 HeroFeatured · SideFeatured) */
.featured2 { margin-top: 32px; display: grid; gap: 16px; }
.hero { position: relative; display: block; overflow: hidden; border-radius: 10px; }
.hero .thumb { border-radius: 10px; transition: transform .5s; }
.hero:hover .thumb { transform: scale(1.02); }
.hero-shade { pointer-events: none; position: absolute; inset: 0; border-radius: 10px; background: linear-gradient(to top, rgba(0,0,0,.88) 0%, rgba(0,0,0,.45) 24%, rgba(0,0,0,0) 52%); }
.hero-body { position: absolute; left: 0; right: 0; bottom: 0; padding: 20px; }
.hero-title { margin-top: 12px; font-size: 20px; font-weight: 700; line-height: 1.375; color: #fff; }
.hero-meta { margin-top: 8px; display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; }
.hero-intro { overflow: hidden; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; font-size: 14px; color: rgb(255 255 255 / .9); }
.hero-meta time { flex-shrink: 0; font-size: 13px; color: rgb(255 255 255 / .7); }
.side-col { display: grid; gap: 20px; }
.side { display: flex; align-items: stretch; gap: 16px; }
.side .thumb { aspect-ratio: 196 / 176; width: 38%; max-width: 196px; flex-shrink: 0; border-radius: 10px; border: 0; transition: box-shadow .15s; }
.side:hover .thumb { box-shadow: 0 4px 12px rgba(16,24,40,.10); }
.side-body { display: flex; min-width: 0; flex: 1; flex-direction: column; }
.side-title { margin-top: 8px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; font-size: 17px; font-weight: 700; line-height: 1.375; color: #1a1d2e; }
.side:hover .side-title { color: #5c67ff; }
.side-intro { margin-top: 6px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; font-size: 14px; color: #5a6072; }
.side-body time { margin-top: auto; padding-top: 12px; font-size: 13px; color: #9ba1b0; }

/* M&A 용어사전 배너(원본 glossary-banner.tsx, top) */
.gbanner { position: relative; display: flex; min-height: 100px; align-items: center; justify-content: flex-start; overflow: hidden; border-radius: 10px; padding-left: 20px; padding-right: 96px; background: #e9f0fd; transition: box-shadow .15s; }
.gbanner:hover { box-shadow: 0 4px 12px rgba(16,24,40,.10); }
.gbanner-list { margin-top: 40px; margin-bottom: 24px; }
.gbanner-text { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; padding: 28px 0; text-align: left; }
.gbanner-title { display: flex; align-items: center; gap: 6px; font-size: 22px; font-weight: 800; line-height: 1; letter-spacing: -0.025em; color: #000548; }
.gbanner-title img { height: 20px; width: auto; }
.gbanner-desc { margin-top: 4px; font-size: 13px; font-weight: 500; color: #4b4b4b; }
.gbanner-book { pointer-events: none; position: absolute; right: 40px; top: 50%; height: 58px; width: auto; transform: translateY(-50%); }
.empty { margin-top: 40px; border-radius: 14px; border: 1px dashed #e4e7ef; background: #f6f7f9; padding: 64px 24px; text-align: center; }
.empty-t { font-size: 17px; font-weight: 600; color: #1a1d2e; }
.empty-d { margin-top: 8px; font-size: 15px; color: #5a6072; }
.grid { margin-top: 32px; display: grid; column-gap: 32px; row-gap: 48px; }
.card { display: block; }
.card .thumb { transition: transform .3s, box-shadow .3s; }
.card:hover .thumb { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(16,24,40,.10); }
.card-body { margin-top: 16px; }
.card-title { margin-top: 10px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; min-height: 2.75em; font-size: 18px; font-weight: 700; line-height: 1.5; color: #1a1d2e; }
/* ↑ 원본 클래스는 leading-snug 이지만 cn(tailwind-merge)이 text-[18px] 뒤에서 그것을 지워 실제 화면은 상속값 1.5 다(운영 computed 실측) */
.card:hover .card-title { color: #5c67ff; }
.card time { margin-top: 8px; display: block; font-size: 14px; color: #9ba1b0; }
.cat-chip { display: inline-flex; align-items: center; gap: 8px; border-radius: 9999px; padding: 8px 14px; font-size: 13px; font-weight: 600; line-height: 1; }
.cat-chip i { height: 6px; width: 6px; border-radius: 9999px; }
.cat-chip-solid { color: #fff; }
.cat-chip-solid i { background: #fff; }
.thumb { position: relative; aspect-ratio: 16 / 9; overflow: hidden; border-radius: 10px; border: 1px solid #e4e7ef; background: #f6f7f9; }
.thumb img { height: 100%; width: 100%; object-fit: cover; }
.thumb-art { border: 0; }
.thumb-art span { position: absolute; }
.thumb-art .c1 { border-radius: 9999px; background: rgb(255 255 255 / .15); width: 62%; aspect-ratio: 1; }
.thumb-art .c2 { border-radius: 9999px; border: 10px solid rgb(255 255 255 / .2); width: 34%; aspect-ratio: 1; left: -8%; }
.thumb-art .r1 { bottom: 14%; right: 10%; height: 18%; width: 26%; border-radius: 6px; background: rgb(255 255 255 / .2); }
.thumb-art .r2 { bottom: 38%; right: 18%; height: 10%; width: 14%; border-radius: 6px; background: rgb(255 255 255 / .3); }
.pager { margin-top: 56px; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 6px; }
@media (max-width: 639px) { .pager .m-hide { display: none; } }
.pager a, .pager span { display: flex; height: 40px; min-width: 40px; align-items: center; justify-content: center; border-radius: 6px; padding: 0 12px; font-size: 15px; font-weight: 600; color: #5a6072; }
.pager a:hover { background: #f1f3f5; }
.pager .is-active { background: #5c67ff; color: #fff; }
.pager .is-active:hover { background: #5c67ff; }
.pager .is-disabled { pointer-events: none; opacity: .35; }
@media (min-width: 640px) {
  .list-head { flex-direction: row; align-items: flex-end; justify-content: space-between; }
  .side-col { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .search { max-width: 320px; }
  .grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 768px) {
  .wrap { padding: 0 24px; }
  .list-h1 { padding-top: 48px; font-size: 36px; }
  .list-h2 { font-size: 26px; }
  .card-title { font-size: 19px; }
  .featured2 { grid-template-columns: 659fr 464fr; gap: 24px; }
  .side-col { grid-template-columns: 1fr; gap: 24px; }
  .hero-body { padding: 24px; }
  .hero-title { font-size: 24px; }
  .hero-intro { font-size: 16px; }
  .hero-meta time { font-size: 14px; }
  .side-title { font-size: 19px; }
  .side-intro { font-size: 15px; }
  .side-body time { font-size: 14px; }
  .gbanner { padding-right: 40px; padding-left: 22rem; }
  .gbanner-list { margin-top: 48px; margin-bottom: 32px; }
  .gbanner-title { font-size: 23px; }
  .gbanner-title img { height: 22px; }
  .gbanner-desc { font-size: 16px; }
  .gbanner-book { right: 20rem; height: 78px; }
  .reports { padding: 16px 20px; }
}
@media (min-width: 1024px) { .grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* ── 글 화면(원본 post-detail.module.css — px 그대로) ──────────────────────── */
.pd-inner { width: 100%; max-width: 800px; margin: 0 auto; box-sizing: border-box; padding: 40px 24px 40px; }
.pd-topbar { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 40px; }
.pd-back { display: inline-flex; align-items: center; gap: 4px; font-size: 14px; font-weight: 500; color: #555; transition: color .2s ease; }
.pd-back:hover { color: #000; }
.pd-crumb { display: flex; align-items: center; gap: 2px; font-size: 13px; color: #999; }
.pd-crumb a { color: #999; transition: color .2s ease; }
.pd-crumb a:hover { color: #0066f9; }
.pd-crumb-sep { color: #c9ccd2; }
.pd-crumb a.pd-crumb-cur { color: #333; font-weight: 500; }
.pd-head { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; padding-bottom: 32px; border-bottom: 1px solid #eee; }
.pd-badge { padding: 5px 12px; border-radius: 999px; background: #eef3ff; color: #0066f9; font-size: 13px; font-weight: 600; letter-spacing: -.3px; }
.pd-title { font-size: 34px; font-weight: 500; color: #111; letter-spacing: -.9px; line-height: 1.35; word-break: keep-all; }
.pd-summary { font-size: 17px; color: #666; letter-spacing: -.4px; line-height: 1.7; word-break: keep-all; }
.pd-meta { display: flex; align-items: center; gap: 10px; font-size: 14px; color: #999; }
.pd-meta-dot { width: 3px; height: 3px; border-radius: 50%; background: #d0d3d8; }
.pd-hero { margin: 40px 0 0; }
.pd-hero img { display: block; width: 100%; height: auto; border-radius: 16px; border: .5px solid #e9e9e9; object-fit: cover; }
.pd-body { padding: 16px 0 0; }
.pd-h2 { margin: 56px 0 16px; font-size: 22px; font-weight: 700; color: #111; letter-spacing: -.6px; line-height: 1.45; word-break: keep-all; }
.pd-p { margin: 24px 0 0; font-size: 17px; color: #333; letter-spacing: -.4px; line-height: 1.85; word-break: keep-all; }
.pd-faq-q { font-weight: 500; color: #111; }
.pd-key-point { font-weight: 700; color: #111; }
.pd-list { margin: 24px 0 0; padding: 24px 28px; border-radius: 12px; background: #f7f8fa; display: flex; flex-direction: column; gap: 12px; }
.pd-list li { position: relative; padding-left: 16px; font-size: 16px; font-weight: 500; color: #111; letter-spacing: -.4px; line-height: 1.7; word-break: keep-all; }
.pd-list li::before { content: ''; position: absolute; top: 10px; left: 0; width: 5px; height: 5px; border-radius: 50%; background: #0066f9; }
.pd-quote { margin: 40px 0 0; padding: 0 0 0 24px; border-left: 3px solid #0066f9; }
.pd-quote p { font-size: 20px; font-weight: 700; color: #111; letter-spacing: -.5px; line-height: 1.7; word-break: keep-all; }
.pd-quote-q { padding: 0 0 28px; border-left: none; border-bottom: 1px solid #e9e9e9; }
.pd-quote-q p::before { content: '\201C'; font-family: Georgia, "Times New Roman", serif; font-size: 2.2em; font-weight: 700; line-height: 0; color: #9aa0a6; margin-right: .1em; vertical-align: .1em; }
.pd-footnote { font-size: calc(17px - 1.5px); color: #666; }
.pd-figure { margin: 40px 0 0; }
.pd-figure img { display: block; width: 100%; height: auto; border-radius: 12px; border: .5px solid #e9e9e9; }
.pd-figure figcaption { margin-top: 12px; font-size: 13px; color: #999; line-height: 1.6; text-align: center; word-break: keep-all; }
.pd-table-wrap { margin: 40px 0 0; overflow-x: auto; -webkit-overflow-scrolling: touch; border: 1px solid #e9e9e9; border-radius: 12px; }
.pd-table { width: 100%; border-collapse: collapse; font-size: 15px; color: #333; }
.pd-table th, .pd-table td { padding: 14px 18px; text-align: left; vertical-align: top; border-bottom: 1px solid #eee; border-right: 1px solid #eee; letter-spacing: -.3px; line-height: 1.6; word-break: keep-all; }
.pd-table th:last-child, .pd-table td:last-child { border-right: none; }
.pd-table thead th { background: #f2f6ff; color: #0066f9; font-weight: 700; white-space: nowrap; border-bottom: 1px solid #dbe6ff; }
.pd-table tbody tr:last-child td { border-bottom: none; }
.pd-table tbody tr:nth-child(2n) td { background: #fafbfc; }
.pd-table tbody td:first-child { font-weight: 600; color: #111; }
.pd-callout { display: flex; flex-direction: column; gap: 8px; margin: 32px 0 0; padding: 24px 28px; border-radius: 12px; border: 1px solid #edf0f3; border-left: 3px solid #0066f9; background: #f7f8fa; }
.pd-callout p { font-size: 16px; font-weight: 500; color: #111; letter-spacing: -.4px; line-height: 1.7; word-break: keep-all; }
.pd-callout p:first-child:not(:only-child) { font-weight: 700; color: #111; }
.pd-cta-wrap { margin: 60px 0 0; }
.pd-cta-card { display: flex; align-items: center; gap: 32px; padding: 34px 36px; border-radius: 16px; background: #f4f8ff; border: 1px solid #e3ecff; }
.pd-cta-info { flex: 1; min-width: 0; }
.pd-cta-logo { display: block; height: 30px; width: auto; margin-bottom: 16px; }
.pd-cta-lead { font-size: 20px; font-weight: 500; color: #111; letter-spacing: -.5px; line-height: 1.4; word-break: keep-all; }
.pd-cta-desc { margin-top: 8px; font-size: 15px; color: #556; letter-spacing: -.4px; line-height: 1.7; word-break: keep-all; }
.pd-cta-btn { flex-shrink: 0; display: inline-flex; align-items: center; gap: 8px; padding: 15px 26px; border-radius: 999px; background: #0066f9; font-size: 16px; font-weight: 700; color: #fff; letter-spacing: -.4px; transition: background .2s ease, transform .2s ease, box-shadow .2s ease; }
.pd-cta-btn:hover { background: #0052cc; transform: translateY(-2px); box-shadow: 0 10px 20px #0066f93d; }
.pd-promo { display: block; width: 100%; margin-top: 16px; border-radius: 12px; overflow: hidden; line-height: 0; transition: transform .2s ease, box-shadow .2s ease; }
.pd-promo:hover { transform: translateY(-2px); box-shadow: 0 10px 24px #0000001f; }
.pd-promo img { display: block; width: 100%; height: auto; }
/* 데스크톱은 가로 긴 배너, 모바일(≤768px)은 _M 배너 */
.pd-promo img.pd-promo-d { display: block; }
.pd-promo img.pd-promo-m { display: none; }
.pd-related { margin-top: 80px; padding-top: 40px; border-top: 1px solid #eee; }
.pd-related-h3 { margin-bottom: 24px; font-size: 20px; font-weight: 600; color: #000; letter-spacing: -.4px; }
.pd-related-cards { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
.pd-related-card { display: flex; flex-direction: column; gap: 14px; }
.pd-related-img { display: block; width: 100%; height: 160px; border-radius: 12px; border: .5px solid #e5e5e5; object-fit: cover; transition: transform .3s cubic-bezier(.16, 1, .3, 1); }
.pd-related-card:hover .pd-related-img { transform: translateY(-4px); }
.pd-related-card:hover .pd-related-title { color: #0066f9; }
.pd-related-meta { display: flex; align-items: center; gap: 12px; font-size: 13px; color: gray; }
.pd-related-meta b { font-weight: 700; color: #000; }
.pd-related-divider { width: 1px; height: 13px; background: #c9ccd2; }
.pd-related-title { font-size: 16px; font-weight: 500; color: #000; letter-spacing: -.4px; line-height: 1.45; word-break: keep-all; transition: color .2s ease; }
.pd-list-btn { display: block; width: 100%; margin-top: 60px; padding: 18px 0; border-radius: 10px; border: 1px solid #e3e5e9; background: #fff; font-size: 15px; font-weight: 600; color: #333; letter-spacing: -.4px; text-align: center; transition: background .2s ease, border-color .2s ease; }
.pd-list-btn:hover { background: #f7f8fa; border-color: #cfd3da; }
@media (max-width: 768px) {
  .pd-inner { padding: 24px 16px 24px; }
  .pd-topbar { margin-bottom: 24px; }
  .pd-crumb { display: none; }
  .pd-title { font-size: 24px; letter-spacing: -.6px; }
  .pd-summary { font-size: 15px; line-height: 1.65; }
  .pd-meta { font-size: 13px; gap: 8px; }
  .pd-hero { margin-top: 28px; }
  .pd-hero img { border-radius: 12px; }
  .pd-h2 { margin-top: 40px; font-size: 19px; }
  .pd-p { font-size: 16px; line-height: 1.8; }
  .pd-quote { margin-top: 32px; padding-left: 16px; }
  .pd-quote-q { padding-left: 0; }
  .pd-quote p { font-size: 18px; }
  .pd-footnote { font-size: 14.5px; }
  .pd-list { padding: 20px; }
  .pd-list li { font-size: 15px; }
  .pd-figure { margin-top: 32px; }
  .pd-table { font-size: 13.5px; }
  .pd-table th, .pd-table td { padding: 11px 12px; }
  .pd-callout { padding: 20px; }
  .pd-callout p { font-size: 15px; }
  .pd-cta-wrap { margin-top: 48px; }
  .pd-cta-card { flex-direction: column; align-items: flex-start; gap: 24px; padding: 28px 24px; }
  .pd-cta-logo { height: 26px; }
  .pd-cta-lead { font-size: 18px; }
  .pd-cta-desc { font-size: 14.5px; }
  .pd-cta-btn { width: 100%; justify-content: center; }
  .pd-promo img.pd-promo-d { display: none; }
  .pd-promo img.pd-promo-m { display: block; height: 68px; object-fit: cover; object-position: center; }
  .pd-related { margin-top: 56px; padding-top: 32px; }
  .pd-related-cards { grid-template-columns: 1fr; gap: 32px; }
  .pd-related-img { height: 180px; }
  .pd-list-btn { margin-top: 40px; }
}

/* ── 용어사전(원본 glossary/page.tsx · glossary-hub.tsx · glossary/[term]/page.tsx) ── */
.gh-hero { border-bottom: 1px solid #e4e7ef; background: #ecf2fc; }
.gh-hero-in { margin: 0 auto; max-width: 880px; padding: 24px 16px 48px; }
.gh-eyebrow { margin-top: 32px; font-size: 15px; font-weight: 700; color: #5c67ff; }
.gh-h1 { margin-top: 12px; font-size: 30px; font-weight: 800; letter-spacing: -0.025em; color: #1a1d2e; }
.gh-lead { margin-top: 12px; font-size: 17px; line-height: 1.625; color: #5a6072; }
.gh-body { margin: 0 auto; max-width: 880px; padding: 40px 16px; }
.gh-search { position: relative; }
.gh-search svg { pointer-events: none; position: absolute; left: 16px; top: 50%; transform: translateY(-50%); color: #9ba1b0; }
.gh-search input { height: 56px; width: 100%; border-radius: 14px; border: 1px solid #e4e7ef; background: #fff; padding: 0 48px; font-size: 17px; color: #1a1d2e; box-shadow: 0 1px 2px rgba(16,24,40,.06); }
.gh-search input:focus { border-color: #5c67ff; outline: none; box-shadow: 0 0 0 4px rgb(92 103 255 / .15); }
.gh-groups { margin-top: 20px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.gh-group { display: flex; height: 48px; align-items: center; justify-content: center; gap: 8px; border-radius: 10px; border: 1px solid #e4e7ef; background: #fff; font-size: 15px; font-weight: 600; color: #5a6072; }
.gh-group:hover { border-color: rgb(92 103 255 / .4); color: #1a1d2e; }
.gh-group.is-active { border-color: #5c67ff; background: #5c67ff; color: #fff; }
.gh-group b { display: flex; height: 20px; width: 20px; align-items: center; justify-content: center; border-radius: 4px; font-size: 12px; font-weight: 700; }
.gh-index { margin-top: 20px; border-radius: 14px; border: 1px solid #e4e7ef; background: #f6f7f9; padding: 12px; display: flex; flex-wrap: wrap; gap: 4px; }
.gh-index a, .gh-index span { display: flex; height: 36px; min-width: 36px; align-items: center; justify-content: center; border-radius: 6px; padding: 0 4px; font-size: 15px; font-weight: 600; }
.gh-index a { color: #1a1d2e; }
.gh-index a:hover { background: #fff; }
.gh-index a.is-active { background: #5c67ff; color: #fff; }
.gh-index span { color: rgb(155 161 176 / .6); }
.gh-count { margin-top: 32px; font-size: 15px; color: #5a6072; }
.gh-count b { color: #1a1d2e; }
.gh-count a { margin-left: 12px; color: #5c67ff; }
.gh-sections { margin-top: 16px; }
.gh-sections > section + section { margin-top: 32px; }
.gh-sections h2 { border-bottom: 1px solid #e4e7ef; padding-bottom: 8px; font-size: 20px; font-weight: 800; color: #5c67ff; }
.gh-sections li + li { border-top: 1px solid #e4e7ef; }
.gh-row { display: flex; align-items: flex-start; gap: 16px; padding: 16px 0; }
.gh-row:hover { background: #f6f7f9; }
.gh-row-main { min-width: 0; flex: 1; }
.gh-row-head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.gh-term { font-size: 18px; font-weight: 700; color: #1a1d2e; }
.gh-row:hover .gh-term { color: #5c67ff; }
.gh-en { font-size: 14px; color: #9ba1b0; }
.gh-tag { border-radius: 4px; padding: 2px 6px; font-size: 12px; font-weight: 700; }
.gh-one { margin-top: 6px; display: block; font-size: 16px; line-height: 1.625; color: #5a6072; }
.gh-row > svg { margin-top: 4px; flex-shrink: 0; color: #9ba1b0; }
.gh-row:hover > svg { color: #5c67ff; }
.gt-banner { border-bottom: 1px solid rgb(245 158 11 / .3); background: #fef6e7; }
.gt-banner-in { margin: 0 auto; display: flex; max-width: 720px; align-items: flex-start; gap: 12px; padding: 16px; font-size: 15px; line-height: 1.625; color: #a16207; }
.gt-head { border-bottom: 1px solid #e4e7ef; background: linear-gradient(to bottom, #ecf2fc, #fff); }
.gt-head-in, .gt-body { margin: 0 auto; max-width: 720px; padding: 0 16px; }
.gt-head-in { padding-top: 32px; padding-bottom: 40px; }
.gt-crumb { display: flex; align-items: center; gap: 4px; font-size: 14px; color: #5a6072; }
.gt-crumb a:hover { color: #5c67ff; }
.gt-tags { margin-top: 24px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.gt-tag { border-radius: 6px; background: #eef0ff; padding: 4px 8px; font-size: 13px; font-weight: 700; color: #2e36b8; }
.gt-tag.is-law { background: #e7f8f2; color: #047857; }
.gt-h1 { margin-top: 16px; font-size: 34px; font-weight: 800; letter-spacing: -0.025em; color: #1a1d2e; }
.gt-en { margin-top: 4px; font-size: 16px; color: #9ba1b0; }
.gt-alias { margin-top: 12px; font-size: 15px; color: #5a6072; }
.gt-def { margin-top: 40px; border-radius: 14px; background: #5c67ff; padding: 24px; color: #fff; }
.gt-def-label { font-size: 14px; font-weight: 700; color: rgb(255 255 255 / .7); }
.gt-def-text { margin-top: 8px; font-size: 20px; font-weight: 600; line-height: 1.625; }
.gt-block { margin-top: 40px; }
.gt-block h2 { display: flex; align-items: center; gap: 10px; font-size: 20px; font-weight: 700; color: #1a1d2e; }
.gt-ico { display: flex; height: 36px; width: 36px; align-items: center; justify-content: center; border-radius: 10px; background: #eef0ff; color: #5c67ff; }
.gt-ico.is-warn { background: #fef6e7; color: #f59e0b; }
.gt-block p { margin-top: 16px; font-size: 16px; line-height: 1.8; color: #1a1d2e; }
.gt-note { margin-top: 8px; font-size: 13px; color: #9ba1b0; }
.gt-article { margin-top: 40px; display: flex; align-items: center; gap: 16px; border-radius: 14px; border: 1px solid #e4e7ef; padding: 16px; transition: border-color .15s; }
.gt-article:hover { border-color: #5c67ff; }
.gt-article img { height: 64px; width: 96px; flex-shrink: 0; border-radius: 10px; border: 1px solid #e4e7ef; object-fit: cover; }
.gt-article-main { min-width: 0; flex: 1; }
.gt-article-label { display: block; font-size: 13px; font-weight: 700; color: #5c67ff; }
.gt-article-title { margin-top: 4px; display: block; font-size: 17px; font-weight: 700; line-height: 1.375; color: #1a1d2e; }
.gt-article:hover .gt-article-title { color: #5c67ff; }
.gt-law { margin-top: 32px; border-radius: 14px; border: 1px solid #e4e7ef; padding: 20px; font-size: 15px; }
.gt-law b { display: flex; align-items: center; gap: 8px; color: #1a1d2e; }
.gt-law p { margin-top: 8px; color: #5a6072; }
.gt-rel { margin: 64px auto 0; max-width: 1200px; padding: 0 16px; }
.gt-rel h2 { font-size: 22px; font-weight: 700; color: #1a1d2e; }
.gt-end { padding-bottom: 64px; }
@media (min-width: 640px) { .gh-groups { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
@media (min-width: 768px) {
  .gh-hero-in { padding: 32px 24px 56px; }
  .gh-h1 { font-size: 38px; }
  .gh-lead { font-size: 18px; }
  .gh-body { padding: 40px 24px; }
  .gh-row { padding-left: 8px; padding-right: 8px; }
  .gt-banner-in, .gt-head-in, .gt-body { padding-left: 0; padding-right: 0; }
  .gt-head-in { padding-top: 48px; }
  .gt-h1 { font-size: 44px; }
  .gt-def { padding: 32px; }
  .gt-def-text { font-size: 22px; }
  .gt-block h2 { font-size: 22px; }
  .gt-block p { font-size: 17px; line-height: 1.85; }
  .gt-article { padding: 20px; }
  .gt-article img { height: 80px; width: 128px; }
  .gt-rel { padding: 0 24px; }
}

/* ── 404 ── */
.nf { display: flex; min-height: 60vh; flex-direction: column; align-items: center; justify-content: center; padding: 0 16px; text-align: center; }
.nf small { font-size: 15px; font-weight: 700; color: #5c67ff; }
.nf h1 { margin-top: 8px; font-size: 24px; font-weight: 700; color: #1a1d2e; }
.nf p { margin-top: 8px; font-size: 16px; color: #5a6072; }
.nf a { margin-top: 24px; border-radius: 6px; background: #5c67ff; padding: 12px 20px; font-size: 15px; font-weight: 700; color: #fff; }
.nf a:hover { background: #2e36b8; }

/* ── 언론 기사 요약 글(원본 press-brief.module.css) ── */
.pb-wrap { display: flex; flex-direction: column; gap: 28px; }
.pb-source { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 14px; color: #666; letter-spacing: -.3px; }
.pb-kicker { display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px; border-radius: 999px; background: #111; color: #fff; font-size: 12px; font-weight: 700; letter-spacing: 0; }
.pb-outlet { font-weight: 700; color: #111; }
.pb-dot { width: 3px; height: 3px; border-radius: 50%; background: #c9ccd2; }
.pb-title { margin: -12px 0 0; font-size: 30px; font-weight: 700; color: #111; letter-spacing: -.8px; line-height: 1.4; word-break: keep-all; }
.pb-card { display: grid; grid-template-columns: 1fr; border: 1px solid #e6e8ec; border-radius: 16px; overflow: hidden; background: #fff; }
.pb-photo { display: block; width: 100%; height: auto; max-height: 520px; object-fit: contain; background: #f2f3f5; border-bottom: 1px solid #e6e8ec; }
.pb-summary { position: relative; padding: 28px 28px 30px 32px; background: #fafbfc; }
.pb-summary::before { content: ''; position: absolute; left: 0; top: 28px; bottom: 30px; width: 4px; border-radius: 0 4px 4px 0; background: #0066f9; }
.pb-label { margin: 0 0 12px; font-size: 13px; font-weight: 700; color: #0066f9; letter-spacing: .2px; }
.pb-lead { margin: 0 0 14px; font-size: 18px; font-weight: 600; color: #111; letter-spacing: -.4px; line-height: 1.65; word-break: keep-all; }
.pb-para { margin: 10px 0 0; font-size: 16px; color: #444; letter-spacing: -.3px; line-height: 1.8; word-break: keep-all; }
.pb-points { padding: 24px 28px; border-radius: 16px; background: #f4f7ff; }
.pb-points ul { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 12px; }
.pb-points li { position: relative; padding-left: 28px; font-size: 16px; font-weight: 500; color: #1a1d2e; letter-spacing: -.3px; line-height: 1.65; word-break: keep-all; }
.pb-points li::before { content: ''; position: absolute; left: 0; top: 4px; width: 18px; height: 18px; border-radius: 50%; background-color: #0066f9; background-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 18 18%22%3E%3Cpath d=%22M5 9.2l2.6 2.6L13 6.4%22 fill=%22none%22 stroke=%22white%22 stroke-width=%222%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22/%3E%3C/svg%3E"); background-position: center; background-size: 18px; background-repeat: no-repeat; }
.pb-actions { display: flex; flex-direction: column; align-items: stretch; gap: 12px; }
.pb-origin { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 16px 24px; border-radius: 12px; background: #0066f9; color: #fff; font-size: 16px; font-weight: 700; letter-spacing: -.3px; text-decoration: none; transition: background .2s ease; }
.pb-origin:hover { background: #0052c7; }
.pb-note { margin: 0; font-size: 13px; color: #999; letter-spacing: -.2px; line-height: 1.6; text-align: center; word-break: keep-all; }
@media (min-width: 720px) {
  .pb-actions { flex-direction: row; justify-content: space-between; align-items: center; }
  .pb-note { text-align: left; }
}