/* =========================================================
   BLOG / POSTS CSS — ctv-blog-* and ctv-post-*
   ========================================================= */

.ctv-blog-page { padding-top: 5rem; }

/* ── Blog Hero ────────────────────────────────────────── */
.ctv-blog-hero, .ctv-post-hero {
  position: relative; overflow: hidden;
  background: hsl(220,25%,8%);
  padding: 4rem 0 3.5rem;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.ctv-blog-hero__bg, .ctv-post-hero__bg {
  position: absolute; inset: 0;
  background: radial-gradient(ellipse at top left, rgba(124,58,237,0.18), transparent 55%),
              radial-gradient(ellipse at bottom right, rgba(16,185,129,0.08), transparent 55%);
}
.ctv-blog-hero__inner, .ctv-post-hero__inner { position: relative; z-index:2; max-width:52rem; }
.ctv-blog-hero__title, .ctv-post-hero__title {
  font-size: clamp(1.875rem,4vw,3rem);
  font-weight: 800; color: #fff; line-height: 1.2; margin-bottom: 0.75rem;
}
.ctv-blog-hero__sub { font-size:1rem; color:rgba(255,255,255,0.55); line-height:1.7; max-width:38rem; }
.ctv-post-hero__excerpt { font-size:1.0625rem; color:rgba(255,255,255,0.6); line-height:1.75; max-width:44rem; margin-top:0.75rem; }

/* Post tags / region chips */
.ctv-post-hero__tags { display:flex; flex-wrap:wrap; gap:0.5rem; margin-bottom:1rem; }
.ctv-post-tag { display:inline-flex; align-items:center; padding:0.25rem 0.75rem; border-radius:99px; font-size:0.75rem; font-weight:600; text-decoration:none; transition:var(--tm-transition); }
.ctv-post-tag--cat  { background:rgba(124,58,237,0.15); border:1px solid rgba(124,58,237,0.3); color:hsl(270,70%,65%); }
.ctv-post-tag--cat:hover { background:rgba(124,58,237,0.25); color:hsl(270,70%,75%); }
.ctv-post-tag--region { background:rgba(16,185,129,0.1); border:1px solid rgba(16,185,129,0.25); color:hsl(155,65%,55%); }

/* Post meta */
.ctv-post-hero__meta { display:flex; gap:1.25rem; margin-top:0.75rem; flex-wrap:wrap; }
.ctv-post-meta-item { display:flex; align-items:center; gap:0.375rem; font-size:0.8125rem; color:rgba(255,255,255,0.4); }

/* ── Blog grid ────────────────────────────────────────── */
.ctv-blog-grid-section { background: var(--tm-bg); }
.ctv-blog-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(20rem, 1fr));
  gap: 1.5rem;
}

.ctv-blog-card {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 1.25rem;
  overflow: hidden;
  transition: var(--tm-transition);
  display: flex;
  flex-direction: column;
}
.ctv-blog-card:hover {
  border-color: rgba(124,58,237,0.3);
  transform: translateY(-4px);
  box-shadow: 0 12px 40px rgba(0,0,0,0.3);
}
.ctv-blog-card__link { text-decoration:none; display:flex; flex-direction:column; flex:1; color:inherit; }

.ctv-blog-card__body { padding:1.5rem; display:flex; flex-direction:column; flex:1; }
.ctv-blog-card__tags { display:flex; flex-wrap:wrap; gap:0.375rem; margin-bottom:0.875rem; }
.ctv-blog-card__title { font-size:1.0625rem; font-weight:700; color:#fff; line-height:1.4; margin-bottom:0.75rem; }
.ctv-blog-card__excerpt { font-size:0.875rem; color:rgba(255,255,255,0.55); line-height:1.7; flex:1; margin-bottom:1rem; overflow:hidden; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; }
.ctv-blog-card__footer { display:flex; justify-content:space-between; font-size:0.75rem; color:rgba(255,255,255,0.35); margin-bottom:0.875rem; }
.ctv-blog-card__cta { display:inline-flex; align-items:center; font-size:0.875rem; font-weight:600; color:hsl(270,70%,65%); transition:var(--tm-transition); margin-top:auto; }
.ctv-blog-card:hover .ctv-blog-card__cta { color:hsl(270,70%,75%); gap:0.375rem; }

/* Pagination */
.ctv-blog-pagination { margin-top:3rem; display:flex; justify-content:center; }
.ctv-blog-pagination .page-numbers { display:flex; list-style:none; gap:0.5rem; flex-wrap:wrap; justify-content:center; }
.ctv-blog-pagination .page-numbers li a,
.ctv-blog-pagination .page-numbers li span {
  display:inline-flex; align-items:center; justify-content:center;
  width:2.5rem; height:2.5rem; border-radius:0.5rem;
  font-size:0.875rem; font-weight:500; text-decoration:none;
  background:rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.1);
  color:rgba(255,255,255,0.65); transition:var(--tm-transition);
}
.ctv-blog-pagination .page-numbers li a:hover { background:rgba(124,58,237,0.15); border-color:rgba(124,58,237,0.3); color:#fff; }
.ctv-blog-pagination .page-numbers li span.current { background:linear-gradient(135deg,#7c3aed,#9333ea); border-color:transparent; color:#fff; }
.ctv-blog-pagination .page-numbers li a.prev,
.ctv-blog-pagination .page-numbers li a.next { width:auto; padding:0 1rem; }

.ctv-blog-empty { text-align:center; padding:5rem 1rem; }
.ctv-blog-empty span { font-size:3rem; display:block; margin-bottom:1rem; }
.ctv-blog-empty a { color:hsl(270,70%,65%); }

/* ── Single post layout ───────────────────────────────── */
.ctv-post-layout {
  display: grid;
  grid-template-columns: 1fr 22rem;
  gap: 3.5rem;
  padding: 3.5rem 0 5rem;
  align-items: start;
}

/* Post body typography */
.ctv-post-body { line-height: 1.85; }
.ctv-post-body p           { font-size:1rem; color:rgba(255,255,255,0.72); margin-bottom:1.25rem; line-height:1.85; }
.ctv-post-body h2          { font-size:1.625rem; font-weight:800; color:#fff; margin:2.5rem 0 1rem; padding-top:0.5rem; border-top:1px solid rgba(255,255,255,0.07); }
.ctv-post-body h3          { font-size:1.25rem; font-weight:700; color:rgba(255,255,255,0.9); margin:1.75rem 0 0.75rem; }
.ctv-post-body h4          { font-size:1.0625rem; font-weight:700; color:rgba(255,255,255,0.85); margin:1.5rem 0 0.625rem; }
.ctv-post-body ul, .ctv-post-body ol { margin:0.75rem 0 1.25rem 1.5rem; display:flex; flex-direction:column; gap:0.5rem; }
.ctv-post-body ul          { list-style:disc; }
.ctv-post-body ol          { list-style:decimal; }
.ctv-post-body li          { font-size:1rem; color:rgba(255,255,255,0.68); line-height:1.7; }
.ctv-post-body li strong   { color:rgba(255,255,255,0.9); }
.ctv-post-body strong      { color:rgba(255,255,255,0.9); }
.ctv-post-body a           { color:hsl(270,70%,65%); text-decoration:underline; text-underline-offset:3px; }
.ctv-post-body a:hover     { color:hsl(270,70%,75%); }
.ctv-post-body blockquote  { border-left:4px solid hsl(260,70%,55%); padding:0.75rem 1.25rem; margin:1.5rem 0; background:rgba(124,58,237,0.07); border-radius:0 0.5rem 0.5rem 0; font-style:italic; color:rgba(255,255,255,0.65); }
.ctv-post-body code        { background:rgba(255,255,255,0.08); padding:0.125rem 0.375rem; border-radius:0.25rem; font-size:0.875rem; font-family:monospace; color:#c4b5fd; }
.ctv-post-body pre         { background:rgba(0,0,0,0.4); padding:1.25rem; border-radius:0.75rem; overflow-x:auto; margin:1.25rem 0; }
.ctv-post-body pre code    { background:none; padding:0; color:#e2e8f0; }

/* Tables in posts */
.ctv-post-body .wp-block-table { overflow-x:auto; margin:1.5rem 0; }
.ctv-post-body table           { width:100%; border-collapse:collapse; font-size:0.9375rem; }
.ctv-post-body thead tr        { background:rgba(124,58,237,0.1); border-bottom:1px solid rgba(124,58,237,0.2); }
.ctv-post-body th              { padding:0.75rem 1rem; text-align:left; font-weight:600; color:rgba(255,255,255,0.85); font-size:0.8125rem; text-transform:uppercase; letter-spacing:0.06em; }
.ctv-post-body td              { padding:0.75rem 1rem; border-bottom:1px solid rgba(255,255,255,0.06); color:rgba(255,255,255,0.7); }
.ctv-post-body tbody tr:hover td { background:rgba(255,255,255,0.02); }

/* Post tags */
.ctv-post-tags { display:flex; flex-wrap:wrap; align-items:center; gap:0.5rem; margin:2.5rem 0; padding-top:2rem; border-top:1px solid rgba(255,255,255,0.07); }
.ctv-post-tags__label { font-size:0.8125rem; font-weight:600; color:rgba(255,255,255,0.4); text-transform:uppercase; letter-spacing:0.08em; }
.ctv-post-tag-pill { padding:0.25rem 0.75rem; background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.1); border-radius:99px; font-size:0.8125rem; color:rgba(255,255,255,0.55); text-decoration:none; transition:var(--tm-transition); }
.ctv-post-tag-pill:hover { border-color:rgba(124,58,237,0.3); color:hsl(270,70%,65%); }

/* Author box */
.ctv-post-author-box { display:flex; gap:1.25rem; align-items:flex-start; padding:1.5rem; background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.08); border-radius:1rem; margin:2.5rem 0; }
.ctv-post-author-box__icon { width:3rem; height:3rem; background:linear-gradient(135deg,#7c3aed,#9333ea); border-radius:50%; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.ctv-post-author-box__icon svg { width:1.25rem; height:1.5rem; color:#fff; }
.ctv-post-author-box__name { font-weight:700; color:#fff; font-size:0.9375rem; margin-bottom:0.25rem; }
.ctv-post-author-box__bio  { font-size:0.875rem; color:rgba(255,255,255,0.5); line-height:1.65; }

/* Post navigation */
.ctv-post-nav { display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin-top:2.5rem; }
.ctv-post-nav__item { padding:1.25rem; background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.08); border-radius:0.875rem; text-decoration:none; transition:var(--tm-transition); display:flex; flex-direction:column; gap:0.375rem; }
.ctv-post-nav__item:hover { border-color:rgba(124,58,237,0.3); background:rgba(124,58,237,0.06); }
.ctv-post-nav__item--next { text-align:right; }
.ctv-post-nav__dir   { font-size:0.75rem; color:rgba(255,255,255,0.35); font-weight:500; }
.ctv-post-nav__title { font-size:0.875rem; font-weight:600; color:#fff; line-height:1.4; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }

/* ── Sidebar ──────────────────────────────────────────── */
.ctv-post-sidebar { position:sticky; top:6.5rem; display:flex; flex-direction:column; gap:1.25rem; }

.ctv-sidebar-cta {
  background: rgba(124,58,237,0.08);
  border: 1px solid rgba(124,58,237,0.2);
  border-radius: 1.25rem;
  padding: 1.5rem;
  text-align: center;
}
.ctv-sidebar-cta__icon { width:2.75rem; height:2.75rem; background:linear-gradient(135deg,#7c3aed,#9333ea); border-radius:0.75rem; display:flex; align-items:center; justify-content:center; margin:0 auto 1rem; }
.ctv-sidebar-cta__icon svg { width:1.25rem; height:1.5rem; color:#fff; }
.ctv-sidebar-cta h3 { font-size:1.125rem; font-weight:700; color:#fff; margin-bottom:0.5rem; }
.ctv-sidebar-cta p  { font-size:0.875rem; color:rgba(255,255,255,0.55); margin-bottom:1.25rem; line-height:1.6; }

.ctv-sidebar-features { background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.08); border-radius:1rem; padding:1.25rem; }
.ctv-sidebar-features h4 { font-size:0.875rem; font-weight:700; color:#fff; margin-bottom:0.875rem; text-transform:uppercase; letter-spacing:0.08em; }
.ctv-sidebar-feature { display:flex; align-items:center; gap:0.5rem; font-size:0.875rem; color:rgba(255,255,255,0.65); padding:0.375rem 0; border-bottom:1px solid rgba(255,255,255,0.05); }
.ctv-sidebar-feature:last-child { border-bottom:none; }
.ctv-sidebar-feature svg { width:0.875rem; height:0.875rem; color:hsl(260,70%,65%); flex-shrink:0; }

.ctv-sidebar-recent { background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.08); border-radius:1rem; padding:1.25rem; }
.ctv-sidebar-recent h4 { font-size:0.875rem; font-weight:700; color:#fff; margin-bottom:0.875rem; text-transform:uppercase; letter-spacing:0.08em; }
.ctv-sidebar-recent-item { display:flex; flex-direction:column; gap:0.25rem; padding:0.75rem 0; border-bottom:1px solid rgba(255,255,255,0.06); text-decoration:none; transition:var(--tm-transition); }
.ctv-sidebar-recent-item:last-child { border-bottom:none; }
.ctv-sidebar-recent-item:hover .ctv-sidebar-recent-item__title { color:hsl(270,70%,65%); }
.ctv-sidebar-recent-item__title { font-size:0.875rem; font-weight:500; color:rgba(255,255,255,0.75); line-height:1.4; }
.ctv-sidebar-recent-item__date  { font-size:0.75rem; color:rgba(255,255,255,0.3); }

/* ── Related posts ────────────────────────────────────── */
.ctv-related-posts { background:hsl(220,25%,10%); border-top:1px solid rgba(255,255,255,0.06); padding:4rem 0; }
.ctv-related-posts__title { font-size:1.5rem; font-weight:800; color:#fff; margin-bottom:2rem; }
.ctv-related-posts__grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(18rem,1fr)); gap:1.25rem; }

/* ── Responsive ───────────────────────────────────────── */
@media (max-width:1024px) {
  .ctv-post-layout { grid-template-columns:1fr; gap:2.5rem; padding:2.5rem 0 4rem; }
  .ctv-post-sidebar { position:static; }
}
@media (max-width:768px) {
  .ctv-blog-hero, .ctv-post-hero { padding:3.5rem 0 2.5rem; }
  .ctv-blog-grid { grid-template-columns:1fr; }
  .ctv-post-nav { grid-template-columns:1fr; }
  .ctv-post-author-box { flex-direction:column; gap:0.875rem; }
  .ctv-related-posts__grid { grid-template-columns:1fr; }
}
