@font-face{font-family:Anton;src:url('../assets/fonts/anton-latin.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:Satoshi;src:url('../assets/fonts/satoshi-regular.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:Satoshi;src:url('../assets/fonts/satoshi-bold.woff2') format('woff2');font-weight:700;font-display:swap}
:root{color-scheme:dark;--ink:#f0efe8;--paper:#0a0a09;--edge:clamp(20px,3.5vw,64px)}
*{box-sizing:border-box}
html{background:var(--paper);scroll-padding-top:24px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:Satoshi,sans-serif;font-size:14px;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
a,button{-webkit-tap-highlight-color:transparent}
a:focus-visible,button:focus-visible{outline:2px solid var(--ink);outline-offset:7px}
button,img{-webkit-user-drag:none}
img{display:block;max-width:100%}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.skip-link{position:fixed;top:12px;left:12px;padding:14px;background:var(--ink);color:var(--paper);transform:translateY(-180%);z-index:100}
.skip-link:focus{transform:translateY(0)}
.site-header{position:absolute;inset:0 0 auto;z-index:10;display:grid;grid-template-columns:1fr 1fr auto;align-items:start;padding:27px var(--edge);gap:20px}
.signature{font-weight:700;font-size:16px;letter-spacing:-.035em}
.intro{margin:0;font-size:12px;line-height:1.45}
.work-link{display:flex;align-items:center;gap:24px;font-size:12px}
.work-link span{font-size:10px;opacity:.6;font-variant-numeric:tabular-nums}
.site-header a:hover,.variant-nav a:hover,.site-footer a:hover{text-decoration:underline;text-underline-offset:.3em}
.collage-story{position:relative;height:100svh}
.motion-ready .collage-story{height:360svh}
.collage-stage{position:sticky;top:0;height:100svh;overflow:clip;isolation:isolate;background:var(--paper)}
/* The photographer's full name has its own clear space, above the composition. */
.wordmark{position:absolute;top:10.7%;left:0;width:100%;z-index:7;pointer-events:none;will-change:transform}
.wordmark h1{margin:0;width:100%;text-align:center;font-family:Anton,sans-serif;font-size:17.15vw;line-height:.95;letter-spacing:-.035em;text-transform:uppercase;font-weight:400;white-space:nowrap}
.wordmark h1 span{display:inline-block}
.collage{position:absolute;inset:0;perspective:1500px;perspective-origin:50% 62%;transform-style:preserve-3d;z-index:2}
.plane{position:absolute;transform-style:preserve-3d;will-change:transform;transform-origin:50% 50%}
.plane-content{position:relative;display:block;width:100%;height:100%;padding:0;border:0;border-radius:0;background:transparent;cursor:pointer;will-change:transform;transform-style:preserve-3d}
.photograph{width:100%;height:100%;object-fit:cover}
/* One intact action, two gestures directed inward, one small material detail. */
.plane-pour{left:39%;top:35%;height:52%;aspect-ratio:1920/2878;z-index:3}
.plane-pour .photograph{object-fit:contain}
.plane-perfume{left:11%;top:46%;width:23%;height:31%;z-index:2}
.plane-perfume .photograph{object-position:50% 15%}
.plane-candle{left:64%;top:39%;width:23%;height:41%;z-index:2}
.plane-candle .photograph{object-position:50% 24%}
.plane-fruit{left:31%;top:68%;width:10%;height:20%;z-index:4}
.plane-fruit .photograph{object-position:50% 86%}
.series-caption{position:absolute;left:39%;top:89%;z-index:6;display:flex;gap:20px;align-items:center;padding:0;border:0;background:none;font-size:11px;text-align:left;cursor:pointer}
.series-caption span{font-size:9px;opacity:.55}
.series-caption:hover{text-decoration:underline;text-underline-offset:.3em}
.reveal-link{position:absolute;left:50%;bottom:23%;z-index:8;display:flex;align-items:center;gap:22px;min-height:44px;font-size:13px;transform:translateX(-50%);opacity:0;visibility:hidden}
.reveal-link span{font-size:20px}
.reveal-link:hover{text-decoration:underline;text-underline-offset:.3em}
.stage-footer{position:absolute;inset:auto var(--edge) 22px;z-index:8;display:flex;align-items:center;justify-content:space-between;gap:20px}
.scroll-cue{display:flex;align-items:center;gap:22px;font-size:11px;min-height:44px}
.scroll-cue-arrow{font-size:23px}
.variant-nav{display:flex;gap:24px;align-items:center;font-size:10px;line-height:1.3;text-transform:uppercase;letter-spacing:.035em}
.variant-nav a{min-height:44px;display:flex;align-items:center;opacity:.5}
.variant-nav a[aria-current]{opacity:1}
.variant-nav a[aria-current]::before{content:'[';margin-right:5px}
.variant-nav a[aria-current]::after{content:']';margin-left:5px}
.progress-track{position:absolute;inset:auto 0 0;height:1px;z-index:8;background:#f0efe819}
.progress-track span{display:block;width:100%;height:100%;background:var(--ink);transform:scaleX(0);transform-origin:0 50%}
.site-footer{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;padding:40px var(--edge) max(40px,env(safe-area-inset-bottom));font-size:12px}
.site-footer a{font-weight:700}.site-footer p{margin:0;text-align:right;line-height:1.5;opacity:.6}
.no-script{padding:24px var(--edge)}
@media(min-aspect-ratio:19/10){
  .wordmark{top:14%}.wordmark h1{font-size:12vw}
  .plane-pour{left:43%;top:36%;height:48%}
  .plane-perfume{left:18%;top:43%;width:20%;height:32%}
  .plane-candle{left:62%;top:39%;width:20%;height:39%}
  .plane-fruit{left:34%;top:63%;width:8%;height:20%}
  .series-caption{left:43%;top:87%}
}
@media(max-width:900px) and (min-width:651px) and (min-height:601px){
  .wordmark{top:15%}
  .plane-pour{left:32%;top:36%;height:48%}
  .plane-perfume{left:5%;top:46%;width:28%;height:30%}
  .plane-candle{left:69%;top:40%;width:25%;height:35%}
  .plane-fruit{left:19%;top:69%;width:16%;height:15%}
  .series-caption{left:32%;top:86%}
}
@media(max-width:650px){
  .site-header{padding-top:max(22px,env(safe-area-inset-top));grid-template-columns:1fr auto}
  .signature{font-size:14px}.work-link{font-size:11px;gap:9px}
  .intro{grid-row:2;grid-column:1;font-size:10px;line-height:1.35}
  .motion-ready .collage-story{height:320svh}
  .collage{perspective:950px}
  .wordmark{top:15%}
  .wordmark h1{font-size:31.9vw;line-height:.96;letter-spacing:-.032em;white-space:normal}
  .wordmark h1 span{display:block}
  .plane-pour{left:27%;top:43%;height:38%;z-index:3}
  .plane-perfume{left:3%;top:52%;width:36%;height:22%;z-index:2}
  .plane-candle{left:69%;top:44%;width:28%;height:24%;z-index:4}
  .plane-fruit{left:8%;top:71%;width:23%;height:14%;z-index:4}
  .series-caption{left:27%;top:87%;font-size:10px;gap:10px}
  .series-caption span{font-size:8px}
  .reveal-link{bottom:27%;font-size:12px}
  .stage-footer{bottom:max(12px,env(safe-area-inset-bottom));gap:12px}
  .scroll-cue{gap:15px;font-size:10px}.variant-nav{gap:16px;font-size:9px}
  .site-footer{align-items:flex-start;flex-direction:column;gap:10px;padding-top:12px}
  .site-footer p{text-align:left;font-size:11px}
}
@media(max-height:600px) and (min-width:651px){
  .site-header{padding-top:16px}.signature{font-size:13px}.intro{font-size:10px}
  .wordmark{top:16%}.wordmark h1{font-size:11.5vw}
  .plane-pour{left:43%;top:39%;height:48%}
  .plane-perfume{left:18%;top:48%;width:18%;height:31%}
  .plane-candle{left:65%;top:41%;width:18%;height:37%}
  .plane-fruit{left:33%;top:66%;width:9%;height:22%}
  .series-caption{display:none}.stage-footer{bottom:6px}
  .reveal-link{bottom:16%}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}.collage-story,.motion-ready .collage-story{height:100svh}
  .plane,.plane-content,.wordmark{will-change:auto}.progress-track{display:none}
}