/*
  Portfolio / Alex Rudnicki
  Design system, visual design, and front-end code by Alex Rudnicki.
  © 2026 Alex Rudnicki. All rights reserved.
*/

.work-page-hero {
  max-width: var(--max);
  margin: 0 auto;
  padding:
    calc(var(--nav-height) + env(safe-area-inset-top) + var(--page-top-y))
    var(--side)
    var(--case-section-y);
}

.work-page-title {
  max-width: var(--measure-heading);
  margin-bottom: var(--stack-lg);
  color: var(--text);
  font-size: var(--type-page-title);
  font-weight: var(--weight-heading);
  letter-spacing: var(--tracking-display);
  line-height: var(--leading-title);
}

.work-page-lede {
  max-width: var(--measure-lede);
  color: var(--muted);
  font-size: var(--type-body-lg);
  line-height: var(--leading-body);
}

.work-page-list {
  padding-bottom: var(--case-section-y);
}

.work-page-list .section-wrap {
  padding-top: 0;
}

@media (max-width: 820px) {
  .work-page-title {
    margin-bottom: var(--stack-md);
  }

  .work-page-lede {
    max-width: var(--measure-lede-mobile);
  }
}