:root { --paper:#f3f2ed; --ink:#171717; --muted:#777772; --line:#aaa9a3; --blue:#4c72ff; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:72px; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:Inter,Arial,sans-serif; }
a { color:inherit; }
button:focus-visible,a:focus-visible { outline:3px solid var(--blue); outline-offset:4px; }
.skip-link { position:fixed; z-index:100; top:12px; left:12px; padding:10px 14px; background:var(--ink); color:#fff; font:11px/1 "DM Mono",monospace; text-decoration:none; transform:translateY(-160%); }
.skip-link:focus { transform:translateY(0); }
.topbar { position:fixed; z-index:20; top:0; left:0; width:100%; height:72px; padding:0 clamp(24px,5vw,72px); display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid rgba(23,23,23,.2); background:rgba(243,242,237,.9); backdrop-filter:blur(12px); }
.brand img { display:block; width:38px; height:38px; object-fit:contain; }
nav { display:flex; gap:clamp(14px,2.5vw,38px); }
nav a { font:9px/1 "DM Mono",monospace; letter-spacing:.04em; text-decoration:none; text-transform:uppercase; }
nav a:hover { text-decoration:underline; text-underline-offset:5px; }
.section-label { color:var(--muted); font:9px/1.3 "DM Mono",monospace; letter-spacing:.04em; text-transform:uppercase; }
.portfolio-section { padding:clamp(72px,8vw,115px) clamp(24px,7vw,110px); }
.print-section { padding-top:clamp(125px,13vw,175px); }
.section-heading { margin-bottom:clamp(38px,5vw,65px); padding-bottom:18px; border-bottom:1px solid var(--line); }
.section-heading__copy h1,.section-heading__copy h2 { margin:8px 0 0; font-size:clamp(2.5rem,5vw,5rem); line-height:1; letter-spacing:-.055em; }
.print-grid { display:grid; grid-template-columns:1fr 1fr; gap:clamp(22px,4vw,64px); align-items:start; }
.print-card { margin:0; }
.print-card--portrait { grid-row:span 2; }
.art-frame { min-height:330px; padding:clamp(18px,3vw,40px); display:flex; align-items:center; justify-content:center; border:1px solid #c1c0ba; background:#e6e5df; }
.print-card--portrait .art-frame { min-height:760px; }
.art-frame img { display:block; max-width:100%; max-height:720px; width:auto; height:auto; box-shadow:0 18px 55px rgba(0,0,0,.12); }
.print-card figcaption { display:flex; justify-content:space-between; gap:20px; padding:15px 0 0; }
.print-card strong { font-size:15px; }
.print-card figcaption span { color:var(--muted); font:8px/1.4 "DM Mono",monospace; text-align:right; text-transform:uppercase; }
.website-section { border-top:1px solid var(--line); background:#e7e6e0; }
.website-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(36px,6vw,88px) clamp(22px,4vw,56px); }
.website-card { min-width:0; }
.website-card img { display:block; width:100%; height:auto; border:1px solid #c3c2bc; background:#0c2132; transition:transform .25s ease,border-color .25s ease; }
.website-card:hover img { transform:translateY(-3px); border-color:#777; }
.website-card__meta { display:flex; align-items:end; justify-content:space-between; gap:20px; padding-top:16px; }
.website-card h3 { margin:0; font-size:clamp(18px,2vw,28px); letter-spacing:-.035em; }
.site-link { flex:0 0 auto; padding-bottom:4px; border-bottom:1px solid #777; color:#666; font:8px/1.2 "DM Mono",monospace; text-decoration:none; text-transform:uppercase; }
.site-link--pending { border-bottom-color:#aaa; color:#888; }
footer { display:flex; justify-content:space-between; gap:30px; padding:35px clamp(24px,7vw,110px); border-top:1px solid var(--line); color:var(--muted); background:var(--paper); font:9px/1 "DM Mono",monospace; text-transform:uppercase; }
footer a { text-decoration:none; }
@media (max-width:760px) {
  html { scroll-padding-top:60px; }
  .topbar { height:60px; padding-inline:20px; }
  .brand img { width:32px; height:32px; }
  nav { gap:12px; } nav a { font-size:8px; } nav a:nth-child(2) { display:none; }
  .print-grid,.website-grid { grid-template-columns:1fr; }
  .print-card--portrait { grid-row:auto; }
  .print-card--portrait .art-frame { min-height:520px; }
  .art-frame { min-height:280px; }
  .website-card__meta { align-items:start; flex-direction:column; gap:10px; }
  footer { flex-direction:column; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } * { transition:none!important; } }