/* Friki Catálogo · estilos básicos (el tema Friki Factoría los afina). Valen también con otros temas. */

/* Rejilla de etiquetas */
.ffc-tags { display: grid; grid-template-columns: repeat(var(--ffc-cols, 4), minmax(0, 1fr)); gap: 10px; margin-block: 1.5em; }
@media (max-width: 900px) { .ffc-tags { grid-template-columns: repeat(min(var(--ffc-cols, 4), 3), minmax(0, 1fr)); } }
@media (max-width: 600px) { .ffc-tags { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; } }
.ffc-tag { position: relative; display: block; overflow: hidden; aspect-ratio: 2 / 3; background: #f3f2ef; color: #fff; text-decoration: none !important; }
.ffc-tag img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s ease; }
.ffc-tag:hover img { transform: scale(1.04); }
.ffc-tag::after { content: ""; position: absolute; inset: 50% 0 0; background: linear-gradient(transparent, rgba(0, 0, 0, 0.6)); pointer-events: none; }
.ffc-tag__name { position: absolute; left: 14px; right: 14px; bottom: 12px; z-index: 1; color: #fff; font-weight: 800; font-size: clamp(15px, 1.5vw, 21px); line-height: 1.1; letter-spacing: -0.01em; }
.ffc-tag:focus-visible { outline: 3px solid #ffb900; outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) { .ffc-tag img { transition: none; } }

/* Filtro de hijas (autores…) en la etiqueta madre */
.ffc-filter { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 0 0 20px; }
.ffc-filter__title { font-size: 12px; text-transform: uppercase; letter-spacing: 0.08em; color: #6b6b6b; margin-right: 6px; }
.ffc-filter a { display: inline-flex; align-items: baseline; gap: 5px; padding: 7px 13px; border: 1px solid #d9d7d2; border-radius: 999px; font-size: 14px; line-height: 1.2; color: #0e0e0e; text-decoration: none; background: #fff; }
.ffc-filter a small { font-size: 11px; color: #6b6b6b; }
.ffc-filter a:hover { border-color: #0e0e0e; }
.ffc-filter a.is-active { background: #0e0e0e; border-color: #0e0e0e; color: #fff; }
.ffc-filter a.is-active small { color: #bdbdbd; }

/* Texto SEO al final */
.ffc-seo { clear: both; max-width: 780px; margin: 48px auto 24px; font-size: 15px; line-height: 1.65; color: #3d3d3d; }
.ffc-seo h2 { font-size: 1.4em; margin: 1.2em 0 0.5em; color: #0e0e0e; }
.ffc-seo h3 { font-size: 1.15em; margin: 1.1em 0 0.4em; color: #0e0e0e; }

/* Editor del bloque: hijas con sangría; los enlaces de la vista previa no se siguen al hacer clic. */
.ffc-ed-child { margin-left: 22px; }
.block-editor-block-list__block .ffc-tags a { pointer-events: none; }