/* Homepage department tiles. Keep after responsive.css. */
.departments {
  background-color: #F2EBE2;
  padding-inline: max(1rem, calc((100% - 1440px) / 2));
}
.department-grid,
.enlarged-text .department-grid {
  width: 100%;
  max-width: 90rem;
  column-gap: 1.5rem;
}
@media (min-width: 70rem) {
  .departments { padding-inline: max(2rem, calc((100% - 1440px) / 2)); }
}
.department-card {
  container-type: inline-size;
}
.department-card h3 {
  gap: .5rem;
  padding: 1.125rem clamp(.75rem, 3.5cqw, 1.25rem);
  font-size: clamp(.875rem, 4.5cqw, 1.3125rem);
  line-height: 1.25;
  white-space: nowrap;
  overflow-wrap: normal;
}
.department-card h3 .icon {
  width: 1rem;
  height: 1rem;
}
@media (max-width: 22.5rem) {
  .department-card h3 { grid-template-columns: minmax(0, 1fr); }
  .department-card h3 .icon { display: none; }
}
/* Explicit text enlargement keeps full labels readable. */
.enlarged-text .department-card h3 {
  font-size: 1.3125rem;
  white-space: normal;
}

/* Matching background for the homepage education values section. */
.values { background-color: #F2EBE2; }