/* The work history is intentionally presented as a quiet, text-only list. */
.work-list {
  display: grid;
  gap: 0;
}

.work-card {
  overflow: visible;
  border: 0;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
}

.work-card:first-child {
  border-top: 1px solid var(--line);
}

.content-panel {
  max-width: var(--max);
  margin: 0 auto;
  overflow: hidden;
  border-radius: 12px;
  background: var(--panel);
}

.content-panel .hero,
.content-panel .content-section {
  max-width: none;
}

.content-panel .intro-grid {
  display: block;
  padding: 0 20px 42px;
  background: transparent;
  border-radius: 0;
}

.content-panel .bio-panel {
  width: 100%;
}

.content-panel .identity-row {
  width: 100%;
}

.content-panel .identity-row .social-links {
  right: 0;
}

.portrait {
  position: absolute;
  left: 0;
  top: -132px;
  width: 120px;
  height: 120px;
}

.content-panel .content-section {
  padding: 44px 20px 0;
}

.content-panel .content-section h2 {
  margin-bottom: 13px;
  padding-bottom: 0;
  border-bottom: 0;
}

.content-panel .work-list {
  gap: 0;
}

.content-panel .work-card {
  border: 0;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
}

.content-panel .work-card:last-child {
  border-bottom: 0;
}

.content-panel .work-card:first-child {
  border-top: 1px solid var(--line);
}

.content-panel .work-details {
  padding: 17px 2px;
}

.nav-links a:hover {
  color: inherit;
  opacity: .55;
}

.work-details {
  padding: 24px 2px;
}

/* Responsive primary navigation */
.menu-toggle, .mobile-menu { display: none; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media (max-width: 620px) {
  .site-header { justify-content:space-between; gap:0; }
  .site-header .nav-links { display:none; }
  .brand span { display:inline; }
  .menu-toggle { display:grid; place-items:center; width:36px; height:36px; padding:0; border:0; border-radius:50%; background:#1b1b1b; color:var(--text); cursor:pointer; }
  .menu-toggle:focus-visible, .menu-close:focus-visible, .mobile-menu__brand:focus-visible, .mobile-menu__links a:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
  .menu-lines { display:grid; width:16px; gap:5px; }
  .menu-lines i { display:block; height:1px; background:currentColor; }
  .mobile-menu { position:fixed; z-index:20; inset:0; display:flex; visibility:hidden; flex-direction:column; justify-content:space-between; padding:20px 24px 30px; background:var(--bg); opacity:0; pointer-events:none; transition:opacity .22s ease, visibility 0s linear .22s; }
  .mobile-menu.is-open { visibility:visible; opacity:1; pointer-events:auto; transition:opacity .22s ease; }
  .mobile-menu__top { display:flex; align-items:center; justify-content:space-between; }
  .mobile-menu__brand { color:var(--text); font-size:15px; }
  .mobile-menu__brand img { width:28px; height:28px; }
  .menu-close { display:grid; place-items:center; width:38px; height:38px; padding:0; border:1px solid var(--line); border-radius:50%; background:transparent; color:var(--text); cursor:pointer; font:300 28px/1 Arial, sans-serif; }
  .mobile-menu__links { display:grid; gap:8px; margin:auto 0; }
  .mobile-menu__links a { color:var(--text); font-size:clamp(42px, 13vw, 62px); font-weight:600; letter-spacing:-.07em; line-height:1; transform:translateY(12px); opacity:0; transition:opacity .28s ease, transform .28s ease, color .18s ease; }
  .mobile-menu.is-open .mobile-menu__links a { transform:translateY(0); opacity:1; }
  .mobile-menu.is-open .mobile-menu__links a:nth-child(2) { transition-delay:.04s; }
  .mobile-menu.is-open .mobile-menu__links a:nth-child(3) { transition-delay:.08s; }
  .mobile-menu.is-open .mobile-menu__links a:nth-child(4) { transition-delay:.12s; }
  .mobile-menu__links a:hover { color:var(--accent); }
  body.menu-open { overflow:hidden; }
}
@media (min-width:621px) and (max-width:680px) {
  .site-header { gap:12px; padding:0 15px; }
  .brand span { display:inline; }
  .nav-links { display:flex; gap:clamp(13px, 2.5vw, 18px); }
  .nav-links a, .brand { font-size:13px; }
  .nav-links a:nth-child(2), .nav-links a:nth-child(3) { display:inline; }
}
@media (prefers-reduced-motion:reduce) { .mobile-menu, .mobile-menu__links a { transition:none; } }