:root { color-scheme: light; --ink:#151515; --paper:#fff; --line:1px solid var(--ink); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:1.5rem; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Arial, Helvetica, sans-serif; font-size:1rem; line-height:1.5; }
a { color:inherit; text-underline-offset:.3em; }
a:focus-visible { outline:2px solid var(--ink); outline-offset:6px; }
.skip-link { position:absolute; top:-5rem; left:1rem; z-index:10; padding:1rem; background:white; border:var(--line); }
.skip-link:focus { top:1rem; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.site-header { display:flex; justify-content:space-between; align-items:center; gap:2rem; margin:0 3.25rem; padding:1.8rem 0 1.5rem; border-bottom:var(--line); }
.identity { display:flex; flex-direction:column; text-decoration:none; flex-shrink:0; }
.artist-name { font-size:1.75rem; font-weight:500; letter-spacing:-.035em; line-height:1.25; }
.artist-medium { margin-top:.25rem; font-size:.875rem; }
nav { display:flex; gap:1.85rem; flex-wrap:wrap; }
nav a { display:flex; align-items:center; min-height:44px; text-decoration:none; font-size:.9375rem; }
nav a:hover { text-decoration:underline; }
main { max-width:1600px; margin:0 auto; }
.photographs { padding:2.4rem 3.8rem 3.5rem; }
.photo-board { position:relative; min-height:570px; height:calc(min(100vw, 1600px) * .47); max-height:752px; }
figure { margin:0; }
.photo { position:absolute; width:var(--width); left:var(--left); top:var(--top); transform:rotate(var(--angle)); background:white; }
.placeholder { position:relative; border:var(--line); aspect-ratio:var(--ratio, 4 / 3); background:white; }
.placeholder svg { width:100%; height:100%; position:absolute; inset:0; }
.placeholder path { fill:none; stroke:var(--ink); stroke-width:1; vector-effect:non-scaling-stroke; }
.photo figcaption { font-size:.875rem; line-height:1.3; padding-top:.5rem; }
.p01 { --width:23%; --left:1%; --top:4%; --angle:-8deg; --ratio:4 / 3; }
.p02 { --width:15%; --left:29%; --top:1%; --angle:7deg; --ratio:3 / 4; }
.p03 { --width:23%; --left:49%; --top:8%; --angle:-5deg; --ratio:3 / 2; }
.p04 { --width:17%; --left:78%; --top:2%; --angle:9deg; --ratio:4 / 5; }
.p05 { --width:15%; --left:5%; --top:45%; --angle:6deg; --ratio:4 / 5; }
.p06 { --width:24%; --left:24%; --top:47%; --angle:-9deg; --ratio:3 / 2; }
.p07 { --width:13%; --left:54%; --top:43%; --angle:6deg; --ratio:3 / 4; }
.p08 { --width:24%; --left:73%; --top:53%; --angle:-7deg; --ratio:3 / 2; }
.p09 { --width:13%; --left:31%; --top:79%; --angle:5deg; --ratio:3 / 2; }
.p10 { --width:15%; --left:52%; --top:86%; --angle:-4deg; --ratio:16 / 9; }
.ruled-section { margin:0 3.25rem; padding:2rem 0 3rem; border-top:var(--line); }
h2 { margin:0; font-size:1.35rem; font-weight:500; letter-spacing:-.02em; }
.section-heading { display:flex; align-items:baseline; justify-content:space-between; gap:1rem; margin-bottom:2rem; }
.section-heading > span { font-size:.875rem; }
.video-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:2rem; }
.video-placeholder { aspect-ratio:16 / 10; display:grid; place-items:center; }
.play-mark { display:grid; place-items:center; position:relative; background:white; width:3.5rem; height:3.5rem; border:var(--line); border-radius:50%; font-size:2rem; line-height:1; padding-left:.2rem; }
.video-card figcaption { padding-top:.8rem; font-size:1rem; }
.video-card figcaption span { display:block; font-size:.875rem; margin-top:.2rem; }
.about-section, .contact-section { display:grid; grid-template-columns:1fr 2fr; gap:2rem; }
.about-content { max-width:38rem; }
p { margin:0 0 .75rem; }
.placeholder-copy { font-size:.9375rem; }
.contact-content p { display:inline-block; border-bottom:var(--line); padding-bottom:.4rem; margin-right:2rem; }
footer { display:flex; justify-content:space-between; align-items:center; gap:1.5rem; margin:0 3.25rem; padding:1.2rem 0; border-top:var(--line); font-size:.875rem; flex-wrap:wrap; }
footer a { display:flex; align-items:center; min-height:44px; }
@media (min-width:1704px) { .site-header, footer { max-width:1496px; margin-left:auto; margin-right:auto; } }
@media (max-width:900px) {
  .site-header { margin:0 1.75rem; gap:1rem; }
  nav { gap:1rem; }
  .photographs { padding:2rem 2.5rem; }
  .photo-board { min-height:0; height:auto; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:2.5rem 2rem; align-items:center; padding:.5rem; max-height:none; }
  .photo { position:relative; top:auto; left:auto; width:100%; }
  .p02, .p05, .p07 { width:85%; justify-self:center; }
  .p09 { width:85%; }
  .p10 { grid-column:2; }
  .ruled-section, footer { margin-left:1.75rem; margin-right:1.75rem; }
}
@media (max-width:600px) {
  html { scroll-padding-top:1rem; }
  .site-header { margin:0 1.25rem; padding:1.25rem 0 .5rem; align-items:flex-start; flex-direction:column; gap:.6rem; }
  .artist-name { font-size:1.65rem; }
  nav { justify-content:space-between; gap:.9rem; width:100%; }
  nav a { font-size:.875rem; }
  .photographs { padding:1.7rem 1.65rem 2.2rem; }
  .photo-board { grid-template-columns:repeat(2,minmax(0,1fr)); gap:2.5rem 1.4rem; padding:.5rem; }
  .photo { transform:rotate(clamp(-5deg,var(--angle),5deg)); }
  .p02 { margin-top:1.5rem; }
  .p04, .p06, .p08, .p10 { margin-top:1.2rem; }
  .p05, .p07 { width:90%; }
  .p09 { width:100%; }
  .p10 { grid-column:auto; }
  .photo figcaption { font-size:.875rem; }
  .ruled-section { margin:0 1.25rem; padding:1.5rem 0 2rem; }
  .section-heading { margin-bottom:1.5rem; }
  .section-heading > span { display:none; }
  .video-grid { grid-template-columns:1fr; gap:1.75rem; }
  .about-section, .contact-section { grid-template-columns:1fr; gap:1rem; }
  .contact-content p { display:table; }
  footer { margin:0 1.25rem; gap:.5rem 1rem; }
  footer > span:nth-child(2) { flex-basis:50%; text-align:right; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }
@media print {
  html { scroll-behavior:auto; }
  body { font-size:12pt; }
  .site-header { margin:0; padding:0 0 1rem; }
  nav { gap:1rem; }
  .photographs { padding:1.5rem .5rem 2rem; }
  .photo-board { display:block; height:135mm; min-height:0; }
  .photo { position:absolute; width:var(--width); left:var(--left); top:var(--top); transform:rotate(var(--angle)); margin:0; }
  .ruled-section, footer { margin:0; }
  .video-section { break-before:page; }
  .video-grid { grid-template-columns:repeat(3,1fr); }
  .about-section, .contact-section { grid-template-columns:1fr 2fr; }
  .ruled-section { break-inside:avoid; }
  .skip-link, footer a { display:none; }
}