/* 정책 제안 랜딩 — /policy-proposals/  (재설계 2026-07, KIFC 디자인 시스템 기반)
 * 모든 규칙은 .fnc-pp 루트로 스코프. 색·타이포는 style.css .fnc-* / theme.json 토큰 재사용.
 * 분야 필터 그리드 + 분야별 accent 색상 코딩. (구 .pp-* 디자인 대체)
 */
/* full-bleed 은 발행 스크립트가 콘텐츠를 wp:group.alignfull(root-padding-aware)로 감싸
   테마 기본 메커니즘으로 처리한다. .fnc-pp 자체는 breakout 하지 않는다 (내부는 .fnc-pp-wrap 으로 constrain). */
.fnc-pp {
    background: var(--wp--preset--color--background);
    color: var(--wp--preset--color--on-surface);
    font-family: var(--wp--preset--font-family--body);
}
.fnc-pp-wrap { max-width: 1280px; margin: 0 auto; padding: 0 var(--wp--preset--spacing--50); }

/* ── Hero ─────────────────────────────────────────────────────── */
.fnc-pp-hero {
    position: relative;
    isolation: isolate;
    color: #fff;
    overflow: hidden;
    background: #153f24;
}
.fnc-pp-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -2;
    background: url("/wp-content/uploads/2026/07/policy-proposals-hero.jpg") center 52% / cover no-repeat;
    transform: scale(1.01);
}
.fnc-pp-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(90deg, rgba(10, 43, 27, 0.95) 0%, rgba(18, 67, 34, 0.88) 45%, rgba(18, 65, 33, 0.62) 73%, rgba(12, 45, 27, 0.42) 100%),
        linear-gradient(180deg, rgba(8, 39, 24, 0.12) 0%, rgba(8, 38, 24, 0.42) 100%);
}
.fnc-pp-hero__inner { position: relative; z-index: 1; max-width: 1280px; margin: 0 auto;
    padding: var(--wp--preset--spacing--80) var(--wp--preset--spacing--50); }
.fnc-pp-hero__eyebrow { font-family: var(--wp--preset--font-family--label); font-size: 0.78rem;
    font-weight: 800; letter-spacing: 0.18em; text-transform: uppercase; color: #cdeec2; margin: 0 0 1rem; }
.fnc-pp-hero h1 { font-family: var(--wp--preset--font-family--headline); font-size: clamp(2.4rem, 5vw, 3.75rem);
    font-weight: 800; letter-spacing: -0.03em; line-height: 1.1; margin: 0 0 0.5rem; }
.fnc-pp-hero h1 .en { display: block; font-size: 0.95rem; font-weight: 700; letter-spacing: 0.12em;
    text-transform: uppercase; color: #cdeec2; margin-top: 0.6rem; }
.fnc-pp-hero__lead { font-size: 1.15rem; line-height: 1.7; color: rgba(255,255,255,0.9); max-width: 64ch; margin: 1.5rem 0 0; }

/* ── Progress ─────────────────────────────────────────────────── */
.fnc-pp-progress { display: flex; align-items: center; gap: 1rem; margin-top: 2.25rem; flex-wrap: wrap; }
.fnc-pp-progress .count { font-family: var(--wp--preset--font-family--headline); font-weight: 800; font-size: 1.1rem; color: #fff; }
.fnc-pp-progress .count b { color: #cdeec2; font-size: 1.6rem; }
.fnc-pp-bar { flex: 1; min-width: 180px; max-width: 360px; height: 8px; border-radius: 999px; background: rgba(255,255,255,0.18); overflow: hidden; }
.fnc-pp-bar > span { display: block; height: 100%; border-radius: 999px; background: linear-gradient(90deg,#cdeec2,#5cb85c); }

/* ── Filter chips ─────────────────────────────────────────────── */
.fnc-pp-filters { display: flex; flex-wrap: wrap; gap: 0.6rem; margin: var(--wp--preset--spacing--60) 0 var(--wp--preset--spacing--50); }
.fnc-pp-chip { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem;
    border-radius: 999px; border: 1px solid var(--wp--preset--color--outline-variant);
    background: var(--wp--preset--color--surface-container-lowest); color: var(--wp--preset--color--on-surface-variant);
    font-family: var(--wp--preset--font-family--label); font-size: 0.85rem; font-weight: 700; cursor: pointer;
    transition: background .15s, color .15s, border-color .15s; }
.fnc-pp-chip .material-symbols-outlined { font-size: 18px; }
.fnc-pp-chip:hover { border-color: var(--wp--preset--color--primary); color: var(--wp--preset--color--primary); }
.fnc-pp-chip.is-active { background: var(--wp--preset--color--primary); border-color: var(--wp--preset--color--primary); color: #fff; }
.fnc-pp-chip .n { font-size: 0.72rem; opacity: 0.7; font-variant-numeric: tabular-nums; }

/* ── Card grid ────────────────────────────────────────────────── */
.fnc-pp-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 1.25rem;
    padding-bottom: var(--wp--preset--spacing--70); }
.fnc-pp-card { --c: var(--wp--preset--color--primary);
    display: flex; flex-direction: column; background: var(--wp--preset--color--surface-container-lowest);
    border: 1px solid var(--wp--preset--color--outline-variant); border-left: 3px solid var(--c);
    border-radius: var(--fnc-radius-md); padding: 1.5rem; text-decoration: none;
    transition: transform .18s ease, box-shadow .18s ease; }
a.fnc-pp-card:hover { transform: translateY(-3px); box-shadow: 0 12px 28px rgba(23,70,63,0.10); }
.fnc-pp-card__badge { align-self: flex-start; display: inline-flex; align-items: center; gap: 0.35rem;
    font-family: var(--wp--preset--font-family--label); font-size: 0.68rem; font-weight: 800;
    letter-spacing: 0.06em; text-transform: uppercase; color: var(--c);
    background: color-mix(in srgb, var(--c) 12%, transparent); padding: 4px 10px; border-radius: 999px; margin-bottom: 0.9rem; }
.fnc-pp-card__badge .material-symbols-outlined { font-size: 15px; }
.fnc-pp-card__title { font-family: var(--wp--preset--font-family--headline); font-size: 1.12rem; font-weight: 700;
    line-height: 1.4; letter-spacing: -0.01em; color: var(--wp--preset--color--on-surface); margin: 0 0 0.6rem; }
a.fnc-pp-card:hover .fnc-pp-card__title { color: var(--c); }
.fnc-pp-card__summary { font-size: 0.9rem; line-height: 1.6; color: var(--wp--preset--color--on-surface-variant);
    margin: 0 0 1.25rem; flex: 1; }
.fnc-pp-card__foot { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem;
    font-family: var(--wp--preset--font-family--label); font-size: 0.76rem; color: var(--wp--preset--color--outline); }
.fnc-pp-card__foot .go { color: var(--c); font-weight: 700; }
.fnc-pp-card__status { display: inline-block; font-size: 0.66rem; font-weight: 800; letter-spacing: 0.08em;
    text-transform: uppercase; color: var(--wp--preset--color--outline);
    border: 1px solid var(--wp--preset--color--outline-variant); padding: 2px 8px; border-radius: 999px; }
/* planned variant */
.fnc-pp-card--planned { border-style: dashed; border-left-style: solid; background: transparent; }
.fnc-pp-card--planned .fnc-pp-card__title { color: var(--wp--preset--color--on-surface-variant); }

/* 분야별 accent 색 */
.fnc-pp-card[data-domain="farmland"]       { --c: #567f28; }  /* 올리브 */
.fnc-pp-card[data-domain="direct-payment"] { --c: #167a6b; }  /* 틸그린 */
.fnc-pp-card[data-domain="governance"]     { --c: #47695b; }  /* 슬레이트 그린 */
.fnc-pp-card[data-domain="food-security"]  { --c: #a06520; }  /* 하베스트 어스 */
.fnc-pp-card[data-domain="carbon-neutral"] { --c: #2b7735; }  /* 프레시 그린 */
.fnc-pp-card[data-domain="regen-ag"]       { --c: #6b7a24; }  /* 라임 올리브 */

/* 필터 숨김 */
.fnc-pp-card.is-hidden { display: none; }
.fnc-pp-empty { display: none; color: var(--wp--preset--color--on-surface-variant); padding: 2rem 0; }

@media (max-width: 640px) {
    .fnc-pp-grid { grid-template-columns: 1fr; }
    .fnc-pp-hero::before { background-position: 58% center; }
    .fnc-pp-hero::after {
        background:
            linear-gradient(90deg, rgba(10, 43, 27, 0.94) 0%, rgba(18, 67, 34, 0.88) 100%),
            linear-gradient(180deg, rgba(8, 39, 24, 0.18) 0%, rgba(8, 38, 24, 0.52) 100%);
    }
    .fnc-pp-hero__inner { padding: var(--wp--preset--spacing--70) var(--wp--preset--spacing--50); }
}