/* 개굴쌤 블로그 세팅 — 모양(CSS) · GeneratePress 테마용
 * v1.0.1 (2026-10-27): 휴대폰에서 목록·추천 글 카드가 화면 끝에 붙던 것 → 양옆 16px 여백
 * v1.0.0 (2026-10-27): 세팅 표준 CSS v1~v1.4(왓와이 「추가 CSS」와 같은 내용) + v1.5 글 목록 대표 이미지 + 추천 글 3장
 * 블로그마다 「모양 → 사용자 정의하기 → 추가 CSS」에 붙여 넣던 것을 이 파일 하나로 옮겼다.
 */

/* 글 제목 — 굵게, 조금 작게 (2026-10-14) */
h1.entry-title { font-weight: 700; font-size: 32px; line-height: 1.35; letter-spacing: -0.5px; }
@media (max-width: 768px) { h1.entry-title { font-size: 25px; } }
.entry-title a { font-weight: 700; }

/* 사이드바 위젯 제목 — 작게·굵게 (2026-10-14) */
.sidebar .widget h2, .sidebar .widget .wp-block-heading { font-size: 18px; font-weight: 700; margin-bottom: 12px; }
/* 검색 버튼 글자 한 줄로 */
.wp-block-search__button { white-space: nowrap; }
/* 댓글 제목 — 작게·굵게 */
.comment-reply-title, .comments-title { font-size: 20px; font-weight: 700; }
/* 글 아래 카테고리 — 동그란 칩 */
.cat-links .gp-icon { display: none; }
.cat-links a { display: inline-block; padding: 4px 12px; border-radius: 999px; background: #eceff1; color: #37474f; text-decoration: none; font-weight: 600; font-size: 14px; }
.cat-links a:hover { background: #cfd8dc; }
/* 푸터 — 「제작됨 GeneratePress」 숨기기 */
.copyright-bar { font-size: 0; }
.copyright-bar .copyright { font-size: 14px; }

/* ===== 글 목록(첫 화면·카테고리·검색) — 살림여왕처럼 카드 3칸 (2026-10-15) ===== */
.blog .site-main, .archive .site-main, .search .site-main { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.blog .site-main > *:not(article), .archive .site-main > *:not(article), .search .site-main > *:not(article) { grid-column: 1 / -1; }
@media (max-width: 1024px) { .blog .site-main, .archive .site-main, .search .site-main { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .blog .site-main, .archive .site-main, .search .site-main { grid-template-columns: 1fr; } }
.blog .site-main article, .archive .site-main article, .search .site-main article { margin-bottom: 0; }
.blog .inside-article, .archive .inside-article, .search .inside-article { height: 100%; padding: 24px; border: 1px solid #e6e9eb; border-radius: 14px; display: flex; flex-direction: column; gap: 8px; }
.blog .entry-title, .archive .entry-title, .search .entry-title { font-size: 20px; line-height: 1.4; margin: 0; }
.blog .entry-summary, .archive .entry-summary, .search .entry-summary { font-size: 14.5px; line-height: 1.6; color: #546e7a; margin: 0; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.blog .entry-summary p, .archive .entry-summary p, .search .entry-summary p { margin: 0; }
.blog .read-more-container, .archive .read-more-container, .search .read-more-container, .blog .read-more, .archive .read-more { display: none; }
.blog footer.entry-meta, .archive footer.entry-meta, .search footer.entry-meta { order: -1; margin: 0; }
.blog .byline, .archive .byline, .search .byline, .blog .comments-link, .archive .comments-link { display: none; }
.blog .entry-meta, .archive .entry-meta { font-size: 13px; color: #90a4ae; }
/* 카테고리 제목 상자 */
.archive .page-header { padding-bottom: 0; }
.archive .page-title { font-size: 26px; font-weight: 700; }
/* 글 본문 — 가운데 좁게(읽기 편하게) */
.single .site-main { max-width: 780px; margin-left: auto !important; margin-right: auto !important; }

/* ===== 첫 화면 머리(블로그 이름·소개·카테고리 칩) — WPCode PHP 스니펫과 짝 (2026-10-15) ===== */
.ww-hero { text-align: center; padding: 56px 20px 36px; }
.ww-hero-inner { max-width: 760px; margin: 0 auto; }
.ww-hero-title { font-size: 40px; font-weight: 800; letter-spacing: -1px; margin: 0 0 12px; }
.ww-hero-desc { font-size: 17px; color: #546e7a; margin: 0 0 22px; }
.ww-hero-cats { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.ww-hero-cats a { padding: 6px 14px; border: 1px solid #d5dde1; border-radius: 999px; background: #fff; color: #37474f; font-size: 14px; font-weight: 600; text-decoration: none; }
.ww-hero-cats a:hover { background: #eceff1; }
@media (max-width: 640px) { .ww-hero { padding: 36px 16px 24px; } .ww-hero-title { font-size: 30px; } .ww-hero-desc { font-size: 15px; } }
/* 글 화면 — 제목 먼저, 대표 이미지는 그 아래 */
.single .inside-article { display: flex; flex-direction: column; }
.single .inside-article > .entry-header { order: 1; }
.single .inside-article > .featured-image { order: 2; margin: 18px 0 8px; }
.single .inside-article > .entry-content { order: 3; }
.single .inside-article > footer.entry-meta { order: 4; }

/* v1.3 (2026-10-15) 글 끝 운영자 소개 */
.ww-author-box { margin: 40px 0 0; padding: 18px 20px; border: 1px solid #e3e8eb; border-radius: 12px; background: #f7f9fa; font-size: 15px; line-height: 1.75; color: #37474f; }
.ww-author-box p { margin: 0; }
.ww-author-box a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.ww-author-box strong a { text-decoration: none; }

/* v1.4 (2026-10-15) 위 메뉴 = 카테고리 · 푸터 블로그 안내 · 글 위 현재 위치 */
.main-navigation .main-nav ul li a { font-weight: 600; }
.main-navigation .main-nav ul li.current-menu-item > a { color: #e65100; }
.ww-crumbs { font-size: 14px; color: #78909c; margin: 0 0 10px; }
.ww-crumbs a { color: #546e7a; text-decoration: none; }
.ww-crumbs a:hover { text-decoration: underline; }
.ww-crumbs .sep { margin: 0 6px; color: #b0bec5; }
.site-info .inside-site-info { flex-direction: column; gap: 10px; }
.ww-footer-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 18px; font-size: 14px; }
.ww-footer-links a { color: #546e7a; text-decoration: none; }
.ww-footer-links a:hover { text-decoration: underline; color: #37474f; }

/* ===== v1.5 글 목록 카드 맨 위에 대표 이미지 16:9 (10/15 「글자 카드」의 이미지 숨김을 지움) ===== */
/* 추가 CSS에 옛 숨김 줄이 남아 있어도 보이게 조금 더 강한 선택자 */
body.blog .site-main .post-image, body.archive .site-main .post-image, body.search .site-main .post-image { display: block; }
.blog .inside-article, .archive .inside-article, .search .inside-article { overflow: hidden; }
.blog .post-image, .archive .post-image, .search .post-image { order: -2; margin: -24px -24px 6px; }
.blog .post-image img, .archive .post-image img, .search .post-image img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; transition: transform .25s; }
.blog article:hover .post-image img, .archive article:hover .post-image img, .search article:hover .post-image img { transform: scale(1.03); }
/* 대표 이미지가 없는 글 — 같은 크기의 연한 칸(카드 높이 맞춤) */
.blog article:not(.has-post-thumbnail) .inside-article::before, .archive article:not(.has-post-thumbnail) .inside-article::before, .search article:not(.has-post-thumbnail) .inside-article::before { content: ""; display: block; order: -2; margin: -24px -24px 6px; aspect-ratio: 16 / 9; background: #fff3e0; }

/* ===== 추천 글 3장 (첫 화면 1쪽 · 고정 글 먼저, 모자라면 최신 글) ===== */
.gbs-picks { grid-column: 1 / -1; margin: 0 0 16px; }
.gbs-picks-title { font-size: 20px; font-weight: 700; margin: 0 0 14px; }
.gbs-picks-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
@media (max-width: 1024px) { .gbs-picks-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .gbs-picks-grid { grid-template-columns: 1fr; } }
.gbs-pick { display: flex; flex-direction: column; border: 1px solid #e6e9eb; border-radius: 14px; overflow: hidden; background: #fff; }
.gbs-pick-img { position: relative; display: block; }
.gbs-pick-img img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; transition: transform .25s; }
.gbs-pick:hover .gbs-pick-img img { transform: scale(1.03); }
.gbs-pick-img.is-empty { aspect-ratio: 16 / 9; background: #fff3e0; }
.gbs-pick-no { position: absolute; top: 12px; left: 12px; z-index: 1; width: 30px; height: 30px; border-radius: 50%; background: #e65100; color: #fff; font-size: 15px; font-weight: 800; line-height: 30px; text-align: center; box-shadow: 0 2px 6px rgba(0, 0, 0, .2); }
.gbs-pick-body { display: flex; flex-direction: column; gap: 8px; padding: 16px 24px 20px; }
.gbs-pick-cat a { display: inline-block; padding: 4px 12px; border-radius: 999px; background: #eceff1; color: #37474f; text-decoration: none; font-weight: 600; font-size: 14px; }
.gbs-pick-cat a:hover { background: #cfd8dc; }
.gbs-pick-title { font-size: 20px; line-height: 1.4; margin: 0; font-weight: 700; }
.gbs-pick-title a { color: inherit; text-decoration: none; }
.gbs-pick time { font-size: 13px; color: #90a4ae; }

/* ===== v1.0.1 휴대폰: 목록·추천 글 카드가 화면 끝에 붙지 않게 양옆 여백 ===== */
@media (max-width: 768px) { .blog .site-main, .archive .site-main, .search .site-main { padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)); } }
