/* /proyectos — solo lo que la portada no trae. El resto (tarjetas, chips, botones) viene de style.css. */
/* style.css pone overflow-x: hidden en html y body, y eso rompe position: sticky (body pasa a ser un contenedor de scroll).
   `clip` corta igual el desborde sin serlo; los navegadores antiguos que no lo entienden se quedan con hidden. */
html, body { overflow-x: hidden; overflow-x: clip; }

.proyectos-page { padding-top: clamp(96px, 14vw, 140px); }
.volver {
  display: inline-flex; align-items: center; min-height: 44px; margin-bottom: 10px;
  font-size: 13.5px; font-weight: 600; color: var(--muted-2);
}
.volver:hover { color: var(--white); }

/* Buscador y géneros se quedan a la vista al bajar por los 63 proyectos */
.proyectos-page .catalog-controls {
  position: sticky; top: 52px; z-index: 20;
  margin: 0 calc(-1 * clamp(20px, 4vw, 56px)) 26px; padding: 12px clamp(20px, 4vw, 56px);
  background: rgba(5, 5, 5, 0.97);   /* casi opaco: las tarjetas que pasan por debajo no deben leerse a través */
  -webkit-backdrop-filter: blur(14px) saturate(140%); backdrop-filter: blur(14px) saturate(140%);
  border-bottom: 1px solid var(--border);
}
.proyectos-page .catalog-search { font-size: 16px; }          /* 16 px: Safari no hace zoom al enfocar */
.proyectos-page .chip { min-height: 40px; }
.proyectos-page .filters { touch-action: manipulation; }

.acciones-cta { display: flex; flex-wrap: wrap; gap: 14px; justify-content: center; }
.cta-strip .container { display: flex; flex-direction: column; align-items: center; }

@media (max-width: 640px) {
  /* En el móvil los géneros van en una fila que se desliza, no en 3 filas que tapan la lista */
  .proyectos-page .filters { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; padding-bottom: 2px; }
  .proyectos-page .filters::-webkit-scrollbar { display: none; }
  .proyectos-page .chip { flex: none; }
  .proyectos-page .catalog-controls { flex-direction: column; align-items: stretch; gap: 10px; }
  .proyectos-page .catalog-search { max-width: none; flex: none; width: 100%; }
}