:root {
  --paper:#f4f1e9;
  --ink:#282b24;
  --muted:#67685d;
  --line:#d8d8cb;
  --accent:#686f51;
}

* {
  box-sizing:border-box;
}

html {
  scroll-behavior:smooth;
  scroll-padding-top:32px;
}

body {
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:Arial,Helvetica,sans-serif;
  -webkit-font-smoothing:antialiased;
}

a {
  color:inherit;
  text-decoration:none;
}

button {
  font:inherit;
}

a:focus-visible,button:focus-visible {
  outline:2px solid var(--accent);
  outline-offset:6px;
}

.skip {
  position:absolute;
  left:20px;
  top:-100px;
  background:var(--ink);
  color:white;
  padding:16px;
  z-index:5;
}

.skip:focus {
  top:10px;
}

.header,main,footer {
  max-width:1440px;
  margin:auto;
}

.header {
  padding:36px 6%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-bottom:1px solid var(--line);
}

.wordmark {
  font-family:Georgia,serif;
  font-size:27px;
  letter-spacing:-1px;
}

.wordmark span {
  display:block;
  font-family:Arial,sans-serif;
  font-size:9px;
  letter-spacing:2.4px;
  margin-top:10px;
}

.header nav {
  display:flex;
  gap:36px;
  font-size:12px;
}

.header nav a:hover {
  color:var(--accent);
}

h1,h2,p,figure {
  margin:0;
}

h1,h2 {
  font-family:Georgia,'Times New Roman',serif;
  font-weight:400;
  letter-spacing:-2.5px;
  line-height:1.1;
}

h1 {
  font-size:clamp(44px,4.6vw,68px);
}

h2 {
  font-size:clamp(37px,3.7vw,54px);
}

em {
  font-weight:400;
  color:var(--accent);
}

.eyebrow {
  font-size:10px;
  letter-spacing:2.2px;
  line-height:1.6;
}

.hero {
  padding:70px 6% 76px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:7%;
  align-items:center;
}

.hero h1 {
  margin:28px 0;
}

.intro {
  font-size:15px;
  line-height:1.9;
  color:var(--muted);
}

.text-link {
  display:inline-flex;
  align-items:center;
  gap:45px;
  padding:16px 0 12px;
  border-bottom:1px solid var(--ink);
  font-size:12px;
  margin-top:25px;
}

.text-link span {
  font-size:22px;
}

.hero-note {
  display:block;
  font-size:10px;
  color:var(--muted);
  margin-top:58px;
  letter-spacing:.6px;
}

.hero-art {
  padding:20px 20px 0;
  background:#e6e6d9;
  transform:rotate(1deg);
}

.hero-art img {
  width:100%;
  height:auto;
  display:block;
}

.hero-art figcaption {
  display:flex;
  justify-content:space-between;
  gap:12px;
  padding:16px 0;
  font-size:9px;
  color:var(--muted);
}

.work {
  border-top:1px solid var(--line);
  padding:65px 6% 80px;
}

.section-heading {
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:end;
  gap:16px;
  margin-bottom:40px;
}

.section-heading .eyebrow {
  grid-column:1/-1;
}

.section-heading>p:last-child {
  text-align:right;
  font-size:12px;
  color:var(--muted);
}

.collections {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:40px 28px;
}

.collection-image {
  height:330px;
  background:#e9e6de;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
}

.collection-image img {
  width:100%;
  height:100%;
  object-fit:contain;
  transition:transform .35s;
}

.collection:hover img {
  transform:scale(1.035);
}

.collection-label {
  padding-top:17px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-family:Georgia,serif;
  font-size:23px;
}

.collection-label small {
  font-family:Arial,sans-serif;
  font-size:9px;
  color:var(--muted);
  margin-right:14px;
}

.about {
  padding:75px 6%;
  background:#e8e9df;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12%;
}

.about h2 {
  margin:22px 0 38px;
}

.about figure {
  max-width:290px;
}

.about img {
  width:100%;
  height:auto;
  display:block;
}

.about figcaption {
  font-size:10px;
  color:var(--muted);
  line-height:1.6;
  margin-top:12px;
}

.biography {
  padding-top:35px;
}

.biography p {
  font-size:14px;
  line-height:1.95;
  margin-bottom:22px;
  color:#55594d;
}

.biography .lead {
  font-family:Georgia,serif;
  font-size:25px;
  line-height:1.5;
  color:var(--ink);
}

.biography .signature {
  font-family:Georgia,serif;
  font-style:italic;
  font-size:28px;
  color:var(--accent);
  margin-top:34px;
}

footer {
  padding:36px 6%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
}

footer .wordmark {
  font-size:22px;
}

footer p,footer small {
  font-size:10px;
  color:var(--muted);
}

.gallery-heading {
  padding:48px 6%;
}

.back {
  font-size:11px;
  color:var(--muted);
  display:inline-block;
  margin-bottom:42px;
}

.gallery-heading h1 {
  margin:16px 0;
}

.gallery-heading .intro {
  max-width:520px;
}

.collection-nav {
  display:flex;
  flex-wrap:wrap;
  gap:24px;
  padding:0 6% 24px;
  border-bottom:1px solid var(--line);
  font-size:11px;
}

.collection-nav a {
  padding-bottom:7px;
}

.collection-nav [aria-current] {
  border-bottom:1px solid var(--ink);
}

.gallery {
  padding:50px 6% 80px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:46px 40px;
  align-items:start;
}

.artwork a {
  display:block;
  position:relative;
  background:#e9e6de;
  padding:24px;
}

.artwork img {
  display:block;
  width:100%;
  height:460px;
  object-fit:contain;
}

.enlarge {
  position:absolute;
  bottom:12px;
  right:12px;
  background:var(--paper);
  padding:8px 10px;
  font-size:10px;
  opacity:0;
  transition:opacity .2s;
}

.artwork a:hover .enlarge,.artwork a:focus-visible .enlarge {
  opacity:1;
}

.artwork figcaption {
  display:flex;
  justify-content:space-between;
  margin-top:14px;
  font-size:11px;
  color:var(--muted);
}

.single {
  grid-template-columns:1fr;
  max-width:950px;
  margin:auto;
}

.single img {
  height:auto;
  max-height:850px;
}

.next {
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  padding:40px 6%;
  display:flex;
  justify-content:space-between;
  align-items:center;
}

.next>span:last-child {
  font-family:Georgia,serif;
  font-size:32px;
}

dialog {
  border:0;
  background:var(--paper);
  color:var(--ink);
  max-width:95vw;
  max-height:95dvh;
  padding:50px 25px 20px;
}

dialog::backdrop {
  background:#161a16e8;
}

dialog img {
  display:block;
  max-width:85vw;
  max-height:75dvh;
  width:auto;
  height:auto;
  margin:auto;
}

dialog p {
  font-size:12px;
  margin-top:15px;
  text-align:center;
}

.close {
  position:absolute;
  right:15px;
  top:12px;
  background:none;
  border:0;
  cursor:pointer;
  padding:8px;
}

body:has(dialog[open]) {
  overflow:hidden;
}

@media(min-width:1440px) {
  .hero {
    gap:90px;
  }
}

@media(max-width:900px) {
  .hero {
    gap:5%;
    padding-top:50px;
  }
  .hero h1 {
    font-size:43px;
  }
  .hero-note {
    margin-top:32px;
  }
  .collection-image {
    height:260px;
    padding:15px;
  }
  .about {
    gap:7%;
  }
  .artwork img {
    height:340px;
  }
}

@media(max-width:600px) {
  .header {
    padding:24px 6%;
    align-items:center;
  }
  .wordmark {
    font-size:23px;
  }
  .header nav {
    gap:16px;
    font-size:10px;
  }
  .wordmark span {
    font-size:7px;
    letter-spacing:1.7px;
  }
  .hero {
    grid-template-columns:1fr;
    padding-top:42px;
    gap:35px;
  }
  .hero h1 {
    font-size:48px;
  }
  .hero-note {
    margin-top:25px;
  }
  .hero-art {
    margin:0 5px;
  }
  .hero-art figcaption {
    font-size:8px;
  }
  .section-heading {
    display:block;
  }
  .section-heading h2 {
    margin:16px 0;
  }
  .section-heading>p:last-child {
    text-align:left;
  }
  .collections {
    grid-template-columns:1fr 1fr;
    gap:30px 16px;
  }
  .collection-image {
    height:235px;
    padding:12px;
  }
  .collection-label {
    font-size:20px;
  }
  .collection-label small {
    display:none;
  }
  .about {
    grid-template-columns:1fr;
    gap:15px;
  }
  .about figure {
    display:none;
  }
  .biography {
    padding-top:0;
  }
  .about h2 {
    margin-bottom:20px;
  }
  footer {
    flex-wrap:wrap;
  }
  footer p {
    display:none;
  }
  .gallery {
    grid-template-columns:1fr;
    padding-top:30px;
  }
  .artwork img {
    height:auto;
    max-height:600px;
  }
  .collection-nav {
    gap:16px;
  }
  .gallery-heading h1 {
    font-size:48px;
  }
  .next>span:last-child {
    font-size:25px;
  }
  .next {
    gap:16px;
  }
  .work,.about {
    padding-top:48px;
    padding-bottom:48px;
  }
}

@media(max-width:380px) {
  .collection-image {
    height:195px;
  }
  .header nav {
    gap:10px;
  }
  .hero h1 {
    font-size:42px;
  }
}

@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto;
  }
  *,*::before,*::after {
    transition:none!important;
  }
}


/* Original content structure, using the updated visual design. */
.header { flex-wrap: wrap; gap: 26px; }
.header nav { flex-wrap: wrap; gap: 16px 24px; line-height: 1.8; }
.header nav [aria-current="page"] { border-bottom: 1px solid var(--ink); }
.original-bio { display: grid; grid-template-columns: minmax(220px, 340px) minmax(0, 560px); gap: 8%; align-items: center; justify-content: center; padding: 64px 6%; }
.original-bio figure img { width: 100%; height: auto; display: block; }
.original-bio .biography { padding: 0; }
.original-bio .biography p { font-size: 16px; line-height: 1.9; }
.original-bio .biography p:last-child { margin-bottom: 0; }
.gallery-heading { padding-bottom: 0; }
footer { border-top: 1px solid var(--line); }
@media (max-width: 900px) {
  .header { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 600px) {
  .header nav { font-size: 12px; gap: 10px 18px; }
  .original-bio { grid-template-columns: 1fr; gap: 32px; padding-top: 36px; }
  .original-bio figure { max-width: 280px; margin: auto; }
  .original-bio .biography p { font-size: 15px; }
}
