:root {
  --paper: #f3f1eb;
  --ink: #11110f;
  --line: rgba(17,17,15,.18);
  --muted: rgba(17,17,15,.60);
  --pad: clamp(20px, 3.4vw, 56px);
  --header-h: 70px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: Arial, Helvetica, sans-serif;
  -webkit-font-smoothing: antialiased;
}
img { display: block; width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }

.page-progress {
  position: fixed; inset: 0 auto auto 0; height: 2px; width: 0;
  background: var(--ink); z-index: 100;
}

.site-header {
  position: fixed; inset: 0 0 auto 0; height: var(--header-h);
  display: grid; grid-template-columns: 1fr auto; align-items: center;
  padding: 0 var(--pad); z-index: 50; mix-blend-mode: difference; color: white;
  pointer-events: none;
}
.site-header > * { pointer-events: auto; }
.brand {
  font-size: 15px; letter-spacing: .02em; text-transform: uppercase; font-weight: 700;
}
.site-nav { display: flex; gap: 22px; font-size: 13px; text-transform: uppercase; letter-spacing: .06em; }
.site-nav a { opacity: .75; transition: opacity .2s ease; }
.site-nav a:hover { opacity: 1; }
.menu-toggle { display:none; background:none; border:0; color:inherit; padding: 8px 0; text-transform:uppercase; font-size:12px; }

.hero {
  min-height: 100svh;
  position: relative;
  overflow: hidden;
  background: #0d0d0c;
  color: white;
}
.hero-media { position: absolute; inset: 0; margin:0; }
.hero-media::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg, rgba(0,0,0,.42), rgba(0,0,0,.04) 58%, rgba(0,0,0,.15)); }
.hero-media img { height:100%; object-fit:cover; object-position:center 35%; transform:scale(1.012); }
.hero-copy {
  position:absolute; left:var(--pad); bottom:clamp(56px,9vh,110px); z-index:2;
}
.eyebrow, .section-kicker { margin:0 0 16px; font-size:11px; letter-spacing:.16em; text-transform:uppercase; }
.hero h1 {
  margin:0; font-family: Georgia, 'Times New Roman', serif; font-weight:400;
  font-size:clamp(68px,12vw,190px); line-height:.75; letter-spacing:-.07em;
}
.hero-note { margin:26px 0 0; font-size:12px; letter-spacing:.1em; text-transform:uppercase; }
.scroll-cue { position:absolute; right:var(--pad); bottom:32px; z-index:2; font-size:22px; }

.section-pad { padding: clamp(90px, 14vw, 210px) var(--pad); }
.intro { display:grid; grid-template-columns: minmax(140px, .8fr) 2.2fr; gap:8vw; align-items:start; }
.intro-statement {
  max-width: 1100px; margin:0; font-family: Georgia, 'Times New Roman', serif;
  font-size:clamp(34px,5.6vw,86px); line-height:1.02; letter-spacing:-.045em;
}

.gallery { padding: 0 var(--pad); }
.gallery-featured {
  display:grid; grid-template-columns: 1.35fr .65fr; gap:clamp(28px,6vw,100px);
  align-items:start; padding-bottom:clamp(100px,16vw,240px);
}
.gallery-featured .wide { grid-row: span 2; }
.gallery-featured .landscape { grid-column: 1 / -1; width: 72%; justify-self:end; margin-top:6vw; }
.art-card { margin:0; cursor:zoom-in; }
.art-card img { background:#ddd; }
.art-card figcaption {
  display:flex; justify-content:space-between; gap:24px; margin-top:10px; padding-top:8px;
  border-top:1px solid var(--line); font-size:11px; text-transform:uppercase; letter-spacing:.08em;
}
.art-card figcaption span:last-child { color:var(--muted); }

.collection { border-top:1px solid var(--line); }
.collection-head { display:grid; grid-template-columns:minmax(140px,.8fr) 2.2fr; gap:8vw; margin-bottom:8vw; }
.collection h2, .about h2, .full-bleed h2 {
  margin:0; font-family:Georgia,'Times New Roman',serif; font-size:clamp(54px,9vw,132px); line-height:.88; font-weight:400; letter-spacing:-.065em;
}
.two-col { display:grid; grid-template-columns:1fr 1fr; gap:8vw; align-items:start; }
.two-col .offset { margin-top:18vw; }
.asym-grid { display:grid; grid-template-columns:1.12fr .88fr; gap:4vw 8vw; align-items:start; }
.asym-grid .tall { grid-row:span 2; }
.asym-grid figure:nth-child(3) { margin-top:8vw; }

.full-bleed { position:relative; min-height:100svh; background:#0a0a0a; color:white; overflow:hidden; }
.full-bleed > img { width:100%; height:100svh; object-fit:cover; object-position:center; opacity:.88; }
.full-bleed::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg, transparent 42%, rgba(0,0,0,.56)); pointer-events:none; }
.full-bleed-caption { position:absolute; left:var(--pad); right:var(--pad); bottom:var(--pad); z-index:2; display:grid; grid-template-columns:minmax(140px,.8fr) 2.2fr; gap:8vw; align-items:end; }
.full-bleed h2 { max-width:900px; }

.about { border-top:1px solid var(--line); display:grid; grid-template-columns:1fr 1fr; gap:10vw; }
.about h2 { font-size:clamp(58px,8vw,122px); }
.about-copy { max-width:680px; font-family:Georgia,'Times New Roman',serif; font-size:clamp(22px,2.5vw,38px); line-height:1.25; }
.about-copy p { margin:0 0 32px; }
.about-copy .muted { color:var(--muted); font-family:Arial,Helvetica,sans-serif; font-size:13px; line-height:1.5; }

.site-footer { border-top:1px solid var(--line); padding:28px var(--pad) 42px; display:flex; justify-content:space-between; font-size:12px; text-transform:uppercase; letter-spacing:.08em; }

.reveal { opacity:0; transform:translateY(34px); transition:opacity .9s cubic-bezier(.2,.75,.25,1), transform .9s cubic-bezier(.2,.75,.25,1); }
.reveal.in-view { opacity:1; transform:none; }

.lightbox {
  width:100vw; height:100vh; max-width:none; max-height:none; margin:0; padding:0; border:0;
  background:rgba(10,10,10,.96); color:white;
}
.lightbox[open] { display:grid; place-items:center; }
.lightbox::backdrop { background:rgba(0,0,0,.9); }
.lightbox img { max-width:88vw; max-height:84vh; width:auto; height:auto; object-fit:contain; }
.lightbox-close { position:fixed; right:24px; top:18px; border:0; background:none; color:white; font-size:36px; font-weight:200; cursor:pointer; }
.lightbox-caption { position:fixed; left:24px; bottom:18px; margin:0; font-size:11px; letter-spacing:.1em; text-transform:uppercase; }

@media (max-width: 760px) {
  :root { --header-h: 58px; }
  .site-header { mix-blend-mode:normal; background:rgba(243,241,235,.92); color:var(--ink); backdrop-filter:blur(10px); border-bottom:1px solid var(--line); }
  .menu-toggle { display:block; }
  .site-nav {
    position:fixed; top:var(--header-h); left:0; right:0; display:none; flex-direction:column; gap:0;
    background:var(--paper); color:var(--ink); padding:12px var(--pad) 22px; border-bottom:1px solid var(--line);
  }
  .site-nav.open { display:flex; }
  .site-nav a { padding:12px 0; border-bottom:1px solid var(--line); }
  .hero { min-height:92svh; margin-top:var(--header-h); }
  .hero-media img { object-position:58% 40%; }
  .hero h1 { font-size:clamp(64px,24vw,104px); }
  .intro, .collection-head, .full-bleed-caption, .about { grid-template-columns:1fr; gap:30px; }
  .gallery-featured, .two-col, .asym-grid { grid-template-columns:1fr; gap:76px; }
  .gallery-featured .wide, .asym-grid .tall { grid-row:auto; }
  .gallery-featured .landscape { grid-column:auto; width:100%; justify-self:auto; margin-top:0; }
  .two-col .offset, .asym-grid figure:nth-child(3) { margin-top:0; }
  .full-bleed > img { height:86svh; }
  .full-bleed { min-height:86svh; }
  .full-bleed-caption { bottom:28px; }
  .site-footer { padding-bottom:28px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  .reveal { opacity:1; transform:none; transition:none; }
}
