/* single-post.css — placeholder that loads the styles from style.css block */
/* Full styles are in the main style.css + blog.css for archive */
/* This file triggers conditional enqueue on singular posts */

/* ── Single post layout wrapper ───────────────────────── */
.single-post {
  max-width: 780px;
  margin: 0 auto;
  padding: 0 24px 60px;
}

/* ── Featured image hero ──────────────────────────────── */
.single-hero-wrap {
  position: relative;
  width: 100%;
  max-height: 500px;
  overflow: hidden;
}
.single-hero-img {
  width: 100%;
  max-height: 500px;
  object-fit: cover;
  display: block;
}
.single-hero-overlay {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 40%;
  background: linear-gradient(transparent, var(--iv-bg));
  pointer-events: none;
}

/* ── Post header ──────────────────────────────────────── */
.single-post-header {
  padding: 40px 24px 32px;
  max-width: 780px;
  margin: 0 auto;
  border-bottom: 1px solid rgba(123,47,255,.1);
  margin-bottom: 44px;
}

/* ── Breadcrumb ───────────────────────────────────────── */
.single-breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 18px;
  flex-wrap: wrap;
}
.single-breadcrumb a {
  font-family: 'Inter', sans-serif;
  font-size: 12.5px;
  color: var(--iv-text-muted);
  text-decoration: none;
  transition: color 0.2s;
}
.single-breadcrumb a:hover { color: var(--iv-purple); }
.single-breadcrumb span { color: var(--iv-text-muted); font-size: 12px; }

/* ── Post title ───────────────────────────────────────── */
.single-post-title {
  font-family: 'Outfit', sans-serif;
  font-size: clamp(28px, 4vw, 46px);
  font-weight: 800;
  color: var(--iv-text);
  line-height: 1.12;
  letter-spacing: -0.028em;
  margin: 16px 0 22px;
}

/* ── Meta bar ─────────────────────────────────────────── */
.single-post-meta {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  color: var(--iv-text-muted);
}
.single-post-meta span { display: flex; align-items: center; gap: 6px; }
.meta-sep { color: rgba(123,47,255,.3); }

/* ── Prose ────────────────────────────────────────────── */
.single-post-content.prose,
.page-body.prose {
  font-family: 'Inter', sans-serif;
  font-size: 16.5px;
  line-height: 1.84;
  color: var(--iv-text);
  max-width: 780px;
  margin: 0 auto;
  padding: 0 24px;
}
.prose h2 { font-family:'Outfit',sans-serif; font-size:clamp(22px,3vw,32px); font-weight:800; color:var(--iv-text); margin:52px 0 18px; letter-spacing:-0.022em; line-height:1.18; border-top:1px solid rgba(123,47,255,.1); padding-top:8px; }
.prose h3 { font-family:'Outfit',sans-serif; font-size:clamp(18px,2.5vw,26px); font-weight:700; color:var(--iv-text); margin:38px 0 14px; letter-spacing:-0.015em; }
.prose h4 { font-family:'Outfit',sans-serif; font-size:19px; font-weight:700; color:var(--iv-text); margin:28px 0 10px; }
.prose p  { margin-bottom: 22px; }
.prose a  { color:var(--iv-purple); text-decoration:underline; text-underline-offset:3px; }
.prose a:hover { color:var(--iv-purple-dark); }
.prose ul,.prose ol { padding-left:26px; margin-bottom:22px; }
.prose li { margin-bottom:9px; line-height:1.76; }
.prose ul li::marker { color:var(--iv-purple); }
.prose ol li::marker { color:var(--iv-purple); font-weight:700; font-family:'JetBrains Mono',monospace; }
.prose blockquote { border-left:3px solid var(--iv-purple); margin:36px 0; padding:20px 28px; background:rgba(123,47,255,.04); border-radius:0 14px 14px 0; font-style:italic; color:var(--iv-text-secondary); font-size:17px; }
.prose code { font-family:'JetBrains Mono',monospace; font-size:13.5px; background:rgba(123,47,255,.07); border:1px solid rgba(123,47,255,.14); border-radius:5px; padding:2px 7px; color:var(--iv-purple-dark); }
.prose pre { background:var(--iv-deep); border:1px solid rgba(255,255,255,.08); border-radius:14px; padding:26px; overflow-x:auto; margin:32px 0; }
.prose pre code { background:transparent; border:none; padding:0; color:rgba(255,255,255,.82); }
.prose img { width:100%; border-radius:16px; margin:32px 0; display:block; box-shadow:0 8px 32px rgba(0,0,0,.08); }
.prose hr { border:none; border-top:1px solid rgba(123,47,255,.12); margin:44px 0; }
.prose strong { font-weight:700; }

/* ── Tags ─────────────────────────────────────────────── */
.single-post-tags {
  max-width:780px; margin:36px auto 0; padding:24px 24px 0;
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  border-top:1px solid rgba(123,47,255,.1);
}
.tags-label { font-family:'JetBrains Mono',monospace; font-size:11px; font-weight:500; letter-spacing:0.12em; text-transform:uppercase; color:var(--iv-text-muted); }
.post-tag { font-family:'Inter',sans-serif; font-size:12.5px; font-weight:500; color:var(--iv-purple); background:rgba(123,47,255,.08); border:1px solid rgba(123,47,255,.16); border-radius:100px; padding:4px 13px; text-decoration:none; transition:all 0.2s; }
.post-tag:hover { background:var(--iv-purple); color:white; border-color:var(--iv-purple); }

/* ── Share ────────────────────────────────────────────── */
.single-post-share { max-width:780px; margin:20px auto 0; padding:20px 24px; display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.share-label { font-family:'Inter',sans-serif; font-size:13px; font-weight:600; color:var(--iv-text-muted); }
.share-btn { font-family:'Inter',sans-serif; font-size:12.5px; font-weight:600; padding:7px 16px; border-radius:100px; border:1.5px solid rgba(123,47,255,.2); color:var(--iv-text-secondary); background:white; text-decoration:none; cursor:pointer; transition:all 0.2s; display:inline-flex; align-items:center; gap:6px; }
.share-btn:hover { border-color:var(--iv-purple); color:var(--iv-purple); background:rgba(123,47,255,.05); }

/* ── Author box ───────────────────────────────────────── */
.single-author-box { max-width:780px; margin:40px auto 0; padding:28px 24px; display:flex; gap:22px; align-items:flex-start; background:white; border:1px solid rgba(123,47,255,.1); border-radius:20px; box-shadow:0 4px 22px rgba(123,47,255,.06); }
.author-avatar-large img.author-gravatar { width:64px; height:64px; border-radius:50%; border:2px solid rgba(123,47,255,.2); flex-shrink:0; }
.author-name { font-family:'Outfit',sans-serif; font-size:17px; font-weight:800; color:var(--iv-text); margin-bottom:6px; }
.author-bio { font-family:'Inter',sans-serif; font-size:13.5px; color:var(--iv-text-secondary); line-height:1.68; margin-bottom:14px; }
.author-cta { font-family:'Inter',sans-serif; font-size:13px; font-weight:600; color:var(--iv-purple); text-decoration:none; border-bottom:1px solid rgba(123,47,255,.3); padding-bottom:2px; }

/* ── Post nav ─────────────────────────────────────────── */
.single-post-nav { max-width:780px; margin:40px auto 0; padding:24px; display:grid; grid-template-columns:1fr 1fr; gap:16px; border-top:1px solid rgba(123,47,255,.1); }
.post-nav-next { text-align:right; }
.single-post-nav a { font-family:'Inter',sans-serif; font-size:13.5px; font-weight:600; color:var(--iv-purple); text-decoration:none; line-height:1.5; }

/* ── Related posts ────────────────────────────────────── */
.related-posts-section { background:var(--iv-bg); padding:60px 0 0; border-top:1px solid rgba(123,47,255,.08); }
.related-posts-title { font-family:'Outfit',sans-serif; font-size:26px; font-weight:800; color:var(--iv-text); margin-bottom:32px; letter-spacing:-0.02em; }
.related-grid { grid-template-columns:repeat(3,1fr); padding-bottom:60px; }

/* ── Back link ────────────────────────────────────────── */
.back-link { display:inline-flex; align-items:center; gap:8px; font-family:'Inter',sans-serif; font-size:14px; font-weight:600; color:var(--iv-purple); text-decoration:none; transition:gap .2s; }
.back-link:hover { gap:12px; }

/* ── Archive filter bar ───────────────────────────────── */
.archive-filter-bar { max-width:1240px; margin:28px auto 0; padding:0 48px; }
.filter-group { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.filter-label { font-family:'JetBrains Mono',monospace; font-size:10.5px; font-weight:500; letter-spacing:0.14em; text-transform:uppercase; color:var(--iv-text-muted); flex-shrink:0; }
.filter-pill { font-family:'Inter',sans-serif; font-size:12.5px; font-weight:600; padding:6px 16px; border-radius:100px; border:1.5px solid rgba(123,47,255,.15); color:var(--iv-text-secondary); background:white; text-decoration:none; transition:all 0.2s; display:inline-flex; align-items:center; gap:6px; }
.filter-pill:hover,.filter-pill.active { background:var(--iv-purple); color:white; border-color:var(--iv-purple); }
.filter-pill-tag { font-size:11.5px; padding:4px 12px; background:rgba(123,47,255,.06); border-color:rgba(123,47,255,.12); color:var(--iv-purple); }
.filter-pill-tag:hover,.filter-pill-tag.active { background:var(--iv-purple); color:white; border-color:var(--iv-purple); }
.filter-count { background:rgba(255,255,255,.28); border-radius:100px; padding:0 6px; font-size:10px; font-family:'JetBrains Mono',monospace; }

/* ── Responsive ───────────────────────────────────────── */
@media (max-width:768px) {
  .single-post { padding:0 18px 48px; }
  .single-post-header { padding:28px 18px 24px; }
  .single-post-content.prose { padding:0 18px; }
  .single-post-tags,.single-post-share,.single-author-box,.single-post-nav { padding-left:18px; padding-right:18px; }
  .single-author-box { flex-direction:column; gap:16px; }
  .single-post-nav { grid-template-columns:1fr; }
  .post-nav-next { text-align:left; }
  .related-grid { grid-template-columns:1fr; }
  .archive-filter-bar { padding:0 20px; }
}