/*
Theme Name: 잘살기
Template: twentytwentyfive
Description: jalsalgi.com 전용 하위 테마 -- 토스피드식 카드형 레이아웃, 초록 대표 색, Pretendard.
Version: 1.0.5
Text Domain: jalsalgi
*/

/* ── 공통 ─────────────────────────────────────────────── */
:root { --jal-green:#0E9F6E; --jal-green-dark:#057A55; --jal-green-soft:#E8F7F0; --jal-yellow:#FFD43B;
        --jal-ink:#191F28; --jal-sub:#4E5968; --jal-mute:#8B95A1; --jal-line:#E5E8EB; --jal-bg2:#F2F4F6; }
body { word-break: keep-all; -webkit-font-smoothing: antialiased; }
a { text-underline-offset: .18em; }

/* ── 헤더 ─────────────────────────────────────────────── */
/* backdrop-filter 를 쓰지 않는다: 그것이 있으면 안의 position:fixed(휴대폰 전체 화면 메뉴)가 헤더 크기에
   갇혀 메뉴가 첫 항목만 잘려 보였다(2026-10-04 실측). 불투명 흰 배경으로 둔다. */
.jal-header { border-bottom:1px solid var(--jal-line); position:sticky; top:0; z-index:50; background:#fff; }
.jal-header .wp-block-navigation__responsive-container.is-menu-open { padding:24px; }
.jal-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item a { font-size:20px; padding:10px 0; }
.jal-brand { display:flex; align-items:center; gap:10px; text-decoration:none; color:var(--jal-ink); }
.jal-brand svg { width:34px; height:34px; flex:none; }
.jal-brand b { font-size:22px; font-weight:800; letter-spacing:-.04em; }
.jal-brand small { display:block; font-size:12px; color:var(--jal-mute); font-weight:500; letter-spacing:-.01em; margin-top:-2px; }
.jal-header .wp-block-navigation a { font-weight:600; color:var(--jal-sub); }
.jal-header .wp-block-navigation a:hover { color:var(--jal-green); }

/* ── 홈 히어로 ────────────────────────────────────────── */
.jal-hero { background:linear-gradient(135deg,#E8F7F0 0%,#F4FBF7 55%,#FFF9DB 100%); border-radius:28px; }
.jal-hero h1 { letter-spacing:-.04em; }
.jal-hero .jal-eyebrow { color:var(--jal-green-dark); font-weight:700; }
.jal-chips { display:flex; flex-wrap:wrap; gap:8px; }
.jal-chips a { display:inline-block; padding:9px 16px; border-radius:999px; background:#fff; border:1px solid var(--jal-line);
               color:var(--jal-ink); font-weight:600; font-size:15px; text-decoration:none; }
.jal-chips a:hover { border-color:var(--jal-green); color:var(--jal-green-dark); }

/* ── 카드 목록 ────────────────────────────────────────── */
.jal-section-title { letter-spacing:-.03em; }
.jal-cards .wp-block-post { background:#fff; border:1px solid var(--jal-line); border-radius:20px; overflow:hidden;
                             transition:transform .15s ease, box-shadow .15s ease; }
.jal-cards .wp-block-post:hover { transform:translateY(-3px); box-shadow:0 10px 28px rgba(0,0,0,.07); }
.jal-cards .wp-block-post-featured-image { margin:0; }
.jal-cards .wp-block-post-featured-image img { aspect-ratio:1200/630; object-fit:cover; width:100%; }
.jal-cards .jal-card-body { padding:16px 18px 20px; }
.jal-cards .wp-block-post-title { font-size:18px; line-height:1.4; letter-spacing:-.02em; margin:6px 0 8px; }
.jal-cards .wp-block-post-title a { text-decoration:none; color:var(--jal-ink); }
.jal-cards .wp-block-post-excerpt { color:var(--jal-sub); font-size:14.5px; }
.jal-cards .wp-block-post-excerpt__excerpt { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.jal-cat a, .jal-cat { color:var(--jal-green-dark); font-size:13px; font-weight:700; text-decoration:none; }
.jal-date { color:var(--jal-mute); font-size:13px; }

/* ── 글 본문 ──────────────────────────────────────────── */
.jal-article h2.wp-block-heading { font-size:1.45rem; letter-spacing:-.03em; margin-top:2.4em; padding-top:.2em; scroll-margin-top:84px; }
.jal-article h3.wp-block-heading { font-size:1.12rem; margin-top:1.6em; }
.jal-article p, .jal-article li { line-height:1.85; color:#333D4B; }
.jal-article .wp-block-table table { border-collapse:separate; border-spacing:0; border:1px solid var(--jal-line); border-radius:16px; overflow:hidden; width:100%; }
.jal-article .wp-block-table th, .jal-article .wp-block-table td { border:0; border-bottom:1px solid var(--jal-line); padding:14px 16px; vertical-align:top; text-align:left; font-size:15px; line-height:1.7; }
.jal-article .wp-block-table tr:last-child th, .jal-article .wp-block-table tr:last-child td { border-bottom:0; }
.jal-article .wp-block-table th { background:var(--jal-bg2); width:7.5em; white-space:nowrap; font-weight:700; color:var(--jal-sub); }
.jal-article .wp-block-table figcaption { color:var(--jal-mute); font-size:13px; }
@media (max-width:600px){
  .jal-article .wp-block-table:not(.jal-grid-table) th, .jal-article .wp-block-table:not(.jal-grid-table) td { display:block; width:auto; }
  .jal-article .wp-block-table:not(.jal-grid-table) th { border-bottom:0; padding-bottom:4px; background:transparent; color:var(--jal-green-dark); font-size:13.5px; }
}
/* 가로 표(주택형별 분양가·금리 순위): 칸을 쌓지 않고 좌우로 밀어 본다. */
.jal-article .jal-grid-table { overflow-x:auto; }
.jal-article .jal-grid-table table { min-width:560px; }
.jal-article .jal-grid-table thead th { width:auto; white-space:nowrap; background:var(--jal-green-soft); color:var(--jal-green-dark); }
.jal-article .jal-grid-table td { white-space:nowrap; }
.jal-summary { background:var(--jal-green-soft); border-radius:20px; padding:22px 24px; }
.jal-summary h2.wp-block-heading { margin-top:0 !important; font-size:1.05rem !important; color:var(--jal-green-dark); }
.jal-summary ul { margin:0; padding-left:1.1em; }
.jal-summary li { color:var(--jal-ink) !important; font-weight:600; }
.jal-toc { border:1px solid var(--jal-line); border-radius:16px; padding:16px 22px; }
.jal-toc p { margin:0 0 6px; font-weight:700; color:var(--jal-sub); font-size:14px; }
.jal-toc ol { margin:0; padding-left:1.2em; }
.jal-toc a { color:var(--jal-ink); text-decoration:none; }
.jal-toc a:hover { color:var(--jal-green-dark); text-decoration:underline; }
.jal-cta .wp-block-button__link { background:var(--jal-green); color:#fff; border-radius:14px; font-weight:700; padding:14px 22px; }
.jal-cta .wp-block-button__link:hover { background:var(--jal-green-dark); }
.jal-cta .is-style-outline .wp-block-button__link { background:#fff; color:var(--jal-green-dark); border:1.5px solid var(--jal-green); }
.jalsalgi-official { background:#FFF9DB; border-radius:20px; padding:20px 24px; }
.jalsalgi-official h3 { margin-top:0 !important; }
.jal-faq h3.wp-block-heading { font-size:1.05rem; }
.jal-faq h3.wp-block-heading::before { content:"Q. "; color:var(--jal-green); }

/* ── 하단 ─────────────────────────────────────────────── */
.jal-footer { background:var(--jal-bg2); }
.jal-footer a { color:var(--jal-sub); }

/* ── 주제별 카드(홈) ─────────────────────────────────── */
.jal-topics { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:16px; }
.jal-topics a { display:block; padding:24px; border-radius:20px; background:var(--jal-bg2); text-decoration:none; color:var(--jal-ink); transition:background .15s; }
.jal-topics a:hover { background:var(--jal-green-soft); }
.jal-topics span { font-size:28px; display:block; margin-bottom:10px; }
.jal-topics b { display:block; font-size:18px; font-weight:800; letter-spacing:-.02em; }
.jal-topics em { display:block; font-style:normal; color:var(--jal-sub); font-size:14.5px; margin-top:4px; }

/* 본문 소제목 왼쪽 세로 바(2026-10-04 회장님 요청). 요약 상자 제목은 상자가 이미 구분하므로 뺀다. */
.jal-article h2.wp-block-heading { border-left:5px solid var(--jal-green); padding:2px 0 2px 14px; line-height:1.35; }
.jal-summary h2.wp-block-heading { border-left:0; padding-left:0; }
.jal-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container,
.jal-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content { align-items:flex-start; }
