/* ============================================
   BLOG GRID - 3 columnas FIX ANCHO
   ============================================ */

body.blog .site-content,
body.archive .site-content { background: #0a0a0a; }

/* FORZAR ancho completo a TODOS los wrappers de GeneratePress */
body.blog .site-content,
body.blog .content-area,
body.archive .site-content,
body.archive .content-area {
  max-width: 100% !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
}

/* #primary: contenedor padre, max 1280px centrado */
body.blog #primary,
body.archive #primary {
  max-width: 1280px !important;
  width: 100% !important;
  margin: 0 auto !important;
  padding: 5rem 2rem 6rem !important;
  display: block !important;
  background: transparent !important;
  float: none !important;
}

/* page-header arriba del todo */
body.blog .page-header,
body.archive .page-header {
  text-align: center;
  padding: 5rem 2rem 3.5rem;
  border-bottom: 1px solid rgba(255,255,255,0.06);
  margin: 0 0 4rem;
  background: #0a0a0a;
  max-width: 100%;
}
body.blog .page-header .page-title,
body.archive .page-header .page-title {
  font-size: clamp(2.6rem, 6vw, 4rem);
  font-weight: 800;
  color: #fff;
  letter-spacing: -0.025em;
  line-height: 1.1;
  margin: 0;
}

/* GRID en #main (padre directo de los <article>) */
body.blog #main,
body.archive #main {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 2rem 1.5rem !important;
  max-width: 100% !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
}

/* Cards */
body.blog #main > article,
body.archive #main > article {
  background: #111 !important;
  border: 1px solid rgba(255,255,255,0.07) !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  display: block !important;
  text-align: left !important;
  margin: 0 !important;
  padding: 0 !important;
  transition: border-color 0.25s, transform 0.25s !important;
  min-width: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
}
body.blog #main > article:hover,
body.archive #main > article:hover {
  border-color: rgba(0,223,171,0.3) !important;
  transform: translateY(-4px) !important;
}

/* Inside-article con padding */
body.blog #main > article .inside-article,
body.archive #main > article .inside-article {
  display: block !important;
  padding: 1.5rem !important;
  background: transparent !important;
  border: none !important;
  width: 100% !important;
  max-width: 100% !important;
}

/* Imagen destacada arriba ocupando todo el card width */
body.blog #main > article .post-thumbnail,
body.archive #main > article .post-thumbnail {
  display: block !important;
  margin: -1.5rem -1.5rem 1.2rem !important;
  width: calc(100% + 3rem) !important;
  aspect-ratio: 16/10 !important;
  overflow: hidden !important;
  background: linear-gradient(135deg, #1a1a1a, #0d1f1a) !important;
}
body.blog #main > article .post-thumbnail img,
body.archive #main > article .post-thumbnail img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}

/* Placeholder cuando no hay imagen */
body.blog #main > article .post-thumbnail-placeholder,
body.archive #main > article .post-thumbnail-placeholder {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: -1.5rem -1.5rem 1.2rem !important;
  width: calc(100% + 3rem) !important;
  aspect-ratio: 16/10 !important;
  background: linear-gradient(135deg, #161616, #0d1f1a) !important;
  font-size: 0.85rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.3em !important;
  color: rgba(0,223,171,0.25) !important;
}
body.blog #main > article .post-thumbnail-placeholder::after,
body.archive #main > article .post-thumbnail-placeholder::after {
  content: 'RENDEMY';
}

/* Meta */
body.blog #main > article .entry-meta,
body.archive #main > article .entry-meta {
  display: block !important;
  font-size: 0.7rem !important;
  color: #00dfab !important;
  text-transform: uppercase !important;
  letter-spacing: 0.15em !important;
  font-weight: 600 !important;
  margin: 0 0 0.7rem !important;
  padding: 0 !important;
}
body.blog #main > article .entry-meta a,
body.archive #main > article .entry-meta a {
  color: #00dfab !important;
  text-decoration: none !important;
}

/* Header / titulo - tamaño correcto para card de ancho normal */
body.blog #main > article .entry-header,
body.archive #main > article .entry-header {
  display: block !important;
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 0 0.8rem !important;
  text-align: left !important;
}
body.blog #main > article .entry-title,
body.archive #main > article .entry-title {
  font-size: 1.25rem !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  letter-spacing: -0.015em !important;
  color: #fff !important;
  margin: 0 !important;
  word-wrap: normal !important;
  overflow-wrap: normal !important;
}
body.blog #main > article .entry-title a,
body.archive #main > article .entry-title a {
  color: #fff !important;
  text-decoration: none !important;
  background: none !important;
}
body.blog #main > article .entry-title a:hover,
body.archive #main > article .entry-title a:hover {
  color: #00dfab !important;
}

/* Extracto */
body.blog #main > article .entry-summary,
body.archive #main > article .entry-summary,
body.blog #main > article .entry-content,
body.archive #main > article .entry-content {
  display: block !important;
  font-size: 0.9rem !important;
  color: #888 !important;
  line-height: 1.6 !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
}
body.blog #main > article .entry-summary p,
body.archive #main > article .entry-summary p,
body.blog #main > article .entry-content p,
body.archive #main > article .entry-content p {
  font-size: 0.9rem !important;
  color: #888 !important;
  line-height: 1.6 !important;
  margin: 0 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}

/* Ocultar autor, categorias, leer mas */
body.blog #main .entry-meta .byline,
body.blog #main .entry-meta .author,
body.archive #main .entry-meta .byline,
body.archive #main .entry-meta .author,
body.blog #main .entry-footer,
body.archive #main .entry-footer,
body.blog #main .cat-links,
body.archive #main .cat-links,
body.blog #main .read-more,
body.archive #main .read-more,
body.blog #main .more-link,
body.archive #main .more-link {
  display: none !important;
}

/* Paginacion ocupa todo el grid */
body.blog .navigation.pagination,
body.archive .navigation.pagination,
body.blog #main .navigation.pagination,
body.archive #main .navigation.pagination {
  grid-column: 1 / -1 !important;
  text-align: center !important;
  padding: 3rem 0 0 !important;
  border-top: 1px solid rgba(255,255,255,0.06) !important;
  margin-top: 2rem !important;
}

/* Responsive */
@media (max-width: 1000px) {
  body.blog #main,
  body.archive #main {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 1.5rem !important;
  }
}
@media (max-width: 600px) {
  body.blog #main,
  body.archive #main {
    grid-template-columns: 1fr !important;
    gap: 1.5rem !important;
  }
  body.blog #primary,
  body.archive #primary {
    padding: 0 1.5rem 4rem !important;
  }
}
