.hub-page { padding-block: 36px 76px; }
.hub-heading { max-width: 760px; margin-bottom: 34px; }
.hub-heading .project-subtitle { max-width: 640px; }
.hub-featured { padding-bottom: 38px; border-bottom: 1px solid var(--line); }
.hub-feature { display: grid; grid-template-columns: minmax(0, 1.18fr) minmax(0, 1fr); align-items: center; gap: 44px; text-decoration: none; }
.hub-feature-media { min-width: 0; overflow: hidden; background: #111; }
.hub-feature-media img { width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: contain; }
.hub-feature-copy { min-width: 0; padding-block: 12px; }
.hub-feature-copy h2 { margin-bottom: 17px; font-size: 32px; line-height: 1.22; }
.hub-feature-copy > p:not(.eyebrow) { max-width: 520px; color: var(--muted); }
.hub-feature-copy .hub-project-discipline { margin-block: 22px 18px; color: var(--muted); font-size: 15px; }
.hub-card-action { display: inline-flex; align-items: center; gap: 12px; font-size: 17px; text-decoration: underline; text-underline-offset: 5px; text-decoration-thickness: 1px; }
.hub-card-action > span { display: inline-block; transition: transform .18s ease; }
.hub-feature:hover .hub-card-action > span, .hub-card:hover .hub-card-action > span { transform: translateX(4px); }
.hub-feature:hover h2, .hub-card:hover h2 { color: var(--accent); }
.hub-project-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 38px; padding-top: 36px; }
.hub-project { min-width: 0; }
.hub-card { display: flex; flex-direction: column; align-items: flex-start; height: 100%; color: var(--ink); text-decoration: none; }
.hub-card-placeholder.project-lock-placeholder { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 11px; width: 100%; height: 178px; min-height: 178px; margin: 0 0 23px; padding: 22px; border: 1px solid var(--line); background: #131313; color: var(--muted); grid-column: auto; grid-row: auto; }
.hub-card-placeholder .private-nav-lock { width: 22px; height: 25px; }
.hub-card-placeholder .project-lock-label { font-size: 15px; }
.hub-card > .eyebrow { margin-bottom: 9px; }
.hub-card h2 { margin-bottom: 10px; font-size: 26px; line-height: 1.25; }
.hub-card > p { max-width: 510px; margin-bottom: 18px; color: var(--muted); }
.hub-card .hub-card-action { margin-top: auto; }
@media (max-width: 900px) {
  .hub-feature { gap: 28px; }
  .hub-feature-copy h2 { font-size: 28px; }
  .hub-project-grid { gap: 28px; }
}
@media (max-width: 700px) {
  .hub-page { padding-block: 28px 48px; }
  .hub-heading { margin-bottom: 26px; }
  .hub-feature { grid-template-columns: minmax(0, 1fr); gap: 17px; }
  .hub-featured { padding-bottom: 28px; }
  .hub-feature-copy { padding: 0; }
  .hub-feature-copy h2 { font-size: 27px; }
  .hub-feature-copy .hub-project-discipline { margin-block: 17px 14px; }
  .hub-project-grid { grid-template-columns: minmax(0, 1fr); gap: 32px; padding-top: 28px; }
  .hub-card-placeholder.project-lock-placeholder { height: 150px; min-height: 150px; margin-bottom: 20px; }
  .hub-card h2 { font-size: 25px; }
}
@media (prefers-reduced-motion: reduce) {
  .hub-card-action > span { transition: none; }
}