:root { --ink:#151515; --paper:#f8f8f6; --line:#d8d8d4; --mono:'DM Mono',ui-monospace,monospace; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font:13px var(--mono); text-transform:uppercase; -webkit-text-size-adjust:100%; }
a { color:inherit; text-decoration:none; user-select:none; -webkit-user-select:none; }
button { user-select:none; -webkit-user-select:none; }
::selection { color:var(--ink); background:#f4e84b; }
.name-link,.intro-nav a { background:linear-gradient(#f4e84b,#f4e84b); background-size:0 100%; background-repeat:no-repeat; transition:background-size .22s ease; }
.name-link:hover,.name-link:focus-visible,.intro-nav a:hover,.intro-nav a:focus-visible { background-size:100% 100%; opacity:1; }
a:hover { opacity:.52; }
.nav { display:flex; gap:18px; line-height:1; }.nav a:hover { opacity:.52; }
.intro { min-height:34vh; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:12px; padding:18px 20px 34px; text-align:center; }.intro h1 { margin:0; font:500 clamp(22px,3vw,38px)/1 var(--mono); letter-spacing:-.08em; text-transform:none; }.name-link { display:inline-block; }.intro span { color:#81817d; }.intro-nav { margin-top:12px; }
.work-section { padding:0 20px 100px; transition:opacity .2s ease; }.work-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:28px 12px; }.work-card { min-width:0; }.work-card:hover { opacity:1; }.work-image { position:relative; aspect-ratio:3 / 4; overflow:hidden; background:var(--ink); border:1px solid var(--ink); padding:1px; }.work-image img { width:100%; height:100%; object-fit:cover; display:block; filter:grayscale(1) contrast(1.05); transition:transform .45s cubic-bezier(.2,.7,.2,1),filter 1.2s ease; }.work-card:hover img { filter:grayscale(0) contrast(1.02); transform:scale(1.025); }.image-label { position:absolute; z-index:2; left:4px; bottom:4px; color:var(--ink); background:var(--paper); padding:3px 5px; font-size:9px; }.card-info { display:flex; justify-content:space-between; gap:10px; padding-top:9px; font-size:10px; }.card-info span:last-child { color:#81817d; text-align:right; }.work-card:hover .card-info span:first-child { text-decoration:underline; text-underline-offset:3px; }
.contact-section { border-top:1px solid var(--line); padding:18px 20px 78px; }.contact-section h2 { margin:0 0 28px; font:11px var(--mono); }.contact-links { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; width:min(900px,100%); margin:0 auto; }.contact-link { position:relative; isolation:isolate; overflow:hidden; min-height:62px; display:grid; grid-template-columns:1fr auto; grid-template-rows:auto auto; align-items:center; gap:5px 12px; padding:12px 18px; border:1px solid var(--ink); text-transform:none; transition:color .18s,transform .18s,box-shadow .18s; }.contact-link::before { content:""; position:absolute; z-index:-2; inset:0; background:var(--ink); transform:translateY(105%); transition:transform .28s cubic-bezier(.7,0,.2,1); }.contact-link::after { content:""; position:absolute; z-index:-1; inset:0; background:repeating-linear-gradient(0deg,transparent 0 3px,rgba(255,255,255,.14) 3px 4px); opacity:0; transition:opacity .2s; }.contact-link span,.contact-link b,.contact-link i { position:relative; z-index:1; }.contact-link span { grid-column:1 / -1; font:10px var(--mono); text-transform:uppercase; }.contact-link b { font:400 13px var(--mono); overflow-wrap:anywhere; }.contact-link i { font:normal 16px var(--mono); transition:transform .18s; }.contact-link:hover { color:var(--paper); transform:translate(-3px,-3px); box-shadow:5px 5px 0 var(--ink); opacity:1; }.contact-link:hover::before { transform:translateY(0); }.contact-link:hover::after { opacity:1; }.contact-link:hover i { transform:translate(3px,-3px); }
.archive-editor { border-top:1px solid var(--line); padding:18px 20px 80px; }.editor-heading,.editor-row { display:flex; align-items:center; justify-content:space-between; gap:18px; }.editor-heading { margin-bottom:20px; }.editor-heading h2 { margin:0; font:11px var(--mono); }.editor-row { border-top:1px solid var(--line); padding:13px 0; text-transform:none; }.editor-row span { flex:1; }.editor-actions { display:flex; gap:8px; }.editor-button { border:1px solid var(--ink); background:transparent; padding:9px 12px; font:10px var(--mono); text-transform:uppercase; cursor:pointer; }.editor-button:hover { color:var(--paper); background:var(--ink); }
.set-view { border-top:1px solid var(--line); padding:18px 20px 100px; opacity:0; transition:opacity .2s ease; }.set-view.set-view-ready { opacity:1; }.set-header { display:flex; justify-content:space-between; align-items:center; padding-bottom:46px; }.set-header a { display:inline-flex; align-items:center; min-height:38px; padding:0 12px; border:1px solid var(--ink); transition:background .2s,color .2s; }.set-header a:hover { color:var(--paper); background:var(--ink); opacity:1; }.set-intro { display:flex; justify-content:space-between; align-items:baseline; margin-bottom:24px; }.set-intro h2 { margin:0; font:500 clamp(20px,3vw,36px)/1 var(--mono); letter-spacing:-.08em; text-transform:none; }.set-intro span { color:#81817d; }.set-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }.set-image { position:relative; margin:0; background:#e6e6e2; }.set-image img { display:block; width:100%; aspect-ratio:3 / 4; object-fit:cover; }.set-image figcaption { position:absolute; right:8px; bottom:8px; color:#fff; font-size:9px; text-shadow:0 1px 5px #111; }
.info-section { min-height:42vh; border-top:1px solid var(--line); padding:18px 20px 80px; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:28px; text-align:center; }.info-section h2 { width:100%; margin:0; font:11px var(--mono); text-align:left; }.info-copy { max-width:560px; font:15px/1.35 var(--mono); text-transform:none; }.info-copy p { margin:0 auto 28px; }.nationality-block { display:flex; flex-direction:column; align-items:center; gap:10px; }.nationality-label { font:11px var(--mono); text-transform:uppercase; }.nationality { display:flex; align-items:center; justify-content:center; gap:11px; font-size:18px; line-height:1; letter-spacing:0; }.flag-wrap { position:relative; display:inline-flex; align-items:center; line-height:0; }.flag-wrap::after { content:attr(data-country); position:absolute; left:50%; bottom:calc(100% + 8px); transform:translateX(-50%) translateY(3px); padding:5px 7px; color:var(--paper); background:var(--ink); font:10px var(--mono); text-transform:uppercase; white-space:nowrap; opacity:0; pointer-events:none; transition:opacity .15s,transform .15s; }.flag-wrap:hover::after,.flag-wrap:focus-within::after { opacity:1; transform:translateX(-50%) translateY(0); }.flag { display:block; width:44px; height:29px; object-fit:cover; }
.site-footer { border-top:1px solid var(--line); padding:17px 20px 25px; color:#81817d; }.footer-row { display:grid; grid-template-columns:1fr 1fr 1fr; align-items:center; }.timezone { display:flex; justify-content:center; align-items:center; gap:7px; }.timezone img { width:18px; height:18px; object-fit:cover; border-radius:50%; }.footer-row > div { display:flex; justify-content:flex-end; gap:18px; }.footer-row a { color:var(--ink); }.site-credit { display:flex; justify-content:center; align-items:center; gap:5px; padding-top:30px; font-size:9px; opacity:.58; text-transform:none; }.site-credit img { width:15px; height:15px; object-fit:contain; }.site-credit a { color:var(--ink); text-decoration:underline; text-underline-offset:3px; }
.inline-gif { display:inline-block; width:18px; height:18px; object-fit:contain; vertical-align:-4px; }.smiley-gif { margin-left:3px; }
@media(max-width:800px) { .intro { min-height:28vh; padding:16px 12px 25px; }.intro h1 { font-size:22px; }.work-section { padding:0 12px 70px; }.work-grid { grid-template-columns:repeat(2,1fr); gap:28px 8px; }.card-info { display:block; line-height:1.5; }.card-info span { display:block; }.card-info span:last-child { text-align:left; }.set-view { padding:16px 12px 70px; }.set-header { padding-bottom:34px; }.set-intro { display:block; margin-bottom:18px; }.set-intro h2 { margin-bottom:10px; font-size:22px; }.set-grid { display:block; }.set-image { margin-bottom:8px; }.set-image img { max-height:none; }.info-section { min-height:38vh; padding:16px 12px 70px; display:flex; }.info-section h2 { margin-bottom:0; }.info-copy { font-size:13px; max-width:300px; }.contact-section { min-height:0; padding:16px 12px 80px; display:block; }.contact-section h2 { margin-bottom:28px; }.contact-links { grid-template-columns:1fr; gap:8px; max-width:none; }.contact-link { min-height:58px; grid-template-columns:72px 1fr auto; grid-template-rows:1fr; gap:10px; padding:0 13px; }.contact-link span { grid-column:auto; }.contact-link b { font-size:12px; }.contact-link i { font-size:15px; }.archive-editor { padding:16px 12px 70px; }.editor-row { align-items:flex-start; }.editor-actions { flex-direction:column; }.site-footer { padding:17px 12px; }.footer-row { grid-template-columns:1fr 1fr; gap:18px; }.timezone { justify-content:flex-end; }.footer-row > div { grid-column:1 / -1; justify-content:flex-end; }.site-credit { padding-top:26px; } }
.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; }
.set-notes { margin-top:72px; border-top:1px solid var(--line); }.set-note { display:grid; grid-template-columns:1fr 3fr; gap:12px; padding:18px 0 34px; border-bottom:1px solid var(--line); }.set-note h3 { margin:0; font:11px var(--mono); text-transform:uppercase; }.set-note p { max-width:560px; margin:0; font:15px/1.35 var(--mono); text-transform:none; }
@media(max-width:800px) { .set-note { display:block; }.set-note h3 { margin-bottom:18px; }.set-note p { font-size:13px; } }
.font-scale-final { font-size:inherit; }
body { font-size:15px; }
.intro h1 { font-size:clamp(24px,3vw,40px); }
.image-label,.flag-wrap::after,.set-image figcaption { font-size:11px; }
.card-info { font-size:12px; }
.contact-section h2,.info-section h2,.set-note h3,.editor-heading h2 { font-size:13px; }
.contact-link span,.editor-button { font-size:12px; }
.contact-link b { font-size:15px; }
.contact-link i { font-size:18px; }
.set-intro h2 { font-size:clamp(22px,3vw,38px); }
.info-copy,.set-note p { font-size:17px; }
.nationality { font-size:20px; }
.nationality-label { font-size:13px; }
.site-credit { font-size:11px; }
@media(max-width:800px) { .intro h1 { font-size:24px; }.set-intro h2 { font-size:24px; }.info-copy,.set-note p { font-size:15px; }.contact-link b { font-size:14px; }.contact-link i { font-size:17px; }.editor-button { font-size:12px; } }
.flag { border:1px solid var(--ink); box-shadow:2px 2px 0 rgba(21,21,21,.35); }
.flag { transition:transform .18s ease,box-shadow .18s ease; }.flag-wrap:hover .flag,.flag-wrap:focus-within .flag { transform:translate(-1px,-1px) rotate(-2deg); box-shadow:3px 3px 0 rgba(21,21,21,.4); }
