.artist-page { background: #0a0a0a; }
.artist-topbar { display: flex; align-items: center; justify-content: space-between; gap: 25px; min-height: 76px; color: #c9c4bb; font: 10px var(--mono); letter-spacing: .17em; }
.artist-topbar a, .artist-more, .artist-footer a { width: max-content; border-bottom: 1px solid transparent; transition: border-color .2s ease, color .2s ease; }
.artist-topbar a:hover, .artist-more:hover, .artist-footer a:hover { color: #fff; border-color: currentColor; }
.artist-topbar a span { margin-left: 12px; }
.artist-topbar > span { color: #8f8b84; text-align: right; }
.artist-hero { display: grid; grid-template-columns: minmax(190px, .7fr) minmax(390px, 1.42fr) minmax(300px, .95fr); align-items: center; gap: clamp(20px, 3vw, 60px); min-height: min(830px, calc(100svh - 76px)); padding-top: 25px; padding-bottom: 75px; }
.artist-sketch { height: min(53vw, 470px); min-height: 290px; overflow: hidden; opacity: .92; mask-image: radial-gradient(ellipse 68% 70% at 50% 49%, #000 44%, transparent 100%); }
.artist-sketch img { width: 100%; height: 100%; object-fit: cover; object-position: 44% center; }
.artist-hero-copy { align-self: center; position: relative; z-index: 1; padding-bottom: 4%; }
.artist-label { display: flex; align-items: center; gap: 22px; color: #bbb6ad; font: 10px var(--mono); letter-spacing: .15em; }
.artist-label i { width: 58px; height: 1px; background: #77736c; }
.artist-hero h1 { max-width: 11ch; margin-top: 36px; font: 400 clamp(48px, 4.5vw, 76px)/.99 var(--serif); letter-spacing: -.035em; text-wrap: balance; }
.artist-intro { margin-top: 37px; color: #9f9b94; font: 11px/1.9 var(--mono); letter-spacing: .09em; }
.artist-more { display: inline-flex; gap: 18px; margin-top: 35px; padding-bottom: 8px; border-color: #77736c; font: 10px var(--mono); letter-spacing: .14em; }
.artist-portrait { align-self: center; margin: 0; }
.artist-portrait img { width: 100%; height: min(65svh, 610px); min-height: 420px; object-fit: cover; object-position: center 29%; }
.artist-portrait figcaption { margin-top: 11px; color: #817d77; font: 9px var(--mono); letter-spacing: .15em; text-align: right; }
.artist-practice { padding-top: clamp(65px, 8vw, 135px); padding-bottom: clamp(110px, 12vw, 200px); border-top: 1px solid #343331; }
.artist-section-line { display: flex; justify-content: space-between; gap: 20px; color: #aaa59c; font: 10px var(--mono); letter-spacing: .13em; }
.artist-practice-intro { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(250px, .7fr); align-items: end; gap: 60px; margin: clamp(80px, 9vw, 145px) 0 clamp(95px, 11vw, 170px); }
.artist-practice h2 { max-width: 12ch; font: 400 clamp(55px, 7vw, 115px)/.92 var(--serif); letter-spacing: -.05em; }
.artist-practice-intro p { max-width: 19ch; padding-bottom: 10px; color: #b9b3aa; font: 400 clamp(24px, 2.7vw, 39px)/1.05 var(--serif); }
.artist-projects { border-top: 1px solid #343331; }
.artist-projects a { display: grid; grid-template-columns: 7% minmax(180px, 1fr) minmax(170px, .8fr) 18% 25px; align-items: center; gap: clamp(15px, 2vw, 35px); min-height: 155px; padding: 17px 0; border-bottom: 1px solid #343331; }
.artist-projects a > span { color: #a6a098; font: 10px/1.5 var(--mono); letter-spacing: .08em; }
.artist-projects strong { font-size: clamp(29px, 3vw, 49px); font-weight: 500; letter-spacing: -.055em; }
.artist-projects img { width: 100%; height: 120px; object-fit: cover; filter: grayscale(1) brightness(.72); transition: filter .35s ease, transform .35s ease; }
.artist-projects a:hover img, .artist-projects a:focus-visible img { filter: grayscale(0) brightness(1); transform: scale(1.025); }
.artist-projects .artist-arrow { align-self: start; color: var(--text); font: 25px var(--display); }
.artist-footer { display: flex; justify-content: space-between; gap: 20px; padding-top: 30px; padding-bottom: 40px; border-top: 1px solid #343331; color: #aaa59c; font: 10px var(--mono); letter-spacing: .13em; }
@media (max-width: 1050px) {
  .artist-hero { grid-template-columns: minmax(165px, .55fr) minmax(350px, 1.3fr) minmax(230px, .8fr); gap: 20px; }
  .artist-hero h1 { font-size: clamp(44px, 5.2vw, 65px); }
}
@media (max-width: 760px) {
  .artist-topbar { min-height: 66px; }
  .artist-topbar > span { max-width: 14ch; line-height: 1.5; }
  .artist-hero { grid-template-columns: minmax(0, 1fr) minmax(0, .85fr); gap: 22px; padding-top: 20px; padding-bottom: 80px; }
  .artist-sketch { grid-column: 1 / -1; height: 260px; min-height: 0; width: 58%; }
  .artist-hero-copy { align-self: start; }
  .artist-hero h1 { font-size: clamp(42px, 7vw, 60px); }
  .artist-portrait img { min-height: 0; height: 410px; }
  .artist-practice-intro { grid-template-columns: 1fr; gap: 32px; }
  .artist-projects a { grid-template-columns: 30px 1fr 110px 20px; min-height: 115px; }
  .artist-projects a > span:nth-child(3) { display: none; }
  .artist-projects img { height: 82px; }
}
@media (max-width: 560px) {
  .artist-hero { display: flex; flex-direction: column; align-items: stretch; gap: 0; padding-top: 12px; }
  .artist-sketch { width: 47%; height: 190px; margin-left: -4%; margin-bottom: -12px; }
  .artist-hero-copy { padding-bottom: 0; }
  .artist-hero h1 { max-width: 11ch; margin-top: 27px; font-size: clamp(48px, 13vw, 69px); }
  .artist-intro { margin-top: 29px; }
  .artist-more { margin-top: 28px; }
  .artist-portrait { width: 68%; margin: 65px 0 0 auto; }
  .artist-portrait img { height: 360px; }
  .artist-section-line span:last-child { text-align: right; }
  .artist-practice h2 { font-size: clamp(55px, 13vw, 80px); }
  .artist-projects a { grid-template-columns: 24px minmax(0, 1fr) 86px 17px; gap: 10px; }
  .artist-projects strong { font-size: clamp(23px, 6vw, 32px); }
  .artist-projects img { height: 70px; }
}
@media (prefers-reduced-motion: reduce) {
  .artist-topbar a, .artist-more, .artist-footer a, .artist-projects img { transition: none; }
}
