/* ===== Contenedor y encabezado ===== */
.archive-wrap{max-width:1200px;margin:0 auto;padding:24px}
.archive-head,.archive-header{margin:8px 0 20px}
.archive-title{font-size:28px;font-weight:800;margin:0}
.archive-desc{color:#6b7280;margin:6px 0 18px}

/* ===== Grid (alias para ambas marcas) ===== */
.cards-grid,
.archive-grid{
  display:grid;
  grid-template-columns:repeat(1,minmax(0,1fr));
  gap:28px;
}
@media (min-width:768px){
  .cards-grid,.archive-grid{grid-template-columns:repeat(2,1fr)}
}
@media (min-width:1100px){
  .cards-grid,.archive-grid{grid-template-columns:repeat(3,1fr)}
}

/* ===== Card base ===== */
.post-card{
  background:#fff;
  border-radius:14px;
  overflow:hidden;
  box-shadow:0 2px 10px rgba(0,0,0,.06);
  transition:transform .2s ease, box-shadow .2s ease;
}
.post-card:hover{
  transform:translateY(-2px);
  box-shadow:0 6px 16px rgba(0,0,0,.1)
}

/* ===== Enlaces (card completa o sólo el título) ===== */
.card-link{display:block;color:inherit;text-decoration:none}
.card-link:hover .card-title{color:#0b56d5}
.post-card__title a{color:#101828;text-decoration:none}
.post-card__title a:hover{text-decoration:underline}

/* ===== Media ===== */
.card-thumb img,
.post-card__thumb img{
  display:block;
  width:100%;
  height:210px;               /* altura consistente */
  object-fit:cover;
}

/* ===== Body ===== */
.card-body,
.post-card__body{padding:16px}

/* ===== Badge/Categoría ===== */
.badge,
.post-card__cat{
  display:inline-block;
  background:#192EEC;
  color:#fff;
  border-radius:999px;
  padding:4px 10px;
  font-size:12px;
  font-weight:700;
  margin-bottom:8px
}

/* ===== Título / Meta / Extracto ===== */
.card-title,
.post-card__title{
  font-size:18px;
  line-height:1.25;
  margin:6px 0 8px;
  font-weight:800;
  color:#101828
}

.card-meta,
.post-card__meta{
  font-size:12px;
  color:#6b7280;
  margin-bottom:8px
}

.card-excerpt,
.post-card__excerpt{
  font-size:14px;
  color:#374151;
  margin:0
}

/* ===== Paginación ===== */
.archive-pager{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  justify-content:center;
  margin:28px 0
}
.archive-pager .page-numbers{
  padding:8px 12px;
  border:1px solid #e5e7eb;
  border-radius:8px;
  text-decoration:none;
  color:#111
}
.archive-pager .current{
  background:#192EEC;
  color:#fff;
  border-color:#192EEC
}

/* (Opcional) limitar estilos a la tax de artículos */
/* .tax-categoria_de_articulos .cards-grid,
   .tax-categoria_de_articulos .archive-grid{display:grid} */



/* (Opcional) limitar estilos a la tax de artículos */
/* .tax-categoria_de_articulos .cards-grid,
   .tax-categoria_de_articulos .archive-grid{display:grid} */

/* ===== Encabezado + migas ===== */
.breadcrumbs{
  display:flex; flex-wrap:wrap; gap:8px; align-items:center;
  font-size:14px; color:#6b7280; margin-bottom:6px;
}
.breadcrumbs a{
  background:#E0E0E0; color:#555; font-weight:500; text-decoration:none;
  border-radius:15px; padding:4px 10px; white-space:nowrap;
}
.breadcrumbs a:hover{ background:#172EEB; color:#fff }

/* título grande + contador */
.archive-title{ display:flex; align-items:center; gap:10px; font-size:32px }
.archive-count{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:28px; height:28px; padding:0 8px; border-radius:999px;
  background:#eef2ff; color:#192EEC; font-weight:800; font-size:14px
}

/* compartir */
.share-list{ display:flex; gap:8px; margin:12px 0 4px }
.share-btn{
  width:36px; height:36px; border-radius:50%;
  background:#192EEC; display:inline-flex; align-items:center; justify-content:center
}
.share-btn svg{ width:18px; height:18px; fill:#fff }

/* ===== Layout 2 columnas (grid + sidebar) ===== */
.archive-2col{ display:grid; grid-template-columns:1fr; gap:32px }
@media (min-width:1100px){
  .archive-2col{ grid-template-columns:minmax(0,1fr) 320px }
}
.archive-sidebar.sticky{ position:sticky; top:90px } /* ajusta si tu header varía */

/* ===== Sidebar widgets ===== */
.sb-widget{
  background:#fff; border-radius:12px; box-shadow:0 2px 10px rgba(0,0,0,.06);
  padding:14px 14px 8px; margin-bottom:18px
}
.sb-title{ margin:0 0 10px; font-size:18px; font-weight:800; color:#101828 }
.sb-list{ list-style:none; padding:0; margin:0 }
.sb-item{ display:flex; gap:12px; align-items:center; padding:8px 0 }
.sb-link{ display:flex; gap:12px; align-items:center; text-decoration:none; color:inherit }
.sb-thumb img{ width:88px; height:66px; object-fit:cover; border-radius:8px; display:block }
.sb-item-title{ display:block; font-size:14px; font-weight:700; line-height:1.25; color:#101828 }
.sb-item-date{ display:block; font-size:12px; color:#6b7280 }

/* ===== Paginación (ya tienes base) – asegura consistencia en el <ul> de paginate_links() ===== */
.archive-pager ul{ display:flex; gap:8px; flex-wrap:wrap; justify-content:center; padding:0; margin:28px 0; list-style:none }
.archive-pager li a, .archive-pager li span{
  padding:8px 12px; border:1px solid #e5e7eb; border-radius:8px; text-decoration:none; color:#111; display:inline-block
}
.archive-pager li .current{ background:#192EEC; color:#fff; border-color:#192EEC }


/* ===== Encabezado mejorado ===== */
.archive-title--emph{
  font-size:34px;
  font-weight:800;
  letter-spacing:-.2px;
  margin-top:6px;
}

/* ===== Breadcrumbs (Rank Math) ===== */
.crumbs{margin:4px 0 10px}
.crumbs a{
  background:#E0E0E0;border-radius:14px;padding:4px 10px;
  color:#555;text-decoration:none;font-size:12px;font-weight:500;white-space:nowrap
}
.crumbs span{color:#7D7F8A}
.crumbs a:hover{background:#172EEB;color:#fff}

/* ===== Share del archivo ===== */
.archive-share{display:flex;gap:8px;margin:8px 0 6px}
.archive-share .share{
  width:32px;height:32px;border-radius:50%;
  background:#002990;color:#fff;display:flex;align-items:center;justify-content:center;
  text-decoration:none;transition:opacity .2s ease
}
.archive-share .share:hover{opacity:.85}

/* ===== Layout 2 columnas ===== */
.archive-row{display:grid;grid-template-columns:1fr;gap:28px}
@media (min-width:1024px){
  .archive-row{grid-template-columns:3fr 1.2fr}
}
.archive-main{min-width:0}

/* ===== Sidebar ===== */
.archive-sidebar{position:relative}
.sidebar-widget{
  background:#fff;border-radius:12px;padding:14px;margin-bottom:18px;
  box-shadow:0 2px 10px rgba(0,0,0,.06)
}
.sidebar-title{font-size:16px;font-weight:800;margin:0 0 10px}
.mini-list{list-style:none;margin:0;padding:0}
.mini-item + .mini-item{margin-top:12px}
.mini-link{display:flex;gap:12px;text-decoration:none;color:inherit}
.mini-thumb img{display:block;width:86px;height:64px;object-fit:cover;border-radius:6px}
.mini-meta{display:flex;flex-direction:column;gap:4px}
.mini-title{font-size:14px;font-weight:700;line-height:1.25}
.mini-date{font-size:12px;color:#6b7280}

/* ===== Paginación WP por defecto ===== */
.navigation.pagination{margin:28px 0;display:flex;justify-content:center}
.navigation.pagination .page-numbers{
  padding:8px 12px;border:1px solid #e5e7eb;border-radius:8px;text-decoration:none;color:#111;margin:0 4px
}
.navigation.pagination .current{background:#192EEC;color:#fff;border-color:#192EEC}


/* ===== Título del término más protagonista */
.archive-title--emph{
  font-size: 36px;
  font-weight: 800;
  letter-spacing: -.2px;
  margin: 6px 0 12px;
}
.archive-title--emph::after{
  content: "";
  display: block;
  width: 160px;
  height: 4px;
  background: #192EEC;
  border-radius: 999px;
  margin-top: 6px;
}

/* ===== Breadcrumbs (píldoras) */
.crumbs{margin: 4px 0 12px; display:flex; flex-wrap:wrap; gap:6px; align-items:center;}
.crumbs a{
  background:#E0E0E0; border-radius:14px; padding:4px 10px;
  color:#555; text-decoration:none; font-size:12px; font-weight:500; white-space:nowrap;
}
.crumbs .sep{margin:0 4px; color:#7D7F8A}
.crumbs span{color:#7D7F8A}
.crumbs a:hover{background:#172EEB; color:#fff}

/* ===== Grid: 2 columnas en desktop */
.cards-grid{
  display:grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: 28px;
}
@media (min-width: 768px){
  .cards-grid{ grid-template-columns: repeat(2, 1fr); }
}
/* (si tenías una regla a 3 columnas, esto la sobreescribe al ir al final del CSS) */

/* ===== Layout 2 columnas con sidebar sticky */
.archive-row{ display:grid; grid-template-columns: 1fr; gap: 28px; }
@media (min-width:1024px){
  .archive-row{ grid-template-columns: 3fr 1.2fr; }
}
.archive-main{ min-width:0; }

/* Sticky puro CSS para la barra lateral */
.archive-sidebar{
  position: sticky;
  top: 100px;          /* ajusta si tu header es más alto */
  align-self: start;
}

/* ===== Paginación numerada (WP) */
.navigation.pagination{ margin: 28px 0; display:flex; justify-content:center; gap:8px; flex-wrap:wrap; }
.navigation.pagination .page-numbers{
  padding:8px 12px; border:1px solid #e5e7eb; border-radius:8px;
  text-decoration:none; color:#111;
}
.navigation.pagination .current{
  background:#192EEC; color:#fff; border-color:#192EEC;
}
.navigation.pagination .prev, 
.navigation.pagination .next{ font-weight:700; }


/* Layout 2 columnas + gap */
.archive-layout{
  display:flex;
  gap:30px;
  align-items:flex-start;     /* no uses space-between aquí */
}

/* Columna principal */
.archive-main{
  flex:1 1 0;
  min-width:0;
}

/* Columna sidebar */
.archive-sidebar{
  flex:0 0 35%;
  max-width:420px;
  min-width:300px;
}

/* Fallback: si el navegador soporta sticky nativo */
@supports (position: sticky){
  .sticky-widget{
    position: sticky;
    top: var(--sticky-top, 120px);  /* se recalcula por JS */
  }
}

/* Evitar que algún contenedor corte el sticky */
.archive-layout, .archive-main, .archive-sidebar { overflow: visible; }


/* 2 columnas en desktop */
@media (min-width:1024px){
  .cards-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}

/* Paginación bonita */
.archive-pager,
ul.page-numbers{
  display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:center;
  margin:28px 0;padding:0;list-style:none;
}
.page-numbers a,.page-numbers span{
  display:inline-block;padding:8px 12px;border:1px solid #e5e7eb;border-radius:8px;
  text-decoration:none;color:#111;
}
.page-numbers .current{ background:#192EEC;color:#fff;border-color:#192EEC; }

/* Breadcrumbs consistente */
.archive-breadcrumbs{ margin:0 0 10px; }
.archive-breadcrumbs .crumbs a{
  background:#E0E0E0;color:#555;border-radius:15px;padding:5px 10px;white-space:nowrap;
  font-weight:500;font-size:12px;text-transform:capitalize;text-decoration:none;display:inline-flex;align-items:center;margin-right:6px;
}
.archive-breadcrumbs .crumbs a:hover{ background:#172EEB;color:#fff; }

/* Fila de dos columnas */
.archive-row{
  display:flex;
  gap:30px;
  /* IMPORTANTE: que ambas columnas “estiren” la altura */
  align-items:stretch;            /* antes tenías flex-start */
}

/* Columna principal */
.archive-main{
  flex:1 1 0;
  min-width:0;
}

/* Columna derecha */
.archive-sidebar{
  flex:0 0 360px;                 /* o 320–420 a tu gusto */
  max-width:420px;
  position:relative;
  align-self:stretch;             /* por si algún estilo hereda flex-start */
}

/* Sticky puro CSS como fallback */
@media (min-width:1024px){
  .sticky-widget{
    position: sticky;
    top: var(--stickyTop, 96px);  /* offset calculado por JS (abajo) */
  }
}
