/* ============================================================
   work.css — Work overview page styles
   ============================================================ */

/* ── Page header ── */
.wk-header {
  padding: 120px var(--pad-page) 48px;
}
.wk-header__eyebrow {
  font-weight: 700; font-size: 11px;
  letter-spacing: 2px; text-transform: uppercase;
  color: var(--accent); margin-bottom: 16px;
  opacity: 0; animation: fadeUp .5s var(--ease-out) .1s forwards;
}
@keyframes fadeUp { to { opacity:1; transform:translateY(0); } }

.wk-header__title {
  font-family: var(--disp); font-weight: 800;
  font-size: clamp(48px, 8vw, 96px);
  letter-spacing: -.04em; line-height: .95;
  color: var(--ink); margin-bottom: 24px;
}
.wk-header__title .ln       { display: block; overflow: hidden; }
.wk-header__title .ln span  {
  display: block;
  transform: translateY(105%);
  animation: lnUp .75s var(--ease-out) .15s forwards;
}
@keyframes lnUp { to { transform: translateY(0); } }

.wk-header__sub {
  font-weight: 500; font-size: clamp(15px, 1.5vw, 18px);
  color: var(--muted); max-width: 480px; line-height: 1.6;
}

/* ── Section spacing ── */
.wk-section {
  padding-top: 16px;
}

/* ── "View All Work" footer button on homepage ── */
.work__footer {
  display: flex;
  justify-content: center;
  padding-top: 24px;
  padding-bottom: 16px;
}

@media (max-width: 420px) {
  .wk-header { padding-left: 20px; padding-right: 20px; }
}