:root { --ink:#141411; --paper:#eeece3; --warm:#c8482d; --line:rgba(20,20,17,.26); --mono:"DM Mono", monospace; --serif:"Playfair Display", Georgia, serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--mono); font-size:13px; line-height:1.5; }
a { color:inherit; }
.grain { background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.18'/%3E%3C/svg%3E"); opacity:.16; pointer-events:none; position:fixed; inset:0; z-index:10; }
.site-header { display:grid; grid-template-columns:1fr auto 1fr; align-items:start; padding:22px 30px; border-bottom:1px solid var(--line); text-transform:uppercase; letter-spacing:.04em; }
.wordmark { font:600 21px/.78 var(--serif); text-decoration:none; letter-spacing:-.05em; width:max-content; }.wordmark span { font:9px var(--mono); vertical-align:top; margin-left:2px; }
.location { text-align:center; margin:0; font-size:10px; }.location span { opacity:.55; }.instagram-link { justify-self:end; font-size:10px; }
main { max-width:1440px; margin:auto; }.hero { min-height:calc(100vh - 87px); display:grid; grid-template-columns:46% 54%; align-items:center; padding:48px 7vw 7vw; gap:4vw; }
.eyebrow { margin:0 0 22px; color:var(--warm); font-size:10px; letter-spacing:.09em; text-transform:uppercase; }.hero h1,.prints h2 { margin:0; font:600 clamp(60px,8.1vw,132px)/.84 var(--serif); letter-spacing:-.075em; }.hero h1 em { font-weight:500; }.intro { max-width:290px; margin:38px 0 32px; font-size:12px; }.round-link { display:flex; align-items:center; justify-content:space-between; width:160px; height:160px; padding:20px; border:1px solid var(--ink); border-radius:50%; text-decoration:none; font-size:10px; transition:.35s; }.round-link span { font-size:26px; align-self:end; }.round-link:hover { background:var(--ink); color:var(--paper); transform:rotate(-8deg); }
.image-frame { margin:0; position:relative; }.image-frame img { width:100%; max-height:72vh; object-fit:cover; display:block; filter:saturate(.88) contrast(1.04); }.image-frame figcaption { margin-top:9px; font-size:9px; color:rgba(20,20,17,.7); }
.statement { border-top:1px solid var(--line); display:grid; grid-template-columns:25% 1fr 22%; gap:4vw; padding:8vw 7vw; }.large-copy { max-width:720px; margin:0; font:500 clamp(30px,4vw,60px)/.98 var(--serif); letter-spacing:-.055em; }.small-copy { align-self:end; margin:0; font-size:11px; }
.work { padding:0 30px 8vw; }.section-heading { border-top:1px solid var(--line); display:grid; grid-template-columns:25% 1fr 22%; align-items:baseline; padding:22px 0 45px; }.section-heading .eyebrow { margin:0; }.section-heading h2 { margin:0; font:600 clamp(36px,5vw,72px)/.9 var(--serif); letter-spacing:-.06em; }.section-heading h2 span { font:10px var(--mono); letter-spacing:0; vertical-align:top; }.section-heading > p { margin:0; font-size:10px; }
.gallery { columns:3 260px; column-gap:12px; }.artwork { appearance:none; background:none; border:0; padding:0 0 12px; margin:0; display:block; width:100%; break-inside:avoid; cursor:zoom-in; text-align:left; color:inherit; }.artwork img { width:100%; display:block; filter:saturate(.82); transition:filter .25s, transform .35s; }.artwork:hover img { filter:saturate(1.08); transform:scale(.985); }.artwork span { display:flex; justify-content:space-between; padding-top:7px; font-size:9px; opacity:.7; }
.prints { background:var(--warm); color:#fff7ec; padding:8vw 7vw; display:grid; grid-template-columns:1fr 1fr; gap:5vw; }.prints .eyebrow { color:var(--ink); }.prints h2 { font-size:clamp(55px,7.7vw,115px); }.print-copy { max-width:355px; align-self:end; font-size:14px; }.print-copy p { margin:0 0 36px; }.text-link { border-bottom:1px solid currentColor; padding-bottom:5px; text-decoration:none; }
footer { display:flex; justify-content:space-between; gap:20px; padding:20px 30px; font-size:9px; text-transform:uppercase; } footer p { margin:0; }
.lightbox { border:0; background:transparent; padding:30px; width:min(1000px,100vw); max-width:none; color:#fff; }.lightbox::backdrop { background:rgba(10,10,8,.94); }.lightbox img { display:block; max-width:100%; max-height:78vh; margin:auto; }.lightbox-meta { display:flex; justify-content:space-between; max-width:900px; margin:10px auto 0; font-size:10px; }.lightbox-meta p { margin:0; }.close { position:fixed; top:18px; right:24px; appearance:none; background:none; color:white; border:0; font:300 42px/1 var(--serif); cursor:pointer; }
@media (max-width:700px) { .site-header { padding:17px; grid-template-columns:1fr auto; }.location { display:none; }.hero { min-height:auto; grid-template-columns:1fr; padding:15vw 20px 20vw; gap:60px; }.hero h1 { font-size:21vw; }.hero-image { width:88%; margin-left:auto; }.statement { grid-template-columns:1fr; gap:20px; padding:22vw 20px; }.statement .eyebrow { margin:0; }.small-copy { max-width:210px; }.work { padding:0 12px 22vw; }.section-heading { grid-template-columns:1fr; gap:14px; padding:18px 8px 35px; }.section-heading h2 { font-size:15vw; }.gallery { columns:2 140px; column-gap:7px; }.artwork { padding-bottom:7px; }.prints { grid-template-columns:1fr; padding:20vw 20px; }.prints h2 { font-size:18vw; }.print-copy { margin-top:40px; } footer { padding:18px; flex-wrap:wrap; } .lightbox { padding:60px 15px 20px; }.lightbox-meta { padding:0 4px; } }
