/* ===== CREW VIEW ===== */

.crew-wrap{ max-width:925px; margin:22px auto 28px; padding:0 16px; }
.crew-wrap .intro{ text-align:center; max-width:62ch; margin:0 auto 18px; }
.crew-grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

@media (max-width: 900px){
  .crew-grid{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px){
  .crew-grid{ grid-template-columns: 1fr; }
}

/* Card frame */
.pet-card{
  background:#fcfcfb;
  border-radius:14px;
  outline:1px solid rgba(0,0,0,.04);
  border:1px solid rgba(167,124,207,.18);
  box-shadow:0 4px 12px rgba(70,56,104,.10);
  padding:10px;
  text-align:center;
  transition: transform .12s ease, box-shadow .18s ease;
}
/* Square image well */
.pet-card .thumb{
  width:100%;
  aspect-ratio: 1 / 1;
  border:1px solid rgba(0,0,0,.06);
  border-radius:12px;
  display:flex; align-items:center; justify-content:center;
  overflow:hidden;
  background:
    radial-gradient(var(--dot) .8px, transparent 1.2px),
    var(--bg);
  background-size:14px 14px;
}

/* Pet image */
.pet-card .thumb img{
  max-width:88%;
  max-height:88%;
  object-fit:contain;
  display:block;
}

/* Caption */
.pet-card figcaption{ margin-top:8px; line-height:1.35; }
.pet-name{ font-weight:700; color:var(--text); }

/* Species tag */
.pet-tag{
  font-family:'Raleway',system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  font-size:11px; font-weight:700; letter-spacing:.4px;
  text-transform:uppercase; color:#333;
  background:rgba(255,255,255,.55);
  border:1px solid rgba(0,0,0,.08);
  border-radius:999px; padding:2px 8px;
}

.breeder{
  font-style: italic;
  color: var(--text-muted, #555);
  font-size: 0.9em;
}	

.pager{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:6px;
  margin:14px 0 18px;
  font-family:'Raleway', system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}

.pager a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:32px;
  height:32px;
  padding:0 8px;
  border-radius:999px;
  text-decoration:none;
  color:#333;
  background:rgba(255,255,255,.55);
  border:1px solid rgba(0,0,0,.08);
  box-shadow:0 4px 12px rgba(70,56,104,.10);
}

.pager a:hover{
  filter:brightness(1.03);
  transform:translateY(-1px);
}

.pager-simple{
  display:flex;
  gap:.75rem;
  align-items:center;
  justify-content:center;
  margin:1rem 0;
}

.pager-simple .pager-status{
  font-size:0.95rem;
  opacity:0.85;
}

.pager-simple .disabled{
  opacity:0.4;
  pointer-events:none;
}

.pet-meta {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
}

.gallery-link {
  display: inline-block;
  font-size: 0.9em;
}
