/* ═══════════════════════════════════════════════════════════════
   PAGES/INSIGHTS.CSS — /insights/ 및 자식 페이지 전용
   조건부 로드: functions.php is_page('insights' | 자식 슬러그) 분기
   원본: style.css 에서 분리 (B-lite Phase 2B, 2026-04-29)

   포함 클래스:
   - .fnc-insights-v2 (페이지 래퍼)
   - .fnc-ins-* (hero·sec·kpi·chart·essays·reports 등)
   - .fnc-essay-* (편집장 추천 / 리스트)
   ═══════════════════════════════════════════════════════════════ */

   Data Insights Page v2 — Stitch 디자인 (대시보드 + 데이터 에세이)
   구조: Hero 12col(8+4) → Key Indicators 4col → 차트+에세이 8+4 → 리포트 3col
   ═══════════════════════════════════════════════════════════════ */

/* WP 기본 제목/래퍼 constrained 해제 (media 페이지와 동일 패턴) */
body:has(.fnc-insights-v2) .wp-block-post-title,
body:has(.fnc-insights-v2) .entry-title { display: none !important; }
body:has(.fnc-insights-v2) > .wp-site-blocks > main.wp-block-group,
body:has(.fnc-insights-v2) .wp-block-post-content {
    max-width: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}
body:has(.fnc-insights-v2) .wp-block-post-content > * { max-width: none !important; }

.fnc-insights-v2 {
    max-width: 1280px;
    margin: 0 auto;
    padding: 4rem 1.5rem 6rem;
}
@media (min-width: 768px) { .fnc-insights-v2 { padding: 5rem 3rem 6rem; } }

/* ── Hero (12-col: 8 text + 4 buttons) ─────────────────── */
.fnc-ins-hero {
    display: grid;
    grid-template-columns: 1fr;
    gap: 3rem;
    align-items: end;
    margin-bottom: 6rem;
}
@media (min-width: 1024px) {
    .fnc-ins-hero { grid-template-columns: 2fr 1fr; }
}
.fnc-ins-hero h1 {
    font-family: var(--wp--preset--font-family--headline);
    font-size: clamp(2.5rem, 5vw, 3.75rem);
    font-weight: 800;
    letter-spacing: -.03em;
    line-height: 1.1;
    color: var(--wp--preset--color--on-surface);
    margin: 0 0 1.5rem 0 !important;
    word-break: keep-all;
}
.fnc-ins-hero h1 .accent { color: var(--wp--preset--color--primary); }
.fnc-ins-hero__sub {
    font-family: var(--wp--preset--font-family--body);
    font-size: 1.125rem;
    line-height: 1.7;
    color: var(--wp--preset--color--on-surface-variant);
    max-width: 48rem;
    margin: 0;
    word-break: keep-all;
}
.fnc-ins-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
    justify-content: flex-start;
}
@media (min-width: 1024px) { .fnc-ins-hero__actions { justify-content: flex-end; } }
.fnc-ins-btn {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    font-family: var(--wp--preset--font-family--label);
    font-size: .875rem;
    font-weight: 600;
    padding: .75rem 1.5rem;
    border-radius: 6px;
    text-decoration: none;
    transition: background .2s, color .2s, border-color .2s;
    white-space: nowrap;
}
.fnc-ins-btn--primary {
    background: var(--wp--preset--color--primary);
    color: var(--wp--preset--color--on-primary) !important;
    border: 1px solid var(--wp--preset--color--primary);
}
.fnc-ins-btn--primary:hover { background: var(--wp--preset--color--primary-container); border-color: var(--wp--preset--color--primary-container); }
.fnc-ins-btn--secondary {
    background: transparent;
    color: var(--wp--preset--color--primary) !important;
    border: 1px solid var(--wp--preset--color--outline-variant);
}
.fnc-ins-btn--secondary:hover { background: var(--wp--preset--color--surface-container-low); }
.fnc-ins-btn .material-symbols-outlined { font-size: 18px; }

/* ── 섹션 공통 헤더 (h2 + border-bottom) ─────────────── */
.fnc-ins-sec { margin-bottom: 8rem; }
.fnc-ins-sec:last-child { margin-bottom: 0; }
.fnc-ins-sec__h {
    font-family: var(--wp--preset--font-family--headline);
    font-size: 1.5rem;
    font-weight: 700;
    letter-spacing: -.015em;
    color: var(--wp--preset--color--on-surface);
    margin: 0 0 2rem 0 !important;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--wp--preset--color--surface-container-high);
}
.fnc-ins-sec__h-flex {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 2rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--wp--preset--color--surface-container-high);
}
.fnc-ins-sec__h-flex h2 {
    font-family: var(--wp--preset--font-family--headline);
    font-size: 1.5rem;
    font-weight: 700;
    letter-spacing: -.015em;
    color: var(--wp--preset--color--on-surface);
    margin: 0 !important;
}
.fnc-ins-sec__link {
    font-family: var(--wp--preset--font-family--label);
    font-size: .875rem;
    font-weight: 500;
    color: var(--wp--preset--color--primary);
    text-decoration: none;
}
.fnc-ins-sec__link:hover { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }

/* ── Key Indicators 대시보드 (4-col bento) ──────────── */
.fnc-ins-kpis {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
}
@media (min-width: 640px) { .fnc-ins-kpis { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .fnc-ins-kpis { grid-template-columns: repeat(4, 1fr); } }

.fnc-kpi {
    background: var(--wp--preset--color--surface-container-lowest);
    padding: 1.5rem;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 220px;
    transition: background .3s;
}
.fnc-kpi:hover { background: var(--wp--preset--color--surface-container-low); }
.fnc-kpi--dark {
    background: linear-gradient(135deg, var(--wp--preset--color--primary), var(--wp--preset--color--primary-container));
    color: var(--wp--preset--color--on-primary);
}
.fnc-kpi--dark:hover { background: linear-gradient(135deg, var(--wp--preset--color--primary), var(--wp--preset--color--primary-container)); }

.fnc-kpi__top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1rem;
}
.fnc-kpi__label {
    font-family: var(--wp--preset--font-family--label);
    font-size: .875rem;
    font-weight: 500;
    color: var(--wp--preset--color--on-surface-variant);
}
.fnc-kpi--dark .fnc-kpi__label { color: rgba(255,255,255,.8); }

.fnc-kpi__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: .375rem;
    border-radius: 8px;
    font-size: 20px;
}
.fnc-kpi__icon--primary { color: var(--wp--preset--color--primary); background: rgba(13,99,27,.1); }
.fnc-kpi__icon--secondary { color: var(--wp--preset--color--secondary); background: rgba(16,107,86,.1); }
.fnc-kpi__icon--tertiary { color: var(--wp--preset--color--tertiary); background: rgba(65,90,85,.1); }
.fnc-kpi__icon--on-dark { color: #fff; background: rgba(255,255,255,.2); }

.fnc-kpi__num {
    font-family: var(--wp--preset--font-family--headline);
    font-size: 2.5rem;
    font-weight: 700;
    color: var(--wp--preset--color--on-surface);
    line-height: 1.1;
    margin-bottom: .5rem;
    transition: color .3s;
}
.fnc-kpi:hover .fnc-kpi__num { color: var(--wp--preset--color--primary); }
.fnc-kpi--dark .fnc-kpi__num,
.fnc-kpi--dark:hover .fnc-kpi__num { color: #fff; }
.fnc-kpi__num-unit {
    font-size: 1.25rem;
    font-weight: 400;
    color: var(--wp--preset--color--on-surface-variant);
    margin-left: .25rem;
}
.fnc-kpi--dark .fnc-kpi__num-unit { color: rgba(255,255,255,.8); }

.fnc-kpi__delta {
    display: flex;
    align-items: center;
    gap: .25rem;
    font-size: .875rem;
}
.fnc-kpi__delta--up { color: var(--wp--preset--color--error); }
.fnc-kpi__delta--down { color: var(--wp--preset--color--primary); }
.fnc-kpi__delta--neutral { color: var(--wp--preset--color--on-surface-variant); }
.fnc-kpi--dark .fnc-kpi__delta { color: var(--wp--preset--color--on-primary-container); }
.fnc-kpi__delta .material-symbols-outlined { font-size: 18px; }

.fnc-kpi__spark {
    width: 100%;
    height: 48px;
    margin-top: 1rem;
    border-radius: 4px;
    background: linear-gradient(to right, var(--wp--preset--color--surface-container-highest), var(--wp--preset--color--surface-container-high));
    overflow: hidden;
    position: relative;
}
.fnc-kpi__spark svg {
    width: 100%;
    height: 100%;
    fill: none;
    stroke-width: 2;
    opacity: .6;
}
.fnc-kpi__spark svg.pri { stroke: var(--wp--preset--color--primary); }
.fnc-kpi__spark svg.sec { stroke: var(--wp--preset--color--secondary); }
.fnc-kpi__badge {
    width: 100%;
    height: 48px;
    margin-top: 1rem;
    border-radius: 4px;
    background: var(--wp--preset--color--surface-container-high);
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--wp--preset--font-family--label);
    font-size: .75rem;
    color: var(--wp--preset--color--outline);
}
.fnc-kpi__more {
    margin-top: 1rem;
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    font-size: .875rem;
    font-weight: 500;
    color: inherit;
    text-decoration: none;
    transition: color .15s;
}
.fnc-kpi:not(.fnc-kpi--dark) .fnc-kpi__more { color: var(--wp--preset--color--primary); }
.fnc-kpi:not(.fnc-kpi--dark) .fnc-kpi__more:hover { opacity: .75; }
.fnc-kpi--dark .fnc-kpi__more:hover { color: var(--wp--preset--color--on-primary-container); }
.fnc-kpi__more .material-symbols-outlined { font-size: 18px; }

/* ── 차트 + 에세이 섹션 (8/4 split) ──────────────────── */
.fnc-ins-chart-row {
    display: grid;
    grid-template-columns: 1fr;
    gap: 3rem;
}
@media (min-width: 1024px) {
    .fnc-ins-chart-row { grid-template-columns: 2fr 1fr; }
}

/* 차트 placeholder (좌측) */
.fnc-ins-chart {
    background: var(--wp--preset--color--surface-container-lowest);
    padding: 2rem;
    border-radius: 16px;
}
.fnc-ins-chart__hd {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
}
.fnc-ins-chart__hd h3 {
    font-family: var(--wp--preset--font-family--headline);
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--wp--preset--color--on-surface);
    margin: 0 !important;
}
.fnc-ins-chart__frame {
    width: 100%;
    height: 400px;
    background: var(--wp--preset--color--surface-container-low);
    border-radius: 12px;
    position: relative;
    overflow: hidden;
}
.fnc-ins-chart__grid {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 2rem 3rem;
    opacity: .2;
    pointer-events: none;
}
.fnc-ins-chart__grid > div {
    width: 100%;
    border-bottom: 1px solid var(--wp--preset--color--outline);
}
.fnc-ins-chart__bars {
    position: absolute;
    left: 3rem;
    right: 3rem;
    bottom: 2rem;
    height: 16rem;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem;
}
.fnc-ins-chart__bar {
    flex: 1;
    border-radius: 2px 2px 0 0;
}
.fnc-ins-chart__bar--b1 { background: var(--wp--preset--color--secondary-container); height: 40%; }
.fnc-ins-chart__bar--b2 { background: #87d6bd; height: 60%; }
.fnc-ins-chart__bar--b3 { background: var(--wp--preset--color--primary); height: 85%; }
.fnc-ins-chart__bar--b4 { background: var(--wp--preset--color--primary-container); height: 30%; }
.fnc-ins-chart__bar--b5 { background: #1b6d24; height: 70%; }
.fnc-ins-chart__cta {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(251,249,248,.5);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
    opacity: 0;
    transition: opacity .3s;
}
.fnc-ins-chart__frame:hover .fnc-ins-chart__cta { opacity: 1; }
.fnc-ins-chart__cta-btn {
    background: var(--wp--preset--color--surface);
    color: var(--wp--preset--color--primary);
    font-family: var(--wp--preset--font-family--label);
    font-size: .875rem;
    padding: .5rem 1rem;
    border-radius: 6px;
    border: 1px solid var(--wp--preset--color--outline-variant);
    box-shadow: 0 1px 3px rgba(13, 99, 27,.05);
}
.fnc-ins-chart__cap {
    margin-top: 1.5rem;
    font-family: var(--wp--preset--font-family--body);
    font-size: .875rem;
    line-height: 1.7;
    color: var(--wp--preset--color--on-surface-variant);
}

/* 데이터 에세이 (우측) */
.fnc-ins-essays { display: flex; flex-direction: column; gap: 2rem; }
.fnc-ins-essays > .fnc-ins-sec__h { margin-bottom: 0 !important; }
.fnc-essay-featured {
    background: rgba(13,99,27,.08);
    padding: 1.5rem;
    border-radius: 12px;
    text-decoration: none;
    color: inherit;
    display: block;
    transition: background .2s;
}
.fnc-essay-featured:hover { background: rgba(13,99,27,.14); }
.fnc-essay-pill {
    display: inline-block;
    padding: .2rem .5rem;
    background: rgba(13,99,27,.1);
    color: var(--wp--preset--color--primary);
    font-family: var(--wp--preset--font-family--label);
    font-size: .75rem;
    border-radius: 3px;
    margin-bottom: .75rem;
}
.fnc-essay-featured h4 {
    font-family: var(--wp--preset--font-family--headline);
    font-size: 1.25rem;
    font-weight: 700;
    letter-spacing: -.01em;
    color: var(--wp--preset--color--on-surface);
    margin: 0 0 .75rem 0 !important;
    transition: color .15s;
    word-break: keep-all;
}
.fnc-essay-featured:hover h4 { color: var(--wp--preset--color--primary); }
.fnc-essay-featured p {
    font-family: var(--wp--preset--font-family--body);
    font-size: .875rem;
    line-height: 1.6;
    color: var(--wp--preset--color--on-surface-variant);
    margin: 0 0 1rem 0;
    word-break: keep-all;
}
.fnc-essay-more {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    color: var(--wp--preset--color--primary);
    font-family: var(--wp--preset--font-family--label);
    font-size: .875rem;
    font-weight: 500;
}
.fnc-essay-more .material-symbols-outlined { font-size: 18px; }

.fnc-essay-list { display: flex; flex-direction: column; gap: .75rem; }
.fnc-essay-list-item {
    display: block;
    padding: 1rem 1.25rem;
    background: var(--wp--preset--color--surface-container-highest);
    border-radius: 10px;
    text-decoration: none;
    color: inherit;
    transition: background .2s;
}
.fnc-essay-list-item:hover { background: var(--wp--preset--color--surface-container-high); }
.fnc-essay-list-item:last-child { border-bottom: none; }
.fnc-essay-list-item h5 {
    font-family: var(--wp--preset--font-family--headline);
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: -.01em;
    color: var(--wp--preset--color--on-surface);
    margin: 0 0 .25rem 0 !important;
    transition: color .15s;
    word-break: keep-all;
}
.fnc-essay-list-item:hover h5 { color: var(--wp--preset--color--primary); }
.fnc-essay-list-item__meta {
    font-family: var(--wp--preset--font-family--label);
    font-size: .75rem;
    color: var(--wp--preset--color--on-surface-variant);
}

/* ── Deep Dive Reports (3-col / 4-col 모디파이어) ───────── */
/* WP 글로벌 a:where(...){text-decoration:underline} override */
.fnc-ins-reports .fnc-report-card { text-decoration: none; color: inherit; }

.fnc-ins-reports {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2rem;
}
@media (min-width: 768px) {
    .fnc-ins-reports { grid-template-columns: repeat(3, 1fr); }
    .fnc-ins-reports--4col { grid-template-columns: repeat(4, 1fr); gap: 1.25rem; }
}

/* ── 연구 하이라이트 카드 (홈 v2 fnc-h2-research-* 동일) ──
   /insights/ 심층 보고서를 홈페이지의 카드 디자인과 동일하게.
   home2.css 의 .fnc-h2-research-* 와 시각/구조 동기화. */
.fnc-h2-research-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
}
@media (min-width: 700px) {
    .fnc-h2-research-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1024px) {
    .fnc-h2-research-grid { grid-template-columns: repeat(4, 1fr); }
}
.fnc-h2-research-card {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 1px 2px rgba(0,0,0,0.04);
    text-decoration: none;
    color: inherit;
    transition: box-shadow .2s ease, transform .2s ease;
}
.fnc-h2-research-card:hover {
    box-shadow: 0 6px 18px rgba(0,0,0,0.08);
    transform: translateY(-2px);
}
.fnc-h2-research-card__img {
    height: 160px;
    overflow: hidden;
    background: #f1f5f9;
}
.fnc-h2-research-card__img img {
    width: 100%; height: 100%; object-fit: cover;
    transition: transform .5s ease;
}
.fnc-h2-research-card:hover .fnc-h2-research-card__img img { transform: scale(1.05); }
.fnc-h2-research-card__body {
    padding: 20px;
    flex: 1;
    display: flex;
    flex-direction: column;
}
.fnc-h2-research-card__title {
    font-family: var(--wp--preset--font-family--headline, 'Inter', system-ui, sans-serif);
    font-size: 1.05rem;
    font-weight: 600;
    line-height: 1.35;
    color: #012d1d;
    margin: 0 0 12px;
    word-break: keep-all;
}
.fnc-h2-research-card__desc {
    font-family: 'Newsreader', var(--wp--preset--font-family--body, Georgia, serif);
    font-size: 0.875rem;
    color: #414844;
    margin: 0 0 16px;
    flex: 1;
    line-height: 1.55;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    word-break: keep-all;
}
.fnc-h2-research-card__more {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-family: var(--wp--preset--font-family--label, 'Inter', system-ui, sans-serif);
    font-size: 0.85rem;
    font-weight: 700;
    color: #012d1d;
}
.fnc-h2-research-card__more:hover { text-decoration: underline; }
.fnc-h2-research-card__more .material-symbols-outlined { font-size: 16px; }