.elementor-22285 .elementor-element.elementor-element-84a76cf{--display:flex;}/* Start custom CSS for shortcode, class: .elementor-element-22fb2a6 */.fancy-cat-grid {
  display:grid; grid-template-columns:repeat(4,1fr); gap:24px; margin:40px auto;
}
@media (max-width:1024px){ .fancy-cat-grid{ grid-template-columns:repeat(3,1fr);} }
@media (max-width:768px){ .fancy-cat-grid{ grid-template-columns:repeat(2,1fr);} }
@media (max-width:480px){ .fancy-cat-grid{ grid-template-columns:1fr;} }

.fancy-cat-card {
  background:#fff; border:1px solid #e5e5e5; border-radius:10px; overflow:hidden;
  text-align:center; text-decoration:none; box-shadow:0 2px 8px rgba(0,0,0,.05);
  transition:transform .2s ease, box-shadow .2s ease;
}
.fancy-cat-card:hover { transform:translateY(-3px); box-shadow:0 6px 16px rgba(0,0,0,.1); }
.fancy-cat-thumb { background:#f8f8f8; }
.fancy-cat-thumb img { width:100%; height:220px; object-fit:contain; }
.fancy-cat-info { padding:12px 10px 16px; }
.fancy-cat-title { font-size:16px; font-weight:600; margin:0 0 4px; color:#111; }
.fancy-cat-count { font-size:13px; color:#666; }

/* ==============================================
   FANCY PAGINATION — unified pill styling
   (works for both fp-* custom markup and WP page-numbers)
   ============================================== */

.fancy-pagination{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:16px;
  margin:28px 0 8px;
  flex-wrap:wrap;
}

/* "Pages:" label */
.fancy-pagination::before{
  content:"Pages:";
  font-weight:700;
  color:#374151;
  font-size:18px;
}

/* ========== CUSTOM MARKUP (.fp-*) ========== */

.fancy-pagination .fp-pages{
  display:inline-flex;
  gap:12px;
  list-style:none;
  margin:0;
  padding:0;
}

.fancy-pagination .fp-pages a,
.fancy-pagination .fp-pages .current,
.fancy-pagination .fp-prev,
.fancy-pagination .fp-next{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:44px;
  height:36px;
  padding:0 14px;
  border-radius:10px;
  background:#2f343a;
  color:#fff;
  text-decoration:none;
  font-weight:700;
  font-size:16px;
  line-height:1;
  border:none;
  transition:filter .2s ease;
}

.fancy-pagination .fp-pages a:hover,
.fancy-pagination .fp-prev:hover,
.fancy-pagination .fp-next:hover{ filter:brightness(1.15); }

.fancy-pagination .fp-pages .current{
  background:#3b82f6; /* active blue */
}

.fancy-pagination .fp-prev.is-disabled,
.fancy-pagination .fp-next.is-disabled{
  display:none !important; /* auto-hide when disabled */
}

/* ========== WP paginate_links() markup ========== */
/* <ul class="page-numbers"> … </ul> */

.fancy-pagination ul.page-numbers{
  display:inline-flex !important;
  gap:12px;
  list-style:none;
  margin:0;
  padding:0;
  border:0 !important;
}

.fancy-pagination ul.page-numbers li{ margin:0; padding:0; }

.fancy-pagination ul.page-numbers li a.page-numbers,
.fancy-pagination ul.page-numbers li span.page-numbers{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:44px;
  height:36px;
  padding:0 14px;
  border-radius:10px;
  background:#2f343a;
  color:#fff;
  text-decoration:none;
  font-weight:700;
  font-size:16px;
  line-height:1;
  border:none;
  transition:filter .2s ease;
}

.fancy-pagination ul.page-numbers li a.page-numbers:hover{
  filter:brightness(1.15);
}

.fancy-pagination ul.page-numbers li span.current{
  background:#3b82f6;
  color:#fff;
}

/* Dots (...): keep minimal, no pill */
.fancy-pagination ul.page-numbers li span.dots{
  background:transparent;
  color:#4b5563;
  padding:0 6px;
  min-width:auto;
  height:auto;
  font-weight:700;
}

/* Prev/Next in WP markup */
.fancy-pagination ul.page-numbers li a.prev,
.fancy-pagination ul.page-numbers li a.next{
  /* already styled as pills by the shared rule above */
}

.fancy-pagination ul.page-numbers li span.prev,
.fancy-pagination ul.page-numbers li span.next{
  display:none; /* WP outputs span when disabled — hide it */
}

/* ===== Responsive tweaks ===== */
@media (max-width:640px){
  .fancy-pagination{ gap:10px; }
  .fancy-pagination::before{ font-size:16px; }

  .fancy-pagination .fp-pages,
  .fancy-pagination ul.page-numbers{
    gap:10px;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    white-space:nowrap;
  }

  .fancy-pagination .fp-pages a,
  .fancy-pagination .fp-pages .current,
  .fancy-pagination .fp-prev,
  .fancy-pagination .fp-next,
  .fancy-pagination ul.page-numbers li a.page-numbers,
  .fancy-pagination ul.page-numbers li span.page-numbers{
    min-width:38px;
    height:32px;
    padding:0 10px;
    font-size:14px;
    border-radius:8px;
  }
}/* End custom CSS */