/* ===================================================================
   Blog Single – Dark Luxury (CSS-only, no functions change)
   - body.single 기준으로 강제 다크 배경
   - 본문 카드/히어로/이미지/이전·다음 카드/하단 CTA
   - 높은 특이성 + !important 로 테마/인라인 배경 무력화
   =================================================================== */

/* 브랜드 톤 (원하면 교체) */
:root{
  --brand: #D9A441;         /* 골드 */
  --brand-strong: #F5C76A;  /* 밝은 골드 */
}

/* 1) 어떤 배경이 와도 먼저 투명화 */
html, body { background: transparent !important; }

/* 2) 단일 글 화면 전체를 강제로 다크 배경 (폴백 단색 + 표준 그라데이션) */
body.single,
body.single .site,
body.single .site-content{
  background-color: #0e0d11 !important;
  background-image: linear-gradient(180deg, #0e0d11 0%, #14131a 100%) !important;
  background-repeat: no-repeat !important;
  background-attachment: scroll !important;
  min-height: 100vh;
}

/* 2-1) 지원 브라우저에서만 브랜드 하이라이트 레이어 추가 */
@supports (background: radial-gradient(circle at 50% 0%, rgba(0,0,0,.1), transparent)) {
  body.single,
  body.single .site,
  body.single .site-content{
    background-image:
      radial-gradient(1100px 420px at 50% -8%, rgba(217,164,65,0.12) 0%, transparent 55%),
      linear-gradient(180deg, #0e0d11 0%, #14131a 100%) !important;
  }
}

/* 3) 단일 글 컨테이너 중앙 정렬(안전망) */
body.single .site-content .content-area{
  max-width: min(960px, 92vw) !important;
  margin-inline: auto !important;
  padding-inline: clamp(12px, 3.5vw, 24px) !important;
}

/* 4) 본문 카드(종이 패널 느낌) */
body.single .inside-article{
  background:
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.02)) padding-box,
    linear-gradient(145deg, rgba(255,255,255,.12), rgba(255,255,255,.04)) border-box !important;
  border: 1px solid transparent !important;
  border-radius: 16px !important;
  box-shadow: 0 24px 60px rgba(0,0,0,.35) !important;
  padding: clamp(18px, 3.2vw, 32px) !important;
}

/* 5) 타이틀/메타 */
body.single .entry-title{
  font-size: var(--fs-h2, clamp(24px, 3.2vw, 36px));
  font-weight: 900; letter-spacing: -.01em; line-height: 1.22;
  margin: 0 0 .4rem;
}
body.single .entry-meta{
  opacity: .8;
  margin-bottom: clamp(10px, 1.6vw, 14px);
}

/* 6) 상단 히어로(썸네일) 프레임 */
.post-hero{
  position: relative !important;
  margin: 0 0 clamp(18px, 3vw, 28px) !important;
  block-size: clamp(220px, 48vw, 520px) !important;
  border-radius: 18px !important;
  overflow: clip !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02)) padding-box,
    linear-gradient(145deg, rgba(255,255,255,.14), rgba(255,255,255,.04)) border-box !important;
  border: 1px solid transparent !important;
  box-shadow: 0 18px 46px rgba(0,0,0,.38) !important;
}
.post-hero::after{
  content:""; position:absolute; inset: 1px; border-radius: 17px;
  -webkit-mask: linear-gradient(#000,#000) content-box, linear-gradient(#000,#000);
  -webkit-mask-composite: xor; mask-composite: exclude;
  background: linear-gradient(145deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
  padding: 1px; pointer-events: none;
}
.post-hero img{ width:100%; height:100%; object-fit:cover; display:block;
  filter: saturate(1.02) contrast(1.02) brightness(.98); }

/* 7) 본문 내 이미지 프레임 통일 */
body.single .entry-content img,
body.single .wp-block-image img{
  border-radius: 14px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02)) padding-box,
    linear-gradient(145deg, rgba(255,255,255,.14), rgba(255,255,255,.04)) border-box !important;
  border: 1px solid transparent !important;
  box-shadow: 0 12px 30px rgba(0,0,0,.35) !important;
}

/* 8) 이전/다음(커스텀 마크업) 카드 */
.post-adjacent{
  display: grid !important; grid-template-columns: 1fr !important; gap: 12px !important;
  margin: clamp(24px, 4.5vw, 36px) 0 0 !important;
}
@media (min-width: 780px){
  .post-adjacent{ grid-template-columns: 1fr 1fr !important; gap: 14px !important; }
}
.post-adjacent .adj-item{
  position: relative !important;
  display: grid !important; grid-template-columns: 1fr auto !important; align-items: center !important; gap: 12px !important;
  padding: 14px 16px !important; border-radius: 14px !important;
  color: var(--text, #e9e9e9) !important; text-decoration: none !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.02)) padding-box,
    linear-gradient(145deg, rgba(255,255,255,.12), rgba(255,255,255,.04)) border-box !important;
  border: 1px solid transparent !important;
  box-shadow: 0 10px 26px rgba(0,0,0,.28) !important;
  transition: transform .15s ease, box-shadow .2s ease, filter .2s ease !important;
}
.post-adjacent .adj-item:hover{
  transform: translateY(-1px) !important;
  box-shadow: 0 14px 34px rgba(0,0,0,.36) !important;
  filter: saturate(1.03) !important;
}
.post-adjacent .adj-title{
  font-weight: 800 !important; letter-spacing: -.01em !important; line-height: 1.35 !important;
  display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important;
}
.post-adjacent .adj-thumb{
  width: 96px !important; height: 64px !important; border-radius: 10px !important; overflow: clip !important; flex-shrink: 0 !important;
  background: #0e0e0e !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  box-shadow: 0 8px 18px rgba(0,0,0,.28) !important;
}
.post-adjacent .adj-thumb img{ width:100% !important; height:100% !important; object-fit:cover !important; display:block !important; }
@media (min-width: 1024px){
  .post-adjacent .adj-thumb{ width: 112px !important; height: 74px !important; }
}

/* 9) 하단 CTA – 어두운 배경에서도 또렷하게(보더+글로우)
   ※ 주의: .post-bottom-cta 마크업이 글 하단에 실제로 있어야 보입니다. */
.post-bottom-cta{
  margin-top: clamp(22px, 4.2vw, 40px); display: grid; place-items: center;
}
.post-bottom-cta__btn{
  display: inline-flex; align-items: center; justify-content: center;
  min-width: min(92%, 480px); height: 56px; padding: 0 24px;
  border-radius: 999px; text-decoration: none;
  font-weight: 900; letter-spacing: .01em; color: #151515;

  background:
    linear-gradient(135deg, var(--brand-strong), var(--brand)) padding-box,
    linear-gradient(145deg, rgba(255,255,255,.28), rgba(255,255,255,.10)) border-box;
  border: 1px solid transparent;
  box-shadow:
    0 10px 28px rgba(0,0,0,.28),
    0 0 0 1px rgba(255,255,255,.16),
    0 0 34px -6px rgba(217,164,65,.55);
  transition: transform .15s ease, box-shadow .2s ease, filter .2s ease;
}
.post-bottom-cta__btn:hover{
  transform: translateY(-1px);
  filter: saturate(1.02);
  box-shadow:
    0 14px 36px rgba(0,0,0,.34),
    0 0 0 1px rgba(255,255,255,.20),
    0 0 42px -4px rgba(217,164,65,.65);
}
.post-bottom-cta__btn:focus-visible{
  outline: none;
  box-shadow:
    0 0 0 2px rgba(255,255,255,.85),
    0 0 0 6px rgba(217,164,65,.55);
}

/* 10) (선택) 기본 카테고리/태그/기본 이전·다음 숨기기
.entry-meta, .cat-links, .tags-links, .nav-links { display: none !important; }
*/