/*
Theme Name: Luru Magazine
Template: twentytwentyfive
Description: 루즈루틴 매거진 — 에디토리얼 미니멀 (warm monochrome + muted green accent)
Version: 1.0
*/

:root {
  --luru-bg: #fdf9f5;
  --luru-ink: #2f3437;
  --luru-muted: #787774;
  --luru-faint: #b5b0aa;
  --luru-line: #eae5df;
  --luru-green: #7abb7a;
  --luru-green-pale: #edf3ec;
  --luru-green-ink: #346538;
  /* 2026-06-06 사용자 요청: 제목도 산세리프로 통일 (세리프 폐기) */
  --luru-serif: "Noto Sans KR", "Helvetica Neue", sans-serif;
  --luru-sans: "Noto Sans KR", "Helvetica Neue", sans-serif;
}

/* ── 캔버스 & 본문 타이포 ───────────────────────────── */
body {
  background: var(--luru-bg) !important;
  color: var(--luru-ink);
  font-family: var(--luru-sans) !important;
  font-weight: 400;
  line-height: 1.75;
  -webkit-font-smoothing: antialiased;
}

.wp-site-blocks { padding-top: 0; }

/* 본문 컨테이너 폭 — 에디토리얼 가독폭 */
.entry-content > * { max-width: 42rem; margin-left: auto; margin-right: auto; }
.entry-content { font-size: 1.0625rem; }
.entry-content p { margin-block: 1.5em; color: var(--luru-ink); }

/* ── 제목: 세리프 에디토리얼 ───────────────────────── */
h1, h2, h3, h4,
.wp-block-post-title,
.wp-block-site-title {
  font-family: var(--luru-serif) !important;
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 1.25;
  color: #1f2326;
}

.wp-block-post-title { font-size: clamp(1.9rem, 4.5vw, 2.7rem) !important; }

.entry-content h2 {
  font-size: 1.45rem;
  margin-top: 3em;
  padding-top: 1.6em;
  border-top: 1px solid var(--luru-line);
}
.entry-content h3 { font-size: 1.15rem; margin-top: 2.2em; }

/* ── 사이트 헤더: 센터 로고타입 ────────────────────── */
.wp-block-site-title a {
  text-decoration: none;
  letter-spacing: 0.01em;
}
header.wp-block-template-part {
  border-bottom: 1px solid var(--luru-line);
}

/* ── 메타(날짜·카테고리): 작게, 트래킹 넓게 ───────── */
.wp-block-post-date, .wp-block-post-author-name, .wp-block-post-author {
  font-size: 0.72rem !important;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--luru-faint) !important;
}
.wp-block-post-terms a {
  font-size: 0.7rem;
  letter-spacing: 0.06em;
  background: var(--luru-green-pale);
  color: var(--luru-green-ink) !important;
  border-radius: 9999px;
  padding: 0.25em 0.9em;
  text-decoration: none !important;
}

/* ── 글 목록: 카드 제거, 헤어라인 구분 ─────────────── */
.wp-block-post-template { gap: 0 !important; }
.wp-block-post-template > li,
.wp-block-post-template .wp-block-post {
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid var(--luru-line) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 2.4rem 0 !important;
}
.wp-block-post-template .wp-block-post-title { font-size: 1.5rem !important; }
.wp-block-post-template .wp-block-post-title a { text-decoration: none; }
.wp-block-post-template .wp-block-post-title a:hover { color: var(--luru-green-ink); }
.wp-block-post-excerpt__excerpt { color: var(--luru-muted); font-size: 0.95rem; }

/* ── 링크 & 인용 ───────────────────────────────────── */
.entry-content a {
  color: var(--luru-ink);
  text-decoration: underline;
  text-decoration-color: var(--luru-green);
  text-underline-offset: 3px;
}
.entry-content a:hover { color: var(--luru-green-ink); }
blockquote {
  font-family: var(--luru-serif);
  border-left: 2px solid var(--luru-green) !important;
  color: var(--luru-muted);
  background: transparent !important;
}

/* ── 이미지 ────────────────────────────────────────── */
.entry-content img { border-radius: 6px; }
figcaption { color: var(--luru-faint); font-size: 0.8rem; }

/* ── CTA 블록 (wp_publisher가 삽입) ────────────────── */
.luru-cta-divider {
  border: 0;
  border-top: 1px solid var(--luru-line);
  margin: 3.5em auto 0;
  max-width: 42rem;
}
.luru-cta a {
  border-radius: 5px;
  font-size: 0.95rem;
  transition: background 0.2s, transform 0.15s;
}
.luru-cta a:hover { background: #333 !important; }
.luru-cta a:active { transform: scale(0.98); }

/* ── 버튼·검색 등 공통 플랫화 ──────────────────────── */
.wp-block-button__link, button, input[type="submit"] {
  border-radius: 5px !important;
  box-shadow: none !important;
}
.wp-block-search__input {
  border: 1px solid var(--luru-line) !important;
  border-radius: 5px !important;
  background: #fff;
}

/* ── 푸터 ──────────────────────────────────────────── */
footer.wp-block-template-part {
  border-top: 1px solid var(--luru-line);
  color: var(--luru-faint);
  font-size: 0.8rem;
}

/* ── 페이지네이션 ──────────────────────────────────── */
.wp-block-query-pagination a { text-decoration: none; color: var(--luru-muted); }
.wp-block-query-pagination a:hover { color: var(--luru-green-ink); }

/* ── 스크롤 등장 모션 (JS가 .luru-reveal 부여) ─────── */
@media (prefers-reduced-motion: no-preference) {
  .luru-reveal {
    opacity: 0;
    transform: translateY(12px);
    transition: opacity 0.6s cubic-bezier(0.16, 1, 0.3, 1),
                transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .luru-reveal.is-visible { opacity: 1; transform: none; }
}

/* ── 헤더: 검색 + 카테고리 네비 (2026-06-06) ─────────── */
.luru-search { max-width: 220px; }
.luru-search .wp-block-search__input {
  font-size: 0.85rem; padding: 0.45em 0.9em;
}
.luru-cat-nav { border-bottom: 1px solid var(--luru-line); }
.luru-cat-nav ul.wp-block-categories {
  list-style: none; display: flex; flex-wrap: wrap; gap: 0.4rem 1.6rem;
  padding: 0; margin: 0; justify-content: center;
}
.luru-cat-nav ul.wp-block-categories a {
  font-size: 0.82rem; letter-spacing: 0.05em; text-decoration: none;
  color: var(--luru-muted);
}
.luru-cat-nav ul.wp-block-categories a:hover { color: var(--luru-green-ink); }

/* ── 홈 목록 썸네일 ──────────────────────────────────── */
.wp-block-post-template .wp-block-post-featured-image {
  margin-bottom: 1.1rem;
}
.wp-block-post-template .wp-block-post-featured-image img { border-radius: 8px; }

/* ── 인기 글 (조회수 상위) ───────────────────────────── */
.luru-popular { margin-bottom: 3rem; padding-bottom: 2.4rem; border-bottom: 1px solid var(--luru-line); }
.luru-popular-label {
  font-size: 0.75rem; letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--luru-faint); margin: 0 0 1.1rem;
}
.luru-popular-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.2rem; }
@media (max-width: 700px) { .luru-popular-grid { grid-template-columns: repeat(2, 1fr); } }
.luru-popular-item { display: flex; flex-direction: column; text-decoration: none; }
.luru-popular-thumb {
  width: 100%; aspect-ratio: 4/3; object-fit: cover; border-radius: 6px; margin-bottom: 0.6rem;
}
.luru-popular-rank {
  font-family: var(--luru-serif); font-size: 0.8rem; color: var(--luru-green-ink);
}
.luru-popular-title {
  font-family: var(--luru-serif); font-size: 0.92rem; line-height: 1.4; color: var(--luru-ink);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.luru-popular-item:hover .luru-popular-title { color: var(--luru-green-ink); }
.luru-popular-views { font-size: 0.72rem; color: var(--luru-faint); margin-top: 0.3rem; }

/* ════════════════════════════════════════════════════════
   홈 레이아웃 재설계 (2026-06-06) — 히어로 + 잡지식 리스트
   ════════════════════════════════════════════════════════ */

.luru-home .wp-block-post-template {
  gap: 0 !important; list-style: none; margin: 0; padding: 0;
}
.luru-home .wp-block-post-template > li {
  background: transparent !important; border: 0 !important; border-radius: 0 !important;
  box-shadow: none !important; padding: 0 !important; margin: 0 !important;
}

/* ── 히어로 (최신 1편) ──────────────────────────────── */
.luru-hero-query { margin-bottom: 0; }
.luru-hero {
  display: grid; grid-template-columns: 1.1fr 1fr; gap: 2.6rem; align-items: center;
  padding-bottom: 3rem; margin-bottom: 2.6rem; border-bottom: 1px solid var(--luru-line);
}
.luru-hero-media { margin: 0 !important; }
.luru-hero-media img {
  width: 100%; aspect-ratio: 16 / 10; object-fit: cover; border-radius: 10px; display: block;
}
.luru-hero:not(:has(.luru-hero-media img)) { grid-template-columns: 1fr; max-width: 46rem; }
.luru-hero-body { display: flex; flex-direction: column; gap: 0.55rem; }

.luru-eyebrow { display: flex; align-items: center; gap: 0.7rem; margin: 0 0 0.2rem; }
.luru-eyebrow-label {
  font-family: var(--luru-sans); font-size: 0.7rem; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--luru-green-ink); margin: 0;
}
.luru-hero .wp-block-post-terms { margin: 0; }

.luru-hero-title.wp-block-post-title {
  font-size: clamp(1.7rem, 3.2vw, 2.4rem) !important; line-height: 1.22; margin: 0;
}
.luru-hero-title a { text-decoration: none; color: #1f2326; }
.luru-hero-title a:hover { color: var(--luru-green-ink); }

.luru-hero .wp-block-post-excerpt__excerpt {
  color: var(--luru-muted); font-size: 0.98rem; line-height: 1.7; margin: 0.3rem 0 0;
}
.luru-hero .wp-block-post-excerpt__more-link { color: var(--luru-green-ink); text-decoration: none; font-size: 0.9rem; }
.luru-hero .wp-block-post-date { margin-top: 0.4rem; }

/* ── 리스트 (텍스트 좌 + 소형 썸네일 우) ─────────────── */
.luru-list-query { margin: 0; }
.luru-row {
  display: grid; grid-template-columns: 1fr 132px; gap: 1.8rem; align-items: start;
  padding: 1.9rem 0; border-bottom: 1px solid var(--luru-line);
}
.luru-row:first-of-type { padding-top: 0; }
.luru-row-text { display: flex; flex-direction: column; gap: 0.45rem; min-width: 0; }
.luru-row .wp-block-post-terms { margin: 0; }

.luru-row-title.wp-block-post-title { font-size: 1.35rem !important; line-height: 1.3; margin: 0; }
.luru-row-title a { text-decoration: none; color: #1f2326; }
.luru-row-title a:hover { color: var(--luru-green-ink); }

.luru-row .wp-block-post-excerpt { margin: 0; }
.luru-row .wp-block-post-excerpt__excerpt {
  color: var(--luru-muted); font-size: 0.92rem; line-height: 1.65;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.luru-row .wp-block-post-excerpt__more-link { display: none; }
.luru-row .wp-block-post-date { margin-top: 0.1rem; }

.luru-row-media { margin: 0 !important; align-self: start; }
.luru-row-media img {
  width: 132px; aspect-ratio: 1 / 1; object-fit: cover; border-radius: 8px; display: block;
}
.luru-row:not(:has(.luru-row-media img)) { grid-template-columns: 1fr; }

.luru-pagination { margin-top: 2.6rem; }

/* ── 인기 글: 홈 하단으로 ──────────────────────────── */
.luru-home .luru-popular {
  margin-top: 3.4rem; margin-bottom: 0; padding-top: 2.6rem; padding-bottom: 0;
  border-top: 1px solid var(--luru-line); border-bottom: 0;
}

/* ── 헤더 네비 줄: 좌 카테고리 / 우 검색 ─────────────── */
.luru-nav-row { border-bottom: 1px solid var(--luru-line); gap: 1rem 1.4rem; }
.luru-nav-row .luru-cat-nav { border-bottom: 0; }
.luru-nav-row .luru-cat-nav ul.wp-block-categories { justify-content: flex-start; }
.luru-brand-row { padding-bottom: 0.2rem; }

/* ── 반응형 ─────────────────────────────────────────── */
@media (max-width: 860px) {
  .luru-hero { grid-template-columns: 1fr; gap: 1.2rem; padding-bottom: 2.2rem; margin-bottom: 2rem; }
  .luru-hero-media img { aspect-ratio: 16 / 9; }
  .luru-hero-title.wp-block-post-title { font-size: clamp(1.5rem, 6vw, 1.9rem) !important; }
  .luru-row { grid-template-columns: 1fr 92px; gap: 1rem; padding: 1.4rem 0; }
  .luru-row-title.wp-block-post-title { font-size: 1.12rem !important; }
  .luru-row .wp-block-post-excerpt__excerpt { font-size: 0.88rem; }
  .luru-row-media img { width: 92px; }
}
@media (max-width: 560px) {
  .luru-row .wp-block-post-excerpt { display: none; }
  .luru-row-media img { width: 80px; }
  .luru-row { gap: 0.9rem; }
  .luru-nav-row { flex-direction: column; align-items: stretch; }
  .luru-nav-row .luru-cat-nav ul.wp-block-categories { justify-content: center; }
  .luru-search { max-width: 100%; }
}
