/* Compact professional workbench pass for the project office page. */
main { padding-bottom: 18px; }

.hero {
  grid-template-columns: minmax(0, 1fr) minmax(360px, 0.72fr);
  gap: 14px;
  align-items: start;
  padding: 22px 22px 12px;
}

.hero h1 {
  font-size: clamp(2rem, 3.4vw, 3.9rem);
  line-height: 1;
}

.lead {
  max-width: 760px;
  margin: 10px 0 0;
  font-size: .98rem;
  line-height: 1.45;
}

.flow-board {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  align-self: stretch;
}

.flow-board div {
  grid-template-columns: 42px minmax(0, 1fr);
  min-height: 56px;
}

.flow-board span { font-size: .86rem; }

.flow-board b {
  padding: 10px 9px;
  font-size: .9rem;
  line-height: 1.2;
}

.cad-promo {
  margin-bottom: 12px;
  padding: 12px 14px;
}

.cad-promo b { font-size: 1rem; }

.cad-promo p {
  margin-top: 3px;
  font-size: .92rem;
}

.kpi-row {
  gap: 10px;
  padding-bottom: 12px;
}

.kpi-row article { padding: 10px 12px; }
.kpi-row b { font-size: 1.12rem; }

.departments {
  gap: 10px;
  padding-bottom: 14px;
}

.department { padding: 12px; }
.department h3 { font-size: .96rem; }

.department p {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-size: .84rem;
}

.workspace {
  grid-template-columns: 210px minmax(0, 1fr) 360px;
  gap: 12px;
}

.rail,
.panel,
.review,
.library { padding: 12px; }

.panel h2,
.review h2 { font-size: 1.32rem; }

.panel p { margin-top: 0; }
.review { top: 76px; }

@media (max-width: 1180px) {
  .hero,
  .workspace { grid-template-columns: 1fr; }
  .flow-board { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .review,
  .rail { position: static; }
}

@media (max-width: 720px) {
  .hero { padding: 16px 12px 10px; }
  .hero h1 { font-size: 2rem; }
  .flow-board { grid-template-columns: 1fr; }
  .flow-board div { grid-template-columns: 52px minmax(0, 1fr); }
}
