:root { --night:#0c0e0d; --paper:#eeeadf; --ink:#151715; --muted:#aaa79d; --line:rgba(238,234,223,.17); --gold:#d7bb79; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:2rem; background:var(--night); }
body { margin:0; background:var(--night); color:var(--paper); font-family:"DM Sans",sans-serif; }
a { color:inherit; }
a:focus-visible { outline:2px solid var(--gold); outline-offset:5px; }
.skip { position:absolute; top:1rem; left:1rem; z-index:9; padding:.8rem 1rem; background:var(--paper); color:var(--ink); transform:translateY(-170%); }
.skip:focus { transform:none; }
.shell { width:min(1420px,calc(100% - 64px)); margin:auto; }
.top { min-height:78px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:28px; border-bottom:1px solid var(--line); }
.brand { display:inline-flex; align-items:center; gap:11px; width:max-content; text-decoration:none; color:var(--paper); font:500 .76rem/1 "DM Mono",monospace; letter-spacing:.14em; text-transform:uppercase; }
.brand img { width:31px; height:31px; object-fit:cover; border-radius:50%; border:1px solid var(--gold); }
.top nav { display:flex; align-items:center; gap:27px; }
.top nav a, .back { color:var(--muted); text-decoration:none; font:.7rem/1 "DM Mono",monospace; letter-spacing:.12em; text-transform:uppercase; }
.top nav a:hover, .back:hover { color:var(--gold); }
.back { justify-self:end; }
.artist-tabs { display:flex; align-items:stretch; border-bottom:1px solid var(--line); overflow-x:auto; scrollbar-width:none; }
.artist-tabs::-webkit-scrollbar { display:none; }
.artist-tab { display:inline-flex; flex:0 0 auto; align-items:center; gap:12px; min-height:58px; padding:0 25px; border-right:1px solid var(--line); color:var(--muted); font:.7rem/1 "DM Mono",monospace; letter-spacing:.12em; text-decoration:none; text-transform:uppercase; }
.artist-tab:first-child { border-left:1px solid var(--line); }
.artist-tab span { color:var(--gold); font-size:.68rem; }
.artist-tab:hover { color:var(--paper); background:rgba(238,234,223,.035); }
.artist-tab.is-active { color:var(--paper); background:rgba(215,187,121,.09); box-shadow:inset 0 -2px 0 var(--gold); }
.hero { position:relative; display:grid; min-height:min(760px,calc(100svh - 78px)); overflow:hidden; border-bottom:1px solid var(--line); isolation:isolate; }
.hero-image { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; filter:saturate(.76) contrast(.91) brightness(.71); transform:scale(1.012); z-index:-2; }
.hero-wash { position:absolute; inset:0; background:linear-gradient(90deg,rgba(7,9,8,.88) 0%,rgba(7,9,8,.48) 40%,rgba(7,9,8,.09) 72%),linear-gradient(0deg,rgba(7,9,8,.58),transparent 43%); z-index:-1; }
.hero-copy { align-self:center; padding:clamp(48px,9vw,138px); max-width:870px; }
.eyebrow { margin:0; color:var(--gold); font:.75rem/1.4 "DM Mono",monospace; letter-spacing:.16em; text-transform:uppercase; }
h1 { margin:24px 0 20px; font:500 clamp(4.6rem,10.5vw,10.5rem)/.84 "Playfair Display",serif; letter-spacing:-.07em; }
.hero-copy > p:last-child { margin:0; color:var(--paper); font:400 clamp(1.25rem,2vw,1.85rem)/1.4 "Playfair Display",serif; }
.hero-scroll { position:absolute; left:clamp(48px,9vw,138px); bottom:42px; color:var(--paper); text-decoration:none; font:.72rem/1 "DM Mono",monospace; letter-spacing:.15em; text-transform:uppercase; padding-bottom:9px; border-bottom:1px solid var(--gold); }
.gallery { padding:clamp(70px,9vw,135px) 0; }
.gallery-heading { display:grid; grid-template-columns:.58fr 1.15fr; gap:32px; align-items:start; padding-bottom:36px; border-bottom:1px solid var(--line); }
.gallery h2, .artist h2 { margin:0; font:500 clamp(2.3rem,4.8vw,5.2rem)/.95 "Playfair Display",serif; letter-spacing:-.055em; }
.gallery-heading > p:last-child { margin:3px 0 0; color:var(--muted); font:400 1rem/1.85 "DM Sans",sans-serif; }
.work-grid { display:grid; grid-template-columns:1.23fr .77fr; gap:18px; margin-top:19px; }
.work-card { margin:0; padding:11px; background:#141714; border:1px solid var(--line); }
.work-card img { display:block; width:100%; height:auto; min-height:0; aspect-ratio:1.15/1; object-fit:cover; }
.work-card--large { grid-row:span 2; align-self:start; }
.work-card--large img { aspect-ratio:1.18/1; }
.work-card--wide img { object-position:center 35%; }
.work-card figcaption { display:grid; grid-template-columns:auto 1fr; gap:10px 14px; align-items:start; padding:16px 5px 5px; }
.work-card figcaption > span { color:var(--gold); font:.72rem/1.5 "DM Mono",monospace; letter-spacing:.11em; }
.work-card figcaption div { display:grid; gap:4px; }
.work-card figcaption strong { font:400 1.2rem/1.1 "Playfair Display",serif; }
.work-card figcaption em { color:var(--muted); font:.68rem/1.4 "DM Mono",monospace; letter-spacing:.1em; text-transform:uppercase; font-style:normal; }
.work-card figcaption a { grid-column:2; color:var(--muted); font-size:.73rem; line-height:1.45; text-underline-offset:.25em; }
.work-card figcaption a:hover { color:var(--gold); }
.artist { display:grid; grid-template-columns:.58fr 1.42fr; gap:clamp(35px,9vw,150px); padding:clamp(70px,9vw,135px) 0; border-top:1px solid var(--line); }
.artist h2 { margin-bottom:27px; }
.artist p:not(.eyebrow) { max-width:790px; margin:0 0 21px; color:#cbc8bf; font:400 1.06rem/1.9 "DM Sans",sans-serif; }
.source-link { display:inline-block; margin-top:12px; padding-bottom:8px; color:var(--gold); font:.72rem/1 "DM Mono",monospace; letter-spacing:.12em; text-decoration:none; text-transform:uppercase; border-bottom:1px solid rgba(215,187,121,.62); }
.foot { display:flex; justify-content:space-between; flex-wrap:wrap; gap:18px; padding:28px 0; border-top:1px solid var(--line); color:var(--muted); font:.72rem/1.5 "DM Mono",monospace; letter-spacing:.1em; text-transform:uppercase; }
.foot a { text-decoration:none; }
@media (max-width:900px) { .shell { width:calc(100% - 40px); } .top { grid-template-columns:1fr auto; } .top nav { display:none; } .gallery-heading { grid-template-columns:1fr 1.15fr; } .gallery-heading > p:last-child { grid-column:2; } .artist { grid-template-columns:.5fr 1.5fr; gap:45px; } }
@media (max-width:640px) { .shell { width:calc(100% - 28px); } .top { min-height:65px; } .brand { font-size:.68rem; letter-spacing:.1em; } .brand img { width:28px; height:28px; } .back { font-size:.64rem; } .artist-tab { min-height:52px; padding:0 18px; font-size:.64rem; } .hero { min-height:690px; } .hero-image { object-position:58% center; } .hero-wash { background:linear-gradient(0deg,rgba(7,9,8,.8),rgba(7,9,8,.16) 67%),linear-gradient(90deg,rgba(7,9,8,.45),transparent); } .hero-copy { align-self:end; padding:42px 26px 108px; } h1 { font-size:clamp(4.2rem,21vw,6.8rem); } .hero-scroll { left:26px; bottom:36px; } .gallery { padding:65px 0; } .gallery-heading, .artist { grid-template-columns:1fr; gap:21px; } .gallery-heading > p:last-child { grid-column:auto; } .work-grid { grid-template-columns:1fr; } .work-card--large { grid-row:auto; } .work-card img, .work-card--large img { aspect-ratio:1.15/1; } .work-card--wide img { aspect-ratio:1.15/1; } .artist { padding:65px 0; } .artist p:not(.eyebrow) { font-size:1rem; line-height:1.82; } .foot { flex-direction:column; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }
