/*
Theme Name:   Ganeum (GeneratePress Child)
Theme URI:    https://example.com
Description:  가늠 리뷰 블로그용 GeneratePress 차일드 테마. 시안(가늠 목업)과 동일한 마크업/토큰을 사용해
              Additional CSS 땜빵 없이 1:1 재현하는 것을 목표로 한다.
Author:       review-blog-automation
Template:     generatepress
Version:      0.1.10
Text Domain:  ganeum
*/

/* =========================================================
   0) 폰트 자체 호스팅 (self-hosted, Google Fonts CDN 링크 대신)
   ========================================================= */
@font-face{
  font-family:"Pretendard Variable";
  font-weight:45 920;
  font-style:normal;
  font-display:swap;
  src:url("assets/fonts/PretendardVariable.woff2") format("woff2-variations");
}
@font-face{
  font-family:"Unbounded";
  font-weight:700;
  font-style:normal;
  font-display:swap;
  src:url("assets/fonts/Unbounded-700.woff2") format("woff2");
}
@font-face{
  font-family:"JetBrains Mono";
  font-weight:400;
  font-style:normal;
  font-display:swap;
  src:url("assets/fonts/JetBrainsMono-400.woff2") format("woff2");
}
@font-face{
  font-family:"JetBrains Mono";
  font-weight:500;
  font-style:normal;
  font-display:swap;
  src:url("assets/fonts/JetBrainsMono-500.woff2") format("woff2");
}
@font-face{
  font-family:"JetBrains Mono";
  font-weight:600;
  font-style:normal;
  font-display:swap;
  src:url("assets/fonts/JetBrainsMono-600.woff2") format("woff2");
}

/* =========================================================
   1) 디자인 토큰 — 시안(가늠 목업) 값과 동일. 여기만 보고 바꾼다.
   ========================================================= */
:root{
  --paper:#F2F5F7; --surface:#FFFFFF; --surface-2:#EAEEF1;
  --ink:#12151A; --ink-2:#1C2027; --on-ink:#F2F5F7; --on-ink-muted:#9AA2AC;
  --muted:#626B76; --muted-2:#8A929C; --line:#DEE3E8;
  --signal:#E8431F; --signal-ink:#FFFFFF;
  --cat-product:#2F5FDB; --cat-food:#B8791E; --cat-place:#0E8E77; --cat-diary:#8A4FD6;
  --page-max:1180px; --page-gutter:clamp(20px,4vw,40px);
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --paper:#0E1013; --surface:#16191D; --surface-2:#1D2126;
    --ink:#08090B; --ink-2:#000000; --on-ink:#EDEFF2; --on-ink-muted:#8A929C;
    --muted:#98A0A9; --muted-2:#6E767F; --line:#282D33;
    --signal:#FF5A34; --signal-ink:#12151A;
    --cat-product:#7B9BFF; --cat-food:#E0AC55; --cat-place:#4FCBB0; --cat-diary:#B58CF0;
  }
}
:root[data-theme="dark"]{
  --paper:#0E1013; --surface:#16191D; --surface-2:#1D2126;
  --ink:#08090B; --ink-2:#000000; --on-ink:#EDEFF2; --on-ink-muted:#8A929C;
  --muted:#98A0A9; --muted-2:#6E767F; --line:#282D33;
  --signal:#FF5A34; --signal-ink:#12151A;
  --cat-product:#7B9BFF; --cat-food:#E0AC55; --cat-place:#4FCBB0; --cat-diary:#B58CF0;
}

/* =========================================================
   2) 전역
   ========================================================= */
*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:"Pretendard Variable","Noto Sans KR",-apple-system,"Apple SD Gothic Neo",sans-serif;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
::selection{ background:var(--signal); color:var(--signal-ink); }
:focus-visible{ outline:2px solid var(--signal); outline-offset:3px; border-radius:2px; }
img{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
.mono{ font-family:"JetBrains Mono",ui-monospace,Menlo,monospace; font-variant-numeric:tabular-nums; }

/* GeneratePress 기본 컨테이너 폭 해제 — COPPER에서도 겪은 문제(구버전 960px 규칙 잠복) */
.site.grid-container.container{ max-width:none!important; }
.wrap{ max-width:var(--page-max); margin:0 auto; padding:0 var(--page-gutter); }

@media (prefers-reduced-motion:reduce){
  *{ animation-duration:.001ms!important; transition-duration:.001ms!important; scroll-behavior:auto!important; }
}

/* =========================================================
   3) 헤더/내비 — GP의 실제 마크업을 재사용(REST/모바일메뉴/접근성 그대로),
      시각만 잉크블랙 바 + 알약형 현재-탭으로 재도장.
   ========================================================= */
.site-header{ background:var(--ink); border-bottom:1px solid var(--ink-2); }
.main-navigation{ background:var(--ink)!important; }
.site-header .inside-header,
.main-navigation .inside-navigation{
  max-width:var(--page-max)!important; margin:0 auto!important;
  padding-left:var(--page-gutter)!important; padding-right:var(--page-gutter)!important;
}
.site-header .inside-header{ padding-top:14px!important; padding-bottom:14px!important; min-height:0!important; }
.inside-header.grid-container{ grid-template-columns:fit-content(10px) 1fr!important; }

/* 실측 발견(2026-09-01): 이 사이트는 Customizer에 로고 이미지가 없어 GP가 .site-logo가 아니라
   .site-branding > h1.main-title > a 로 텍스트 사이트제목("My Blog")을 렌더한다. 게다가 GP의
   generate-style-inline-css 동적 스타일이 이 CSS 파일보다 뒤에 출력돼 !important 없이는
   덮어써진다(COPPER 차일드 테마에서도 겪은 문제, 03 README 참고) — 전부 !important로 확정. */
.site-logo img{ display:none!important; }
.site-branding .main-title{ margin:0!important; }
.site-branding .main-title a,
.site-logo a{
  display:inline-flex!important; align-items:baseline; gap:2px;
  font-family:"Unbounded",sans-serif!important; font-weight:700!important; font-size:0!important;
  letter-spacing:-.01em; min-height:0; text-decoration:none!important;
}
.site-branding .main-title a::before,
.site-logo a::before{ content:"가늠"; font-size:19px; color:var(--on-ink)!important; }
.site-branding .main-title a::after,
.site-logo a::after{ content:"."; font-size:19px; color:var(--signal)!important; }

.main-navigation .main-nav ul{ gap:6px!important; }
.main-navigation .main-nav ul li a{
  padding:8px 14px!important; border-radius:999px; font-size:14px; font-weight:600;
  color:var(--on-ink-muted)!important; background:none!important; border-bottom:none!important;
  transition:color .15s ease, background .15s ease;
}
.main-navigation .main-nav ul li a:hover{ color:var(--on-ink)!important; }
.main-navigation .main-nav ul li[class*="current"]>a{
  color:var(--signal-ink)!important; background:var(--signal)!important; font-weight:700;
}
.menu-bar-item a[aria-label="검색 열기"]{
  display:inline-flex!important; align-items:center; justify-content:center;
  width:36px; height:36px; border:1px solid rgba(255,255,255,.14); border-radius:8px;
  background:transparent; color:var(--on-ink-muted)!important; margin-left:10px;
}
.menu-bar-item a[aria-label="검색 열기"]:hover{ border-color:rgba(255,255,255,.4); color:var(--on-ink)!important; }

/* =========================================================
   4) 히어로 — front-page.php가 직접 출력하는 마크업 전용 CSS
   ========================================================= */
.hero{ padding:56px 0 0; }
.hero-top{ display:grid; grid-template-columns:1.5fr 1fr; gap:56px; align-items:start; padding-bottom:44px; }
.hero h1{
  font-family:"Pretendard Variable",sans-serif; font-weight:800; letter-spacing:-.015em;
  font-size:clamp(30px,4vw,46px); line-height:1.2; margin:0 0 18px; text-wrap:balance;
}
.hero p{ font-size:16px; line-height:1.7; color:var(--muted); max-width:46ch; margin:0 0 26px; }
.hero .cta{
  display:inline-flex; align-items:center; gap:8px; padding:13px 22px; border-radius:999px;
  background:var(--ink); color:var(--on-ink); font-weight:700; font-size:14.5px; border:1px solid var(--ink);
  transition:transform .15s ease, opacity .15s ease;
}
.hero .cta:hover{ opacity:.86; }
.hero .cta:active{ transform:translateY(1px) scale(.98); }
.hero .cta svg{ width:15px; height:15px; }

.gauge{ border:1px solid var(--line); border-radius:10px; background:var(--surface); padding:22px 24px; }
.gauge-label{ font-size:12.5px; color:var(--muted-2); margin-bottom:10px; }
.gauge-value{ font-family:"JetBrains Mono",monospace; font-weight:600; font-size:44px; line-height:1; color:var(--ink); }
.gauge-value span{ font-size:18px; color:var(--muted-2); font-weight:500; }
.gauge-scale{ position:relative; height:4px; border-radius:2px; background:var(--surface-2); margin:18px 0 8px; }
.gauge-fill{ position:absolute; inset:0; border-radius:2px; background:var(--signal); }
.gauge-marker{ position:absolute; top:50%; transform:translate(-50%,-50%); width:10px; height:10px; border-radius:50%; background:var(--ink); border:2px solid var(--surface); }
.gauge-foot{ display:flex; justify-content:space-between; font-family:"JetBrains Mono",monospace; font-size:11px; color:var(--muted-2); }
.gauge-empty{ font-size:13px; color:var(--muted-2); }

.hero-strip{ width:100%; aspect-ratio:21/6; overflow:hidden; border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:var(--surface-2); }
.hero-strip img{ width:100%; height:100%; object-fit:cover; }

@media (max-width:860px){
  .hero-top{ grid-template-columns:1fr; gap:28px; }
  .hero-strip{ aspect-ratio:16/10; }
}

/* =========================================================
   5) 벤토 인덱스
   ========================================================= */
.bento-section{ padding:52px 0 56px; }
.bento-head{ margin:0 0 24px; }
.bento-head h2{ font-family:"Pretendard Variable",sans-serif; font-weight:800; font-size:clamp(22px,2.6vw,27px); letter-spacing:-.01em; margin:0; text-wrap:balance; }

.bento{
  display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:170px; gap:16px;
  grid-template-areas:"feat feat w1 w1" "feat feat w2 w2" "s1 s2 s3 s4";
}
.b-feat{ grid-area:feat; } .b-w1{ grid-area:w1; } .b-w2{ grid-area:w2; }
.b-s1{ grid-area:s1; } .b-s2{ grid-area:s2; } .b-s3{ grid-area:s3; } .b-s4{ grid-area:s4; }

.tile{
  position:relative; border-radius:10px; overflow:hidden; border:1px solid var(--line);
  background:var(--surface); display:flex; flex-direction:column;
  opacity:0; transform:translateY(14px);
  transition:opacity .5s cubic-bezier(.16,1,.3,1), transform .5s cubic-bezier(.16,1,.3,1);
}
.tile.is-visible{ opacity:1; transform:translateY(0); }
.no-js .tile{ opacity:1; transform:none; }
.tile-figure{ position:relative; flex:1; overflow:hidden; background:var(--surface-2); }
.tile-figure img{ width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.tile:hover .tile-figure img{ transform:scale(1.04); }
.tile-score{ position:absolute; top:10px; right:10px; font-family:"JetBrains Mono",monospace; font-weight:600; font-size:12.5px; padding:4px 8px; border-radius:6px; background:var(--ink); color:var(--on-ink); }
.tile-body{ padding:14px 16px 16px; }
.tile-tag{ font-family:"JetBrains Mono",monospace; font-size:11px; font-weight:600; display:block; margin-bottom:6px; }
.tile-tag.product{ color:var(--cat-product); } .tile-tag.food{ color:var(--cat-food); } .tile-tag.place{ color:var(--cat-place); } .tile-tag.diary{ color:var(--cat-diary); }
.tile-title{ font-size:14.5px; font-weight:700; line-height:1.4; margin:0; transition:color .15s ease; }
.tile:hover .tile-title{ color:var(--signal); }
.b-feat .tile-title{ font-size:19px; }
.b-feat .tile-body{ padding:18px 20px 20px; }

@media (max-width:860px){
  .bento{ grid-template-columns:1fr; grid-auto-rows:auto; grid-template-areas:"feat" "w1" "w2" "s1" "s2" "s3" "s4"; }
  .tile-figure{ aspect-ratio:16/10; }
}

/* =========================================================
   6) 맞대결 비교
   ========================================================= */
.compare{ padding:8px 0 56px; }
.compare-card{ border:1px solid var(--line); border-radius:10px; background:var(--surface); padding:26px 28px; }
.compare-head{ display:flex; align-items:baseline; justify-content:space-between; margin-bottom:20px; gap:16px; flex-wrap:wrap; }
.compare-head h2{ font-family:"Pretendard Variable",sans-serif; font-weight:800; font-size:clamp(20px,2.4vw,24px); letter-spacing:-.01em; margin:0; }
.compare-head span{ font-family:"JetBrains Mono",monospace; font-size:12px; color:var(--muted-2); }
.compare-cols{ display:grid; grid-template-columns:1fr auto 1fr; gap:0 22px; }
.compare-side h3{ font-size:15.5px; font-weight:700; margin:0 0 14px; }
.compare-side.right{ text-align:right; }
.compare-row{ display:flex; justify-content:space-between; gap:10px; padding:11px 0; border-top:1px solid var(--line); font-size:14px; }
.compare-side.right .compare-row{ flex-direction:row-reverse; }
.compare-row .k{ color:var(--muted); }
.compare-row .v{ font-family:"JetBrains Mono",monospace; font-weight:600; }
.compare-row .v.win{ color:var(--signal); }
.compare-mid{ display:flex; align-items:center; justify-content:center; font-family:"JetBrains Mono",monospace; font-size:12px; color:var(--muted-2); padding:0 4px; }
@media (max-width:640px){
  .compare-cols{ grid-template-columns:1fr; gap:18px; }
  .compare-mid{ display:none; }
  .compare-side.right{ text-align:left; }
  .compare-side.right .compare-row{ flex-direction:row; }
}

/* =========================================================
   7) 소개 밴드 + 푸터(잉크로 헤더와 대칭)
   ========================================================= */
.purpose{ padding:44px 0; border-top:1px solid var(--line); }
.purpose-inner{ display:flex; align-items:center; justify-content:space-between; gap:28px; flex-wrap:wrap; }
.purpose p{ font-family:"Pretendard Variable",sans-serif; font-weight:700; font-size:clamp(18px,2vw,22px); line-height:1.4; margin:0; max-width:42ch; letter-spacing:-.005em; }
.purpose-link{ display:inline-flex; align-items:center; gap:6px; font-size:14px; font-weight:600; color:var(--ink); border-bottom:1px solid var(--ink); padding-bottom:2px; white-space:nowrap; }

/* 실측 발견(2026-09-01): 이 사이트는 "Footer Widget 1" 위젯 영역이 비어 있어 GP가
   .footer-widgets 없이 .site-footer > footer.site-info(저작권 줄)만 렌더한다.
   COPPER 차일드 테마 CSS를 그대로 옮기며 ".site-info{display:none}"을 남겼던 게
   여기서는 정반대로 저작권 줄 자체를 지워버리는 버그였다 — 삭제하고 실제 DOM에 맞춘다.
   운영자가 나중에 외모 ▸ 위젯에서 "Footer Widget 1"에 내비게이션 메뉴 위젯을 추가하면
   아래 footer-widget-1 규칙이 그대로 적용된다(지금은 위젯이 없어 미사용 상태). */
.site-footer{ background:var(--ink)!important; border-top:none; }
.site-footer .inside-site-footer,
.site-footer .inside-site-info{
  padding-top:36px!important; padding-bottom:40px!important;
  max-width:var(--page-max)!important; margin:0 auto!important;
  padding-left:var(--page-gutter)!important; padding-right:var(--page-gutter)!important;
}
.site-footer,
.site-footer .site-info,
.site-footer .copyright-bar,
.site-footer a{ color:var(--on-ink-muted)!important; font-size:13px!important; }
.site-footer a:hover{ color:var(--on-ink)!important; }
.footer-widget-1 aside.widget_nav_menu ul,.footer-widget-1 .widget_nav_menu ul{
  display:flex!important; flex-wrap:wrap; gap:20px; list-style:none; margin:0!important; padding:0!important;
}
.footer-widget-1 aside.widget_nav_menu a,.footer-widget-1 .widget_nav_menu a{ font-size:13px!important; color:var(--on-ink-muted)!important; }
.footer-widget-1 aside.widget_nav_menu a:hover,.footer-widget-1 .widget_nav_menu a:hover{ color:var(--on-ink)!important; }

/* =========================================================
   8) 글 상세(single) — GP 기본 루프 재사용 + 재도장.
      front-page.php와 달리 여기는 커스텀 템플릿을 안 둔다: entry-content는
      워드프레스가 만든 임의의 HTML(표·인용·코드 등)이라 구조를 직접 찍을 수 없다.
      대신 실제 GP 마크업(.content-area/.entry-content/.entry-title 등)을 그대로 쓰고
      상단 메타행만 훅으로 끼워 넣는다(functions.php의 ganeum_single_meta_row).
   ========================================================= */
.single .content-area{ width:100%!important; max-width:none!important; float:none!important; }
.single .widget-area{ display:none!important; }
.single .site-content,
.single .site-content > .container.grid-container{
  max-width:var(--page-max)!important; margin:0 auto!important;
  padding-left:var(--page-gutter)!important; padding-right:var(--page-gutter)!important;
  padding-top:36px!important;
}
.single .inside-article{ background:transparent; border:none; box-shadow:none; padding:0; }

/* GP 기본 상단 대형 featured 이미지는 숨긴다 — 같은 사진이 본문 첫 이미지로도 나와 중복이다
   (03 문서: 첫 이미지는 "3줄 요약 직후"에 배치되도록 이미 설계됨). featured_media 자체는
   OG 썸네일·벤토그리드용으로 계속 쓰인다, 단지 이 페이지에서 다시 안 보일 뿐. */
.single.featured-image-active .featured-image{ display:none!important; }

/* 우리 훅이 넣는 breadcrumb+카테고리+평점 행 — GP 기본 entry-meta(날짜·작성자)는 대체돼서 숨김 */
.single .entry-meta{ display:none!important; }
.single .entry-header{ max-width:var(--post-max-width,760px); margin:0 auto; padding:0!important; }

.ganeum-breadcrumb{
  display:flex; align-items:center; gap:8px; margin:0 0 18px;
  font-size:13px; color:var(--muted-2);
}
.ganeum-breadcrumb a{ color:var(--muted-2); }
.ganeum-breadcrumb a:hover{ color:var(--ink); }

.ganeum-single-meta{ display:flex; align-items:center; gap:14px; margin:0 0 16px; }
.ganeum-single-rating{ font-size:13px; font-weight:600; color:var(--signal); }
.ganeum-single-date{ font-size:12.5px; color:var(--muted-2); }

.single .entry-title{
  font-family:"Pretendard Variable",sans-serif!important; font-weight:800!important;
  letter-spacing:-.015em!important; font-size:clamp(26px,3.6vw,40px)!important;
  line-height:1.25!important; margin:0 0 28px!important; color:var(--ink)!important;
}

.single .entry-content{
  max-width:var(--post-max-width,760px); margin:0 auto;
  font-family:"Pretendard Variable","Noto Sans KR",sans-serif!important;
  font-size:16px!important; line-height:1.85!important; color:var(--ink)!important;
  word-break:keep-all; overflow-wrap:anywhere;
}
.single .entry-content > p:first-of-type{ font-size:1.02rem; }
.single .entry-content h1,.single .entry-content h2,.single .entry-content h3,.single .entry-content h4{
  font-family:"Pretendard Variable",sans-serif!important; font-weight:800!important;
  color:var(--ink)!important; line-height:1.35!important; margin-top:1.9em!important; margin-bottom:.5em!important;
  letter-spacing:-.01em;
}
.single .entry-content h1{ font-size:1.7rem!important; }
.single .entry-content h2{ font-size:1.4rem!important; }
.single .entry-content h3{ font-size:1.2rem!important; }
.single .entry-content h4{ font-size:1.05rem!important; }

.single .entry-content img,.single .entry-content figure{ border-radius:6px; }
.single .entry-content img{ display:block; width:100%; height:auto; }
.single .entry-content figure{ margin:22px 0; }
.single .entry-content figure > figcaption{ margin-top:8px; font-size:.85rem; color:var(--muted-2); text-align:center; }

.single .entry-content table{ width:100%; border-collapse:collapse; margin:26px 0; font-size:14.5px; }
.single .entry-content th,.single .entry-content td{ padding:12px 14px; text-align:left; border-bottom:1px solid var(--line); }
.single .entry-content thead th{ font-weight:700; border-bottom:2px solid var(--ink); }

.single .entry-content blockquote{
  margin:28px 0; padding:2px 0 2px 20px; border-left:3px solid var(--signal); border-radius:0;
  font-size:1.1em; line-height:1.6; color:var(--ink); background:none;
}

.single .entry-content pre,.single .entry-content code{ font-family:"JetBrains Mono",ui-monospace,Menlo,monospace; }
.single .entry-content pre{ margin:14px 0; padding:14px 16px; border-radius:6px; background:var(--ink); color:var(--paper); overflow:auto; }
.single .entry-content code{ background:var(--surface-2); border:1px solid var(--line); padding:2px 6px; border-radius:4px; font-size:.9em; }

.single .entry-content a{ color:var(--signal); text-decoration:underline; text-decoration-color:var(--line); }
.single .entry-content a:hover{ text-decoration-color:var(--signal); }

.single .entry-content ul,.single .entry-content ol{ margin:0 0 16px 20px; }
.single .entry-content li{ margin:6px 0; }
.single .entry-content hr{ height:1px; border:none; background:var(--line); margin:26px 0; }

/* 3줄 요약(본문 첫 인용구) — 결론 먼저 보여주는 요약 카드로 강조.
   두 번째 인용구부터는 일반 인용 스타일(위 blockquote 규칙)을 그대로 쓴다. */
.single .entry-content > blockquote:first-of-type{
  margin:0 0 26px; padding:20px 22px; border:1px solid var(--line); border-left:3px solid var(--signal);
  border-radius:10px; background:var(--surface); font-size:15.5px; line-height:1.7;
}
.single .entry-content > blockquote:first-of-type p{ margin:0 0 6px; }
.single .entry-content > blockquote:first-of-type p:last-child{ margin-bottom:0; }

/* 자동 목차(functions.php의 ganeum_add_toc) */
.ganeum-toc{
  margin:0 0 30px; padding:18px 22px; border:1px solid var(--line); border-radius:10px;
  background:var(--surface-2);
}
.ganeum-toc-title{
  margin:0 0 10px!important; font-family:"JetBrains Mono",monospace; font-size:11.5px;
  font-weight:600; letter-spacing:.06em; color:var(--muted-2);
}
.ganeum-toc ol{ margin:0!important; padding-left:20px; }
.ganeum-toc li{ margin:6px 0; font-size:14.5px; }
.ganeum-toc a{ color:var(--ink)!important; text-decoration:none!important; }
.ganeum-toc a:hover{ color:var(--signal)!important; text-decoration:underline!important; }

/* 사진 + 캡션 (백엔드가 <figure class="ganeum-figure">로 렌더) */
.single .entry-content .ganeum-figure{ margin:26px 0; }
.single .entry-content .ganeum-figure img{ border-radius:8px; }
.single .entry-content .ganeum-figure figcaption{
  margin-top:10px; padding-top:8px; border-top:1px solid var(--line);
  font-size:13px; color:var(--muted-2); text-align:center;
}

/* 쿠팡 파트너스 (백엔드 services/coupang.py가 렌더, 03 §5.2.2)
   대가성 문구는 공정위 지침상 본문 첫 부분 — 본문과 구분되되 거슬리지 않게 캡션 톤으로. */
.single .entry-content .ganeum-disclosure{
  margin:0 0 22px; padding:2px 0 2px 10px; border-left:2px solid var(--line);
  font-size:13px; line-height:1.6; color:var(--muted-2);
}
.single .entry-content .ganeum-buy{
  display:flex; flex-wrap:wrap; align-items:center; gap:8px 14px;
  margin:26px 0; padding:16px 18px; border-radius:10px;
  background:var(--surface-2); border:1px solid var(--line);
}
.single .entry-content .ganeum-buy__label{
  flex-basis:100%; font-size:11.5px; letter-spacing:.02em; color:var(--muted-2);
}
.single .entry-content .ganeum-buy__name{ flex:1 1 auto; font-size:15px; }
.single .entry-content .ganeum-buy__btn{
  display:inline-block; padding:10px 16px; border-radius:8px;
  background:var(--signal); color:var(--signal-ink); font-weight:700; font-size:14px;
  text-decoration:none; white-space:nowrap;
}
.single .entry-content .ganeum-buy__btn:hover{ filter:brightness(1.06); }
.single .entry-content .ganeum-buy__row{
  display:flex; flex-basis:100%; align-items:center; justify-content:space-between; gap:14px;
}
@media (max-width:600px){
  .single .entry-content .ganeum-buy__btn{ flex-basis:100%; text-align:center; }
  .single .entry-content .ganeum-buy__row{ flex-wrap:wrap; }
}

/* 장단점 표 — 첫 열(장점)/둘째 열(단점)을 색으로 구분해 스캔 가능하게 */
.single .entry-content table thead th:first-child{ color:var(--cat-place); }
.single .entry-content table thead th:last-child{ color:var(--signal); }
.single .entry-content table tbody tr:hover{ background:var(--surface-2); }

/* FAQ — H3 질문 앞에 Q 마커 */
.single .entry-content h3{ margin-top:1.6em!important; padding-left:22px; position:relative; }
.single .entry-content h3::before{
  content:"Q"; position:absolute; left:0; top:0;
  font-family:"JetBrains Mono",monospace; font-size:13px; font-weight:600; color:var(--signal);
}

/* 관련 글(내부 링크) */
.ganeum-related{
  max-width:var(--post-max-width,760px); margin:44px auto 0; padding-top:26px; border-top:1px solid var(--line);
}
.ganeum-related h2{
  font-family:"Pretendard Variable",sans-serif; font-weight:800; font-size:18px;
  letter-spacing:-.01em; margin:0 0 14px;
}
.ganeum-related ul{ list-style:none; margin:0; padding:0; }
.ganeum-related li{
  display:flex; align-items:baseline; justify-content:space-between; gap:14px;
  padding:12px 0; border-bottom:1px solid var(--line);
}
.ganeum-related a{ font-size:15px; font-weight:600; color:var(--ink); text-decoration:none; }
.ganeum-related a:hover{ color:var(--signal); }
.ganeum-related .mono{ font-size:12.5px; color:var(--muted-2); white-space:nowrap; }

/* 태그/카테고리 링크(entry-footer) — 목록 태그칩 톤과 동일하게 */
.single .entry-footer{ max-width:var(--post-max-width,760px); margin:32px auto 0; padding-top:20px; border-top:1px solid var(--line); }
.single .entry-footer a{ font-size:12.5px; color:var(--muted); background:var(--surface-2); padding:5px 10px; border-radius:999px; margin:0 6px 6px 0; display:inline-block; text-decoration:none; }
.single .entry-footer a:hover{ color:var(--ink); background:var(--line); }

/* =========================================================
   9) 댓글 — GP는 comments.php를 커스텀 안 해서(=워드프레스 코어 comment_form()/
      wp_list_comments() 기본 마크업 그대로) 여태 완전 무재도장 상태였다. 실측
      확인(2026-09-02, 실서버 DOM): #respond .comment-reply-title, #commentform,
      author/email/url input(코어 comment_form() 기본 마크업, 래핑 <p> 없이
      label+input만 나열됨), .comment-form-cookies-consent, .form-submit이
      전부 코어 문자열 그대로였다. 댓글 목록(.comment-list 등)은 사이트에 실제
      댓글이 아직 하나도 없어 실측 불가 — 워드프레스 코어 Walker_Comment 기본
      클래스명(테마 어디서도 커스텀 워커를 안 씀)을 기준으로 방어적으로 재도장한다.
      ========================================================= */
.single .comments-area{
  max-width:var(--post-max-width,760px); margin:44px auto 0; padding-top:26px;
  border-top:1px solid var(--line);
}
/* 댓글 목록 — 2026-09-02 실 댓글 1건 남겨서 실측 확인한 실제 GP 마크업 기준:
   footer.comment-meta > (img.avatar + div.comment-author-info > div.comment-author +
   div.comment-metadata) + p.comment-awaiting-moderation(있으면, 승인 대기 시) */
.comments-title{
  font-family:"Pretendard Variable",sans-serif; font-weight:800; font-size:18px;
  letter-spacing:-.01em; margin:0 0 20px; color:var(--ink);
}
.comment-list{ list-style:none!important; margin:0 0 8px!important; padding:0!important; }
.comment-list .children{ list-style:none; margin:0; padding:0 0 0 32px; }
.comment-body{ padding:20px 0!important; border-top:1px solid var(--line); }
.comment-list > li:first-child > .comment-body{ border-top:none; padding-top:0; }
.comment-meta{ display:flex; align-items:flex-start; gap:10px; margin:0 0 10px!important; flex-wrap:wrap; }
.comment-meta .avatar{ border-radius:50%; flex-shrink:0; }
.comment-author .fn{ font-style:normal; font-weight:700; font-size:14.5px; color:var(--ink); }
.comment-author .says{ display:none; }
.comment-metadata{ font-size:12.5px; color:var(--muted-2); margin-top:2px; }
.comment-metadata a{ color:var(--muted-2); }
.comment-awaiting-moderation{
  width:100%; margin:2px 0 0; font-size:12.5px; color:var(--signal); font-style:italic;
}
/* GP 부모테마 기본 CSS가 .comment-content에 회색 테두리+30px 패딩 박스를 입혀놔서
   (실측 2026-09-02: rgba(0,0,0,.05) 테두리, 30px 패딩) 아바타 행과 따로 노는 느낌이
   났다 — 벗기고 목록형(.ganeum-related 등과 같은 톤)으로 통일한다. */
.comment-content{
  border:none!important; background:none!important; padding:0!important;
  font-size:15px; line-height:1.75; color:var(--ink);
}
.comment-content p{ margin:0 0 10px; }
.comment-content p:last-child{ margin-bottom:0; }
.reply{ margin-top:10px; }
.comment-reply-link{
  font-size:12.5px; font-weight:600; color:var(--muted);
  border:1px solid var(--line); border-radius:999px; padding:4px 12px;
}
.comment-reply-link:hover{ color:var(--ink); border-color:var(--ink); }
.comment-navigation{ display:flex; justify-content:space-between; margin:18px 0; font-size:13px; }
.no-comments{ font-size:14px; color:var(--muted-2); padding:8px 0; }

/* 새 댓글 작성 폼 (#respond) — 실측 확인 완료 */
.comment-respond{ padding-top:4px; }
.comment-reply-title{
  font-family:"Pretendard Variable",sans-serif; font-weight:800; font-size:19px;
  letter-spacing:-.01em; margin:0 0 18px; color:var(--ink);
}
.comment-reply-title small{ margin-left:8px; font-weight:500; }
.comment-reply-title small a{
  font-size:12.5px; color:var(--muted-2); text-decoration:underline;
  text-decoration-color:var(--line);
}
.comment-reply-title small a:hover{ color:var(--signal); text-decoration-color:var(--signal); }

/* 로그인 상태 안내(.logged-in-as) + "필수 항목은 *로 표시" 안내(.comment-notes,
   .required-field-message) — 워드프레스 코어가 한 <p> 안에 붙여서 출력해 그냥 두면
   문장이 다 붙어서 깨져 보인다(실측 2026-09-02). 줄 나눠서 작은 안내문으로 정리. */
.logged-in-as,
.comment-notes{
  font-size:13px; color:var(--muted); line-height:1.6; margin:0 0 16px;
}
.logged-in-as a,
.comment-notes a{ color:var(--ink); text-decoration:underline; text-decoration-color:var(--line); }
.logged-in-as a:hover,
.comment-notes a:hover{ text-decoration-color:var(--signal); }
.required-field-message{ display:block; margin-top:2px; color:var(--muted-2); }

.comment-form textarea,
.comment-form input[type=text],
.comment-form input[type=email],
.comment-form input[type=url]{
  display:block; width:100%; margin:0 0 14px; padding:12px 14px;
  border:1px solid var(--line); border-radius:8px; background:var(--surface);
  color:var(--ink); font-size:15px; font-family:"Pretendard Variable","Noto Sans KR",sans-serif;
  transition:border-color .15s ease;
}
/* rows="8" 속성이 min-height보다 우선해 실제로는 훨씬 커 보였다(실측) — height로 고정. */
.comment-form textarea{ height:90px!important; line-height:1.6; resize:vertical; }
.comment-form ::placeholder{ color:var(--muted-2); }
.comment-form textarea:focus,
.comment-form input:focus{ border-color:var(--signal); }

.comment-form-cookies-consent{
  display:flex; align-items:flex-start; gap:8px; margin:4px 0 20px;
  font-size:13px; color:var(--muted); line-height:1.5;
}
.comment-form-cookies-consent input[type=checkbox]{
  margin-top:3px; width:16px; height:16px; accent-color:var(--signal); flex-shrink:0;
}

.comment-form .form-submit{ margin:0; }
.comment-form #submit{
  display:inline-flex; align-items:center; gap:8px; padding:13px 26px;
  border-radius:999px; background:var(--ink); color:var(--on-ink); border:1px solid var(--ink);
  font-family:"Pretendard Variable",sans-serif; font-weight:700; font-size:14.5px;
  cursor:pointer; transition:opacity .15s ease, transform .15s ease;
}
.comment-form #submit:hover{ opacity:.86; }
.comment-form #submit:active{ transform:translateY(1px) scale(.98); }

/* =========================================================
   10) 모바일 폭 넘침 방지 (COPPER §14와 동일 패턴)
   ========================================================= */
@media (max-width:768px){
  html,body,.site,.site-content,.content-area,.site-main{ max-width:100%; overflow-x:visible!important; }
}