/* culture.css */
.mvv-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 1.5rem;
}
.mvv-card h3 { font-size: 1.25rem; margin-bottom: 0.5rem; }

.mascot-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 1.5rem;
}
.mascot-card { text-align: center; padding: 1.5rem; }
.mascot-art {
  width: 200px; height: 200px;
  margin: 0 auto 1rem;
  display: grid; place-items: center;
  border-radius: var(--radius-lg);
  background: linear-gradient(135deg, rgba(0,102,255,0.06), rgba(255,184,0,0.06));
}
.mascot-art img { width: 100%; height: 100%; object-fit: contain; }
.mascot-card h3 { font-size: 1.25rem; }
.mascot-role { color: var(--color-brand-500); font-weight: 600; font-size: 0.85rem; text-transform: uppercase; letter-spacing: 0.1em; margin-bottom: 0.5rem; }

.office-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.25rem;
}
@media (max-width: 800px) { .office-grid { grid-template-columns: 1fr; } }
.office-img {
  width: 100%;
  aspect-ratio: 16/9;
  object-fit: cover;
  border-radius: var(--radius-lg);
  border: 1px solid rgba(255,255,255,0.08);
}