:root{color-scheme:dark;font-family:'Courier New',monospace;color:#e9e6e0;background:#080808;font-size:12px}*{box-sizing:border-box}body{margin:0;min-height:100vh}body:before{content:'';position:fixed;inset:0;pointer-events:none;z-index:-1;opacity:.18;background-image:url('/assets/grain.svg')}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}a:focus-visible,button:focus-visible{outline:2px solid #f7f2e9;outline-offset:6px}header{height:116px;display:flex;align-items:center;padding:0 38px;gap:30px}.wordmark{font-size:17px;letter-spacing:-1px}.identity{margin-left:auto;color:#a29e97;font-size:11px}#menu-button{width:31px;height:30px;border:0;background:none;padding:3px 0;display:flex;flex-direction:column;justify-content:space-evenly;z-index:30}#menu-button span{height:1px;background:#eee;width:30px;transition:transform .25s,opacity .25s}body.menu-open #menu-button span:first-child{transform:translateY(8px) rotate(45deg)}body.menu-open #menu-button span:nth-child(2){opacity:0}body.menu-open #menu-button span:last-child{transform:translateY(-8px) rotate(-45deg)}#menu{position:fixed;inset:0;background:#080808 url('/assets/grain.svg');z-index:20;display:flex;align-items:center;justify-content:center}#menu[hidden]{display:none}#menu>div{width:min(630px,75vw);display:grid;gap:9px}#menu a{display:block;text-align:center;padding:19px;font-size:17px;transition:background .2s,color .2s}#menu a:hover,#menu a.active{background:#e9e6e0;color:#080808}#menu small{position:absolute;bottom:35px;left:38px;line-height:1.8;color:#999}body.menu-open{overflow:hidden}main{max-width:910px;margin:12px auto 100px;padding:0 2px;min-height:56vh}.topline{display:flex;justify-content:space-between;align-items:center;margin:0 0 24px;color:#9a9690;font-size:10px;letter-spacing:.04em}.filters{display:flex;gap:20px}.filters .active{color:#eee;text-decoration:underline;text-underline-offset:5px}.grid{display:grid;grid-template-columns:1fr 1fr;gap:25px 42px}.card h2{font-size:12px;font-weight:400;margin:0 0 10px}.frame{position:relative;aspect-ratio:16/9;border:1px solid #c9c6be;overflow:hidden;background:#111}.frame img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .65s,filter .65s;filter:brightness(.82)}.card:hover img{transform:scale(1.035);filter:brightness(1)}.frame:after{content:'open ↗';position:absolute;bottom:12px;right:12px;opacity:0;transition:opacity .2s}.card:hover .frame:after{opacity:1}.tag{position:absolute;left:11px;top:11px;font-size:9px;letter-spacing:.12em;color:#e0dbd0}.card-meta{display:flex;justify-content:space-between;color:#77736c;font-size:9px;margin-top:8px}.page-head{margin:15px 0 35px}.back{color:#a09a91;font-size:11px}.page-head h1{font-size:24px;font-weight:400;margin:35px 0 12px;letter-spacing:-1px}.muted{color:#99948d;line-height:1.8}.media{aspect-ratio:16/9;position:relative;border:1px solid #9d9990;overflow:hidden}.media>img{width:100%;height:100%;object-fit:cover}.media button{position:absolute;inset:0;border:0;background:#0003;display:grid;place-content:center;gap:13px;text-align:center}.play{border:1px solid #ddd;border-radius:50%;width:64px;height:64px;display:grid;place-content:center;margin:auto;font-size:20px}.media iframe{width:100%;height:100%;border:0}.notice{border-top:1px solid #333;padding-top:18px;color:#a9a297;line-height:1.8}.gallery{display:grid;gap:25px}.gallery button{padding:0;border:0;background:none}.gallery img{display:block;width:100%}.project-bottom{display:flex;justify-content:space-between;margin-top:45px;border-top:1px solid #333;padding-top:20px}.text-page{max-width:600px;padding:40px 0 100px}.text-page h1{font-size:40px;font-weight:400;letter-spacing:-2px}.text-page p{font-size:14px;line-height:1.9}.contact-link{display:inline-block;font-size:clamp(15px,3vw,26px);border-bottom:1px solid #888;padding-bottom:9px;margin:25px 0}footer{max-width:910px;margin:0 auto;padding:24px 0 32px;border-top:1px solid #282725;display:flex;justify-content:space-between;color:#8e8981;font-size:10px}dialog{background:#080808;border:0;padding:45px 10px 10px;max-width:95vw;max-height:95vh}dialog::backdrop{background:#000e}dialog img{max-width:90vw;max-height:80vh}dialog button{position:absolute;right:10px;top:12px;background:none;border:0}.skip{position:absolute;left:15px;top:-100px}.skip:focus{top:10px;z-index:99;background:#000;padding:15px}@media(max-width:700px){header{height:100px;padding:0 22px;gap:20px}.identity{display:none}main{margin:5px 22px 70px;padding:0}.grid{grid-template-columns:1fr;gap:29px}.topline{align-items:flex-start;gap:20px}.filters{gap:15px}.page-head h1{font-size:22px}.text-page{padding-top:20px}.text-page h1{font-size:32px}footer{margin:0 22px;gap:20px;flex-wrap:wrap}footer span{order:3;width:100%}#menu small{left:22px}}@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
/* Art direction: ink, optical diffusion and translucent industrial surfaces. */
@font-face{font-family:Ink;src:url('/assets/display.ttf') format('truetype');font-weight:900;font-display:swap}:root{background:#06090c;color:#e4e8ec;--ice:#dfe8f4;--ink:#295474;--line:#718697}body{background:radial-gradient(ellipse at 75% 10%,#15222c55,transparent 40%)}body:before{opacity:.065}header{height:94px;border-bottom:1px solid #c8dcf014;margin:0 38px;padding:0;position:relative;z-index:25}.wordmark{letter-spacing:-.06em}.identity{color:#a0adb8}main{max-width:1080px;margin-top:0}.masthead{position:relative;padding:34px 0 25px;margin-bottom:44px;border-bottom:1px solid #8495a34a}.registration,.masthead-bottom{display:flex;justify-content:space-between;font-size:9px;letter-spacing:.09em;color:#9faebc}.display-title{font-family:Ink,Georgia,serif;font-weight:900;font-size:clamp(78px,13.5vw,179px);letter-spacing:-.085em;line-height:1.13;margin:18px 0 25px;padding-right:.08em;background:linear-gradient(100deg,#e3e9ec 3%,#8faac0 45%,#edf0f0 65%,#789cb7 100%);background-clip:text;-webkit-background-clip:text;color:transparent;filter:blur(.45px);text-shadow:0 0 13px #8aaec51a}.masthead:before,.masthead:after{content:'+';position:absolute;color:#8b9cae;font-size:16px;bottom:-9px}.masthead:before{left:-5px}.masthead:after{right:-5px}.topline{margin-bottom:23px;color:#a3afbc}.grid{gap:37px 40px}.card h2{color:#d9dfe4}.frame{border:0;padding:5px;background:linear-gradient(#9cafbc,#9cafbc) top left/15px 1px no-repeat,linear-gradient(#9cafbc,#9cafbc) top left/1px 15px no-repeat,linear-gradient(#9cafbc,#9cafbc) bottom right/15px 1px no-repeat,linear-gradient(#9cafbc,#9cafbc) bottom right/1px 15px no-repeat}.frame img{filter:none}.tag{top:auto;bottom:15px;left:15px;padding:8px 10px;background:#dae7f019;border:1px solid #c9d9e633;backdrop-filter:blur(13px);-webkit-backdrop-filter:blur(13px);font-size:8px;color:#e3eaf0}.card-meta{color:#a2afba}.frame:after{background:#deebf21c;padding:8px;backdrop-filter:blur(10px);bottom:15px;right:15px}#menu{background:#dbe4efb8;backdrop-filter:blur(28px) saturate(.4);-webkit-backdrop-filter:blur(28px) saturate(.4);color:#162b3c}#menu:before{content:'';position:absolute;inset:10% 8%;border:1px solid #344c663b;pointer-events:none;background:linear-gradient(90deg,transparent 49.9%,#274b6325 50%,transparent 50.1%)}#menu>div{position:relative;width:min(750px,80vw);gap:0}.menu-caption{font-size:9px;letter-spacing:.18em;margin-bottom:25px;border-bottom:1px solid #304d6740;padding-bottom:15px}#menu a{font-family:Ink,Georgia,serif;font-weight:900;font-size:clamp(31px,5vw,59px);letter-spacing:-.055em;padding:10px 15px;text-align:left}#menu a:hover,#menu a.active{background:#eaf1f447;color:#245678}#menu small{color:#233f54}body.menu-open #menu-button span{background:#203f54}.project-caption{margin:28px 0 0;padding:25px 30px;background:linear-gradient(120deg,#d4e4f021,#8cacc50c);border:1px solid #c7dce82c;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);width:fit-content;max-width:100%;position:relative}.micro{font-size:9px;color:#a7bfd2;letter-spacing:.1em}.page-head h1{font-family:Ink,Georgia,serif;font-weight:900;letter-spacing:-.055em;font-size:clamp(30px,4.5vw,57px);margin:16px 0}.page-head p{margin-bottom:0}.media{border-color:#6d81934a}.play{background:#bcd6ea1c;border-color:#d4e8f380;backdrop-filter:blur(14px)}.text-page{max-width:100%;padding-top:40px}.text-page h1{font-family:Ink,Georgia,serif;font-weight:900;font-size:clamp(64px,12vw,150px);letter-spacing:-.075em;color:#c8dbe9}.text-page p{max-width:600px}.notice{border-color:#c0d8e32b;color:#a3b2bf}.contact-link{color:#c7dcea;border-color:#6d8aa0}.project-bottom{border-color:#c0d8e32b}footer{max-width:1080px;color:#a1aeb9;border-color:#a2b9cc30}.arriving{animation:resolve .6s ease both}@keyframes resolve{from{opacity:.3;filter:blur(3px);transform:translateY(5px)}to{opacity:1;filter:blur(0);transform:none}}@media(max-width:1150px){main,footer{margin-left:6%;margin-right:6%}}@media(max-width:700px){header{margin:0 22px;height:82px}.masthead{padding-top:26px;margin-bottom:30px}.registration{font-size:8px}.display-title{font-size:clamp(56px,15vw,103px);margin:24px 0 29px}.masthead-bottom{font-size:8px;letter-spacing:0}main{margin-left:22px;margin-right:22px}.grid{gap:30px}.project-caption{padding:22px 19px}.text-page h1{font-size:clamp(55px,13vw,90px)}.contact-link{font-size:clamp(13px,4vw,22px)}footer{margin:0 22px}#menu a{padding:15px 8px}#menu:before{inset:12% 5%}}@media(prefers-reduced-motion:reduce){.arriving{animation:none}}
/* Analog surface texture: present across the canvas, clear above imagery. */
body:before{z-index:0;opacity:.23;mix-blend-mode:screen;background-size:190px 190px}
body:after{content:'';position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.24;background:repeating-linear-gradient(0deg,transparent 0,transparent 3px,#9cb8cc0b 3px,#9cb8cc0b 4px),radial-gradient(ellipse at 18% 30%,#6b8ba11a,transparent 50%),radial-gradient(ellipse at 90% 70%,#859aa914,transparent 40%)}
main,footer{position:relative;z-index:1}
#menu:after{content:'';position:absolute;inset:0;background:url('/assets/grain.svg') repeat;background-size:150px;opacity:.2;mix-blend-mode:multiply;pointer-events:none}
#menu>div,#menu small{z-index:1}
.project-caption:after{content:'';position:absolute;inset:0;background:url('/assets/grain.svg') repeat;background-size:130px;opacity:.15;pointer-events:none}
.masthead{background:radial-gradient(ellipse at 54% 48%,#a2badb08,transparent 65%)}
/* Static hover states: preserve keyboard focus indicators. */
.card .frame img,.card:hover .frame img{transform:none;filter:none;transition:none}
.frame:after,.card:hover .frame:after{display:none;transition:none}
#menu a,#menu a:hover{transition:none}
#menu a:hover:not(.active){background:transparent;color:inherit}
/* Editorial contact sheet: natural image ratios, compact columns. */
.gallery{display:block;columns:3;column-gap:18px;max-width:100%;margin:0 auto}
.gallery button{display:block;width:100%;break-inside:avoid;margin:0 0 18px;position:relative;cursor:zoom-in}
.gallery img{width:100%;height:auto;display:block}
@media(max-width:900px){.gallery{columns:2;column-gap:14px}.gallery button{margin-bottom:14px}}
@media(max-width:480px){.gallery{columns:2;column-gap:10px}.gallery button{margin-bottom:10px}}
/* Organic ink surface, without changing the composition. */
body:before{opacity:.37;background-size:135px 135px}
body:after{opacity:.3}
.display-title{background-image:url('/assets/ink-grain.svg'),linear-gradient(100deg,#e3e9ec 3%,#8faac0 45%,#edf0f0 65%,#789cb7 100%);background-size:180px 180px,100% 100%;background-repeat:repeat,no-repeat;background-blend-mode:multiply;filter:blur(.55px);text-shadow:0 0 9px #9dbbd22b,1px 0 2px #d8e5ed20}
.project-caption:after{opacity:.25}
#menu:after{opacity:.29}
/* Wet ink: uneven edges and softened joins, static and selectable. */
.display-title{letter-spacing:-.095em;filter:url('#ink-bleed');text-shadow:0 0 2px #c4d7e8b3}
.text-page h1,#menu a{filter:url('#ink-bleed');letter-spacing:-.065em}
@media(max-width:700px){.display-title{letter-spacing:-.09em}}
.display-title{filter:url('#ink-bleed');text-shadow:0 0 1px #c4d7e84d}
.text-page h1{filter:none}
#menu a{filter:none}
@media(max-width:700px){.display-title{filter:url('#ink-bleed')}}
/* Soft optical diffusion around the large ink title. */
.display-title{text-shadow:0 0 2px #d9e9f5a8,0 0 7px #9bc9e35c,0 0 17px #78a9c32e;filter:url('#ink-bleed') blur(.42px)}
.camera-links{display:flex;gap:20px;padding:13px 0}.camera-link{background:transparent;border:0;border-bottom:1px solid #8399aa;color:#cad8e2;padding:8px 0;font:inherit;font-size:11px;cursor:pointer}
/* Warehouse project: three lazy-loaded films in a quiet vertical sequence. */
.clip-stack{display:grid;gap:clamp(28px,5vw,68px)}
.clip-heading{display:flex;justify-content:space-between;margin:0 0 10px;color:#9aabb8;font-size:10px;letter-spacing:.12em}
.clip-item .media{margin:0}
.clip-play{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;border:0;background:#07101830;color:#fff;cursor:pointer;font:inherit;font-size:11px;letter-spacing:.1em;text-transform:uppercase}
.clip-play .play{font-size:38px;text-shadow:0 1px 14px #000}
/* Use a geometric icon instead of a font glyph for consistent playback controls. */
.play-icon{display:block;width:22px;height:22px;fill:currentColor}
.clip-play .play{font-size:0;text-shadow:none}
/* Homepage project tiles: three compact columns with a crisp white frame. */
.grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px 24px}
.frame{border:2px solid #f4f1eb;padding:0;background:#111}
.frame img{width:100%;height:100%;object-fit:cover}
@media(max-width:980px){.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 24px}}
@media(max-width:580px){.grid{grid-template-columns:1fr;gap:28px}}
/* Homepage requested layout: return to two project columns and reclaim space above. */
.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 36px}
.masthead{margin-bottom:34px;padding-bottom:18px}
.masthead .display-title{font-size:clamp(70px,12vw,160px);margin:12px 0 18px}
@media(max-width:700px){.masthead .display-title{font-size:clamp(54px,13vw,88px);margin:16px 0 20px}.grid{gap:26px 20px}}
@media(max-width:580px){.grid{grid-template-columns:1fr}}
/* Photo project covers retain their native proportions instead of being cropped into 16:9. */
.card.photo-card .frame{aspect-ratio:auto;height:auto}
.card.photo-card .frame img{display:block;width:100%;height:auto;object-fit:contain}
/* Uniform project-card boxes; crop around the image center without stretching. */
.card.photo-card .frame{aspect-ratio:16/9;height:auto}
.card.photo-card .frame img{width:100%;height:100%;object-fit:cover;object-position:center}
/* Remove the registration crosses and strengthen the grain in the wordmark only. */
.masthead:before,.masthead:after{content:none;display:none}
.masthead .display-title{background-size:100px 100px,100% 100%;background-blend-mode:soft-light,normal;filter:url('#ink-bleed') blur(.28px)}

.media video{display:block;width:100%;height:100%;object-fit:contain;background:#000}

/* Light home variation: swap the background and the leodotmov ink. */
body.home-inverted{background:#dce6ed;color:#172d3f;color-scheme:light}
body.home-inverted:before{opacity:.16;mix-blend-mode:multiply}
body.home-inverted:after{background:radial-gradient(ellipse at 75% 10%,#fff9,transparent 52%),radial-gradient(ellipse at 15% 80%,#65829c18,transparent 55%)}
.home-inverted header{border-bottom-color:#243e5040}
.home-inverted .wordmark,.home-inverted .identity{color:#1c3345}
.home-inverted #menu-button span{background:#1c3345}
.home-inverted .masthead{background:radial-gradient(ellipse at 54% 48%,#fff8,transparent 66%);border-bottom-color:#28445a55}
.home-inverted .display-title{background-image:url('/assets/ink-grain.svg'),linear-gradient(100deg,#0d1a24 3%,#294f6a 45%,#142b3c 65%,#3d6681 100%);text-shadow:0 0 2px #172c456b,0 0 8px #3257744a,0 0 18px #365f7926}
.home-inverted .masthead-bottom,.home-inverted .topline{color:#40586a}
.home-inverted .filters .active{color:#142d3e}
.home-inverted .card h2{color:#172d3f}
.home-inverted .card-meta{color:#4a6070}
.home-inverted footer{color:#40586a;border-color:#28445a55}
.home-inverted a:focus-visible,.home-inverted button:focus-visible{outline-color:#172d3f}

/* Frosted paper, faint reproduction marks and saturated ink for the light home. */
body.home-inverted{background-color:#dce7ef;background-image:url('/assets/grain.svg'),radial-gradient(ellipse at 76% 8%,#f7fbff 4%,transparent 51%),radial-gradient(ellipse at 17% 74%,#8facbf88,transparent 61%),linear-gradient(112deg,#d6e3ed,#e8f0f4 54%,#bfd3e2);background-size:210px 210px,100% 100%,100% 100%,100% 100%;background-blend-mode:multiply,normal,normal,normal}
body.home-inverted:after{z-index:24;opacity:.43;mix-blend-mode:multiply;background-image:url('/assets/grain.svg'),repeating-linear-gradient(0deg,transparent 0 156px,#46688111 156px 157px,transparent 157px 311px);background-size:160px 160px,100% 100%}
.home-inverted.menu-open:after{opacity:0}
.home-inverted .masthead{background:none}
.home-inverted .masthead .display-title{background:none;background-clip:border-box;-webkit-background-clip:border-box;color:#17364a;-webkit-text-fill-color:#17364a;filter:url('#home-ink-bleed');text-shadow:none}
.home-inverted .frame img{filter:saturate(.96) contrast(1.03)}
@media(max-width:700px){body.home-inverted:after{opacity:.3}.home-inverted .masthead .display-title{background-size:125px 125px,100% 100%}}

/* Original supplied title: white pixels blend into the textured paper. */
.home-inverted .masthead .custom-wordmark{filter:none;overflow:hidden;line-height:0;text-shadow:none}
.home-inverted .custom-wordmark img{display:block;width:112%;max-width:none;height:auto;margin:-2.8% 0 -2.8% -6%;mix-blend-mode:normal;filter:url('#white-knockout')}

/* The project titles and navigation carry the page; hide decorative hover copy. */
.topline{justify-content:flex-end}
.frame:after{content:none!important}

/* Project galleries: consistent row starts with generous breathing room. */
.gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px;columns:auto;align-items:start}
.gallery button{margin:0;align-self:start}
.gallery img{width:100%;height:auto;object-fit:contain;object-position:top}
@media(max-width:900px){.gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;columns:auto}}
@media(max-width:480px){.gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;columns:auto}}

/* White photo borders, matching the reference contact sheet. */
.gallery button{border:3px solid #f4f4f2}

/* Each column follows the natural height of its images. */
.gallery-column{display:flex;flex-direction:column;gap:36px;min-width:0}
.gallery-column button{display:block;width:100%}
@media(max-width:900px){.gallery-column{gap:24px}}
@media(max-width:480px){.gallery-column{gap:16px}}

/* Project pages: typewriter heading on black film stock. */
body.project-page{background:#030303}
body.project-page:before{background-image:url('/assets/project-dust.svg');background-size:640px 640px;opacity:.8;mix-blend-mode:normal}
body.project-page:after{background:url('/assets/grain.svg') repeat;background-size:165px 165px;opacity:.22;mix-blend-mode:screen}
.project-page .project-caption{display:block;width:auto;margin:30px 0 0;padding:0;border:0;background:none;backdrop-filter:none;-webkit-backdrop-filter:none}
.project-page .project-caption:after{content:none}
.project-page .page-head h1{font-family:'Courier New',monospace;font-size:clamp(27px,3.3vw,43px);font-weight:400;line-height:1.2;letter-spacing:-.06em;color:#f0f0ec;margin:0}

/* Stronger film noise on the black project canvas, behind the work. */
body.project-page:before{background-size:500px 500px;opacity:1}
body.project-page:after{background-size:115px 115px;opacity:.54}

/* The project film texture belongs to the page and scrolls with it. */
body.project-page{position:relative}
body.project-page:before,body.project-page:after{position:absolute}

/* Keep the figure's head visible in Iceland's landscape cover crop. */
.card[href="#/projet/iceland"] .frame img{object-position:50% 18%}
.card[href="#/projet/dnd-la-boule-noire"] .frame img{object-position:50% 22%}
.card[href="#/projet/sleeplight-la-boule-noire"] .frame img{object-position:50% 30%}

/* About: one portrait and a short introduction. */
.about-page{padding:38px 0 90px}
.about-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);align-items:center;gap:clamp(34px,6vw,80px);margin-top:42px}
.about-portrait{margin:0;border:3px solid #f4f4f2}
.about-portrait img{display:block;width:100%;height:auto}
.about-copy h1{font-family:'Courier New',monospace;font-size:clamp(30px,4vw,50px);font-weight:400;letter-spacing:-.06em;margin:0 0 32px}
.about-copy p{font-size:clamp(19px,2.6vw,29px);line-height:1.4;margin:0;max-width:18em}
.about-copy .contact-link{margin-top:40px}
@media(max-width:700px){.about-page{padding-top:20px}.about-layout{grid-template-columns:1fr;gap:30px;margin-top:30px}.about-copy h1{margin-bottom:18px}.about-copy .contact-link{margin-top:24px}}

.contact-links{display:flex;flex-direction:column;align-items:flex-start;gap:18px;margin:25px 0}.contact-links .contact-link{margin:0}