/* l2g-funnel — 홈페이지 바로가기 Interactive Funnel 공통 스타일
 * 모든 선택자는 .l2g-funnel 아래로 한정한다. 전역 태그 선택자(a, button, h2 …) 금지.
 * 모바일 우선: 기본값이 모바일, 640px 이상에서 2열.
 */
.l2g-funnel {
  --l2g-text: #172033;
  --l2g-muted: #667085;
  --l2g-line: #E6E8EC;
  --l2g-soft: #FAF9F7;
  --l2g-accent: #24527A;
  --l2g-accent-hover: #173A59;
  --l2g-radius: 12px;
  color: var(--l2g-text);
  font-size: 17px;
  line-height: 1.75;
  word-break: keep-all;
  overflow-wrap: anywhere;
}
.l2g-funnel *,
.l2g-funnel *::before,
.l2g-funnel *::after { box-sizing: border-box; }

/* 퍼널 글에서는 테마의 날짜·작성자 줄을 숨긴다 (body.l2g-funnel-page 는 mu-plugin 이 붙임) */
.l2g-funnel-page .entry-header .entry-meta { display: none; }

/* 브레드크럼 */
.l2g-funnel-crumb { margin: 0 0 16px; font-size: 16px; color: var(--l2g-muted); }
.l2g-funnel-crumb ol { display: flex; flex-wrap: wrap; gap: 4px; margin: 0; padding: 0; list-style: none; }
.l2g-funnel-crumb li { display: inline-flex; align-items: center; gap: 4px; margin: 0; }
.l2g-funnel-crumb li + li::before { content: "›"; color: #9ca3af; }
.l2g-funnel-crumb a { color: var(--l2g-muted); text-decoration: none; }
.l2g-funnel-crumb a:hover { text-decoration: underline; }
.l2g-funnel-crumb [aria-current="page"] { color: var(--l2g-text); font-weight: 600; }

.l2g-funnel-intro { margin: 0 0 20px; font-size: 17px; }

/* 목적 선택 카드 (허브) */
.l2g-funnel-menu { margin: 24px 0 36px; }
.l2g-funnel-grid { display: grid; grid-template-columns: 1fr; gap: 12px; margin: 0; padding: 0; list-style: none; }
.l2g-funnel-grid > li { margin: 0; padding: 0; }
.l2g-funnel .l2g-funnel-card {
  display: flex; align-items: center; gap: 12px;
  min-height: 76px; height: 100%; padding: 16px 18px;
  background: #fff; border: 1px solid var(--l2g-line); border-radius: var(--l2g-radius);
  color: var(--l2g-text); text-decoration: none;
  transition: border-color .15s, background-color .15s;
}
.l2g-funnel .l2g-funnel-card:hover { border-color: var(--l2g-accent); background: var(--l2g-soft); }
.l2g-funnel .l2g-funnel-card:focus-visible { outline: 3px solid var(--l2g-accent); outline-offset: 2px; }
.l2g-funnel-card-body { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
.l2g-funnel-card-title { font-size: 18px; font-weight: 700; line-height: 1.4; }
.l2g-funnel-card-desc { font-size: 16px; color: var(--l2g-muted); line-height: 1.5; }
.l2g-funnel-card-go { flex: none; font-size: 16px; font-weight: 600; color: var(--l2g-accent); white-space: nowrap; }

/* CTA — 박스 없이 버튼만 (2026-10-01 A안). 브랜드 CTA 색(#24527A) 한 가지, 광고와 위아래 여백으로 분리 */
.l2g-funnel-cta { margin: 32px 0; }
.l2g-funnel .l2g-funnel-button {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  width: 100%; min-height: 60px; padding: 14px 20px;
  background: var(--l2g-accent); border: 0; border-radius: 10px;
  color: #fff; font-size: 18px; font-weight: 700; line-height: 1.3; text-align: center; text-decoration: none;
}
.l2g-funnel .l2g-funnel-button:hover { background: var(--l2g-accent-hover); color: #fff; }
.l2g-funnel .l2g-funnel-button:focus { outline: none; }
.l2g-funnel .l2g-funnel-button:focus-visible { outline: 2px solid var(--l2g-accent); outline-offset: 3px; }

/* 광고 — CTA 와 시각적으로 분리. 높이를 미리 잡아 CLS 방지 */
.l2g-funnel-ad { margin: 40px 0; min-height: 280px; text-align: center; clear: both; }

/* 본문 섹션 */
.l2g-funnel-section { margin: 40px 0 0; scroll-margin-top: 80px; }
.l2g-funnel .l2g-funnel-h2 { margin: 0 0 14px; font-size: 22px; line-height: 1.4; }
.l2g-funnel .l2g-funnel-h3 { margin: 22px 0 6px; font-size: 18px; line-height: 1.45; }
.l2g-funnel-section p { margin: 0 0 14px; }
.l2g-funnel-section.is-target .l2g-funnel-h2 { color: var(--l2g-accent); }
.l2g-funnel .l2g-funnel-section a:not(.l2g-funnel-button):not(.l2g-funnel-related-link) { color: var(--l2g-accent); text-decoration: underline; text-underline-offset: 3px; }

.l2g-funnel-list, .l2g-funnel-steps { margin: 0 0 16px; padding-left: 22px; }
.l2g-funnel-list li, .l2g-funnel-steps li { margin: 0 0 6px; }

.l2g-funnel-table-wrap { margin: 0 0 16px; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.l2g-funnel-table { width: 100%; margin: 0; border-collapse: collapse; font-size: 16px; line-height: 1.55; }
.l2g-funnel-table th, .l2g-funnel-table td { padding: 10px 12px; border: 1px solid var(--l2g-line); text-align: left; vertical-align: top; }
.l2g-funnel-table th { background: var(--l2g-soft); font-weight: 600; white-space: nowrap; }

.l2g-funnel-note { margin: 0 0 16px; padding: 12px 14px; border-left: 3px solid #cbd5e1; background: var(--l2g-soft); font-size: 16px; color: var(--l2g-muted); }

/* 관련 메뉴 */
.l2g-funnel-related { margin: 40px 0 0; }
.l2g-funnel-related-list { display: grid; grid-template-columns: 1fr; gap: 8px; margin: 0; padding: 0; list-style: none; }
.l2g-funnel-related-list li { margin: 0; }
.l2g-funnel .l2g-funnel-related-link {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  min-height: 52px; padding: 12px 16px;
  border: 1px solid var(--l2g-line); border-radius: 10px; background: #fff;
  color: var(--l2g-text); text-decoration: none; font-size: 16px;
}
.l2g-funnel .l2g-funnel-related-link:hover { border-color: var(--l2g-accent); }
.l2g-funnel-related-link span:last-child { flex: none; font-size: 16px; color: var(--l2g-accent); }
.l2g-funnel-related-desc { display: block; font-size: 16px; color: var(--l2g-muted); }

/* FAQ — 항상 펼쳐 둔다 (FAQ 스키마는 화면에 보이는 내용만) */
.l2g-funnel-faq { margin: 40px 0 0; }
.l2g-funnel-faq-item { padding: 14px 0; border-top: 1px solid var(--l2g-line); }
.l2g-funnel-faq-item:last-child { border-bottom: 1px solid var(--l2g-line); }
.l2g-funnel .l2g-funnel-faq-q { margin: 0 0 6px; font-size: 17px; font-weight: 700; line-height: 1.5; }
.l2g-funnel-faq-a { margin: 0; color: var(--l2g-muted); }

@media (min-width: 640px) {
  .l2g-funnel-menu .l2g-funnel-grid { grid-template-columns: 1fr 1fr; }
  .l2g-funnel-related-list { grid-template-columns: 1fr 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .l2g-funnel .l2g-funnel-card { transition: none; }
}