.grid{--gap:1.6rem; display:flex; flex-wrap:wrap; justify-content:center; gap:var(--gap)}
.grid > .card{flex:0 0 calc((100% - 3 * var(--gap)) / 4)}
.card{background:var(--white); box-shadow:0 2px 18px rgba(0,0,0,.14); border-radius:4px; overflow:hidden; text-align:center; display:flex; flex-direction:column; transition:transform .3s, box-shadow .3s; min-width:0}
.card:hover{transform:translateY(-4px); box-shadow:0 10px 26px rgba(0,0,0,.2)}
.card .ph{display:block; aspect-ratio:4/5; overflow:hidden; background:var(--navy)}
.card .ph img{width:100%; height:100%; object-fit:cover; display:block; transform:scale(var(--zoom, 1)); transform-origin:var(--pos-x, 50%) var(--pos-y, 50%); object-position:var(--pos-x, 50%) var(--pos-y, 50%); transition:transform .5s ease-out}
.card:hover .ph img{transform:scale(calc(var(--zoom, 1) * 1.05))}
.card .body{padding:1.1rem 1rem 1.4rem; display:flex; flex-direction:column; align-items:center; gap:.7rem; flex:1}
.card h4{font-size:1.15rem; color:var(--head)}
.card h4 a{text-decoration:none}
.soc{display:flex; gap:.35rem; justify-content:center; flex-wrap:wrap}
.soc .red-badge{display:grid; place-items:center; width:30px; height:30px; border-radius:50%; background:var(--head); color:var(--white); overflow:hidden}
.soc .red-icon{width:16px; height:16px; display:block; fill:currentColor}
.soc .red-badge text{font-size:8px; font-family:Arial, sans-serif; fill:currentColor}
.fol{font-family:var(--display); font-size:1.9rem; color:var(--blue); line-height:1.1; margin-top:auto}
.fol small{display:block; font-family:var(--body); font-size:.7rem; color:var(--text)}
@media (max-width:980px){ .grid > .card{flex-basis:calc((100% - var(--gap)) / 2)} }
@media (max-width:560px){ .grid{--gap:.8rem} }
.filtros{display:flex; flex-wrap:wrap; gap:1rem 1.6rem; align-items:flex-end; justify-content:center; margin:-1.2rem 0 2rem}
.chips{display:flex; flex-wrap:wrap; gap:.5rem; justify-content:center}
.chip{font:inherit; font-size:.82rem; padding:.35rem .9rem; border-radius:999px; border:2px solid var(--blue); background:transparent; color:var(--head); cursor:pointer; transition:background .2s, color .2s}
.chip:hover{background:rgba(46,163,242,.12)}
.chip[aria-pressed="true"]{background:var(--blue); color:var(--white)}
.selects{display:flex; gap:.8rem; flex-wrap:wrap; justify-content:center}
.selects label{display:grid; gap:.25rem; font-size:.72rem; text-transform:uppercase; letter-spacing:.05em; color:var(--text)}
.selects select{font:inherit; font-size:.9rem; padding:.45rem .7rem; border-radius:4px; border:1px solid rgba(0,0,0,.25); background:var(--white); color:var(--head); text-transform:none; letter-spacing:0}
.filtro-estado{text-align:center; min-height:1.4em; margin:-.8rem 0 1.2rem; font-size:.85rem; color:var(--text)}
.sin-resultados{flex:1 1 100%; text-align:center; color:var(--text)}