/* Catálogo de proyectos como carrusel (estilo "Gallery4") */
.cat-bar { display: flex; align-items: flex-end; justify-content: space-between; gap: 1.5rem; margin-bottom: clamp(28px, 4vw, 48px); }
.cat-bar .filters { margin-bottom: 0; min-width: 0; }
.cat-arrows { display: flex; gap: .5rem; flex: none; }
.cat-arrow { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 10px; border: 0; background: transparent; color: var(--ink); cursor: pointer; transition: background-color .2s, opacity .2s; }
.cat-arrow:hover:not(:disabled) { background: rgba(255,255,255,.08); }
.cat-arrow:disabled { opacity: .3; cursor: default; }
.cat-arrow:focus-visible { outline: 2px solid var(--brand, #1a47e0); outline-offset: 2px; }

.catalog.wrap {
  --side: max(var(--gap), calc((100% - var(--wrap)) / 2));
  position: relative; display: flex; gap: 20px;
  width: 100%; max-width: none; margin: 0;
  padding: 4px var(--side) 4px; scroll-padding-inline: var(--side);
  overflow-x: auto; overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory; scrollbar-width: none;
  grid-template-columns: none;
}
.catalog::-webkit-scrollbar { display: none; }
.catalog.is-dragging { scroll-snap-type: none; cursor: grabbing; }
.catalog.is-dragging .pc__open { pointer-events: none; }

.catalog .pc { flex: 0 0 min(320px, 82vw); scroll-snap-align: start; }
@media (min-width: 1024px) { .catalog .pc { flex-basis: 360px; } }

.catalog .pc__open { position: relative; display: block; height: 27rem; border-radius: 14px; overflow: hidden; isolation: isolate; }
.catalog .pc__img { position: absolute; inset: 0; margin: 0; }
.catalog .pc__img img { width: 100%; height: 100%; aspect-ratio: auto; object-fit: cover; object-position: center; transition: transform .45s var(--ease); }
.catalog .pc__open:hover .pc__img img, .catalog .pc__open:focus-visible .pc__img img { transform: scale(1.05); }
/* degradado azul de marca, igual que el componente original */
.catalog .pc__img::after {
  content: ""; position: absolute; inset: 0; padding: 0; border-radius: 0;
  opacity: 1; transform: none; transition: none;
  background: linear-gradient(180deg, rgba(4,46,172,0) 25%, rgba(4,46,172,.45) 60%, rgba(4,46,172,.88) 100%);
  mix-blend-mode: multiply;
}
.catalog .pc__body {
  position: absolute; inset: auto 0 0 0; z-index: 1;
  display: flex; flex-direction: column; align-items: flex-start;
  padding: 24px; color: #fff;
  background: linear-gradient(180deg, rgba(0,0,0,0), rgba(0,0,0,.35));
}
@media (min-width: 768px) { .catalog .pc__body { padding: 28px; } }
.catalog .pc__name { font-size: 1.25rem; font-weight: 500; line-height: 1.2; letter-spacing: -.015em; margin-bottom: .55rem; }
.catalog .pc__desc { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: .95rem; line-height: 1.45; color: rgba(255,255,255,.9); margin-bottom: .7rem; }
.catalog .pc__meta { color: rgba(255,255,255,.72); font-size: .8rem; margin-bottom: 1.6rem; }
.catalog .pc__cta { display: inline-flex; align-items: center; gap: .5rem; font-size: .9rem; }
.catalog .pc__cta svg { transition: transform .25s var(--ease); }
.catalog .pc__open:hover .pc__cta svg, .catalog .pc__open:focus-visible .pc__cta svg { transform: translateX(4px); }
.catalog .pc__open:focus-visible { outline: 2px solid var(--brand, #1a47e0); outline-offset: -2px; }

.cat-dots { display: flex; flex-wrap: wrap; justify-content: center; gap: 2px; margin: 28px auto clamp(56px, 8vw, 110px); padding-inline: var(--gap); }
.cat-dots button { width: 22px; height: 22px; padding: 0; border: 0; background: none; cursor: pointer; display: grid; place-items: center; }
.cat-dots button::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: rgba(255,255,255,.22); transition: background-color .2s, transform .2s; }
.cat-dots button[aria-current="true"]::before { background: var(--brand, #1a47e0); transform: scale(1.15); }
.cat-dots button:focus-visible { outline: 2px solid var(--brand, #1a47e0); border-radius: 50%; }

@media (max-width: 767px) {
  .cat-arrows { display: none; }
  .catalog .pc__open { height: 25rem; }
}
@media (prefers-reduced-motion: reduce) {
  .catalog .pc__img img, .catalog .pc__cta svg { transition: none; }
}
