*{background-color:#f2f2f2}
@font-face{font-family:davidfont;src:url("/assets/davidfont.woff2")format("woff2");font-display:swap;font-weight:normal}
@font-face{font-family:davidfont;src:url("/assets/davidfont-bold.woff2")format("woff2");font-display:swap;font-weight:bold}
body{background-color:#f2f2f2;font-family:davidfont,system-ui,sans-serif;line-height:1.5;margin:0}
main{max-width:80ch;padding:2ch;margin:0 auto}
h1{font-weight:normal;font-size:1.875rem;margin:0 0 1em}
h2{font-weight:normal;font-size:1.5rem}
h3{font-weight:normal;font-size:1.125rem}
h4{font-weight:normal;font-size:0.875rem}
p{max-width:70ch}
a{color:#000}
img{width:100%;border-radius:15px;margin:2em 0}
hr{border:0;border-top:1px solid #dcdcdc;margin:2em 0}
li{margin:0 0 0.5em}
@media (min-width:900px){main{padding:4ch}}
/* --- Portfolio gallery --- */
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1em;margin:1em 0 0}
.work{border:1px solid #dcdcdc;border-radius:15px;padding:0.75em}
.work a{text-decoration:none}
.work a:hover,.work a:focus{text-decoration:none;color:inherit}
.work img{margin:0 0 0.75em}
.work .title{display:block;font-size:1rem}
.work .meta{display:block;font-size:0.875rem;opacity:0.8}
/* --- Pure-static lightbox via :target --- */
.lightbox{position:fixed;inset:0;display:none;overflow:auto;padding:2ch;background-color:rgba(242,242,242,0.98)}
.lightbox:target{display:block}
.lightbox .frame{max-width:110ch;margin:0 auto}
.lightbox .top{display:flex;justify-content:space-between;align-items:baseline;gap:1em;margin:0 0 1em}
.lightbox .close{text-decoration:underline}
.lightbox img{margin:0}