/* ==========================================================================
   Single blog post bundle
   ========================================================================== */

.pc-single-head { padding: 34px 0 8px; }
.pc-single-tag {
  display: inline-block; background: var(--pc-teal-soft); color: var(--pc-teal-dark);
  font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase;
  padding: 6px 12px; border-radius: 100px; margin-bottom: 14px;
}
.pc-single-title { font-size: 44px; line-height: 1.08; margin: 0 0 12px; max-width: 820px; }
.pc-single-meta { font-size: 13px; font-weight: 700; color: var(--pc-muted2); display: flex; gap: 8px; flex-wrap: wrap; }

.pc-single-hero { border-radius: var(--pc-radius-lg); overflow: hidden; margin: 22px 0 6px; }
.pc-single-hero img { width: 100%; display: block; }

/* ---------- Body ---------- */
.pc-single-layout { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 44px; align-items: start; padding: 34px 0 56px; }
.pc-single-body { font-size: 17px; max-width: var(--pc-measure); }
.pc-single-body > p:first-of-type { font-size: 19px; color: var(--pc-ink-soft); }
.pc-page-links { margin-top: 24px; font-weight: 800; font-size: 14px; }

/* ---------- Sidebar ---------- */
.pc-single-side { position: sticky; top: 96px; display: grid; gap: 16px; }
.pc-side-card { border: 1px solid var(--pc-border); border-radius: var(--pc-radius); padding: 22px; background: var(--pc-surface); }
.pc-side-title { font-weight: 800; font-size: 14px; margin-bottom: 12px; }
.pc-share { display: flex; flex-wrap: wrap; gap: 8px; }
.pc-share-btn {
  border: 1px solid var(--pc-border2); background: var(--pc-surface2); border-radius: 100px;
  padding: 9px 15px; font-size: 13px; font-weight: 800; color: var(--pc-ink);
  cursor: pointer; font-family: var(--pc-sans);
}
.pc-share-btn:hover { background: var(--pc-yellow-soft); color: var(--pc-ink); }
.pc-share-btn.copied { background: var(--pc-teal-soft); border-color: var(--pc-teal-soft); color: var(--pc-teal-dark); }
.pc-side-shop { background: var(--pc-yellow-soft); border-color: var(--pc-border2); }
.pc-side-shop p { font-size: 14px; color: #6B5A1F; margin: 0 0 14px; line-height: 1.6; }
.pc-side-shop .pc-btn { width: 100%; padding: 13px; font-size: 15px; }

/* ---------- Related + comments ---------- */
.pc-single-related { padding-bottom: 56px; }
.pc-single-comments { padding-bottom: 56px; max-width: var(--pc-measure); }
.pc-single-comments .comment-reply-title { font-family: var(--pc-serif); font-size: 26px; }
.pc-single-comments .comment-list { list-style: none; padding: 0; }
.pc-single-comments .comment-body {
  border: 1px solid var(--pc-border); border-radius: var(--pc-radius);
  padding: 20px; margin-bottom: 14px; background: var(--pc-surface);
}
.pc-single-comments textarea, .pc-single-comments input[type="text"], .pc-single-comments input[type="email"] { width: 100%; }
.pc-single-comments .submit {
  background: var(--pc-ink); color: var(--pc-bg); border: none; border-radius: var(--pc-radius-sm);
  padding: 14px 24px; font-weight: 800; cursor: pointer;
}

/* ---------- Responsive ---------- */
@media (max-width: 900px) {
  .pc-single-layout { grid-template-columns: 1fr; gap: 28px; }
  .pc-single-side { position: static; }
  .pc-single-title { font-size: 34px; }
}
@media (max-width: 620px) {
  .pc-single-title { font-size: 28px; }
  .pc-single-body { font-size: 16px; }
  .pc-single-body > p:first-of-type { font-size: 17px; }
}
