/* collaborations.css */
/* Keeps the same overall design language from home.css, just adds page-specific layout tweaks */

.collaborations-hero-image img {
  /* home.css sets hero images very large; this keeps the booklet looking like a "featured asset" */
  width: 100%;
  max-width: 400px;
  max-height: 500px;
  border-radius: 12px;
  box-shadow: 0px 10px 8px #888888;
}

.collaborations-hero-text {
  color: rgb(43, 37, 37);
  margin-top: 10px;
}

.collaborations-heading {
  color: var(--dark-color);
  margin-bottom: 30px;
}

.collaborations-grid {
  display: grid;
  grid-template-columns: 1fr;
  justify-items: center;
  gap: 8px;
}

.collaborations-card {
  max-width: 520px; 
  background: transparent;
  text-align: center;
}

.collaborations-booklet {
  display: block;
  width: 100%;
  border-radius: 12px;
  max-width: 200px;
  
  background: transparent;
}

.collaborations-name {
  margin-top: 6px;
}

.collaborations-subtitle {
  color: var(--gray);
}