:root{color-scheme:light;--cream:#fff9e9;--ink:#26261f;--gap:clamp(22px,3.1vw,46px);--side:clamp(180px,24vw,350px);--center:clamp(290px,51vw,750px);--row:clamp(330px,35vw,510px)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--ink);font-family:Arial,Helvetica,sans-serif}a{color:inherit;text-underline-offset:5px}button{font:inherit;color:inherit}a:focus-visible,button:focus-visible{outline:3px solid #b23b27;outline-offset:6px}.skip{position:fixed;left:16px;top:-100px;z-index:20;background:var(--cream);padding:16px}.skip:focus{top:10px}
.topbar{position:fixed;z-index:10;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;padding:22px 30px;pointer-events:none}.topbar a,.topbar button{pointer-events:auto;background:var(--cream);border:0;padding:10px 12px;text-decoration:none;font-size:12px}.wordmark{font-weight:700;letter-spacing:.06em}.nav{display:flex;gap:6px;align-items:center}.language{display:flex;gap:0}.language button{cursor:pointer;opacity:.5}.language button[aria-pressed=true]{opacity:1;text-decoration:underline;text-underline-offset:4px}
.scroll-stage{height:245svh}.viewport{height:100svh;position:sticky;top:0;overflow:hidden}.board{position:absolute;top:50%;left:50%;display:grid;grid-template-columns:var(--side) var(--center) var(--side);gap:var(--gap);transform:translate(-50%,-50%) rotate(-29deg);transform-origin:center;will-change:transform}.column{display:flex;flex-direction:column;gap:var(--gap);will-change:transform}.panel{margin:0;height:var(--row);flex:none;overflow:hidden;background:#eee8d9;position:relative}.panel img{display:block;width:100%;height:100%;object-fit:contain}.panel.wide{background:#f2ead7}.panel.white{background:#fff}.hero{display:flex;flex-direction:column;justify-content:space-between;padding:clamp(22px,3.7vw,55px);background:#e9e5d8;overflow:visible}.eyebrow{font-size:clamp(9px,.85vw,12px);text-transform:uppercase;letter-spacing:.13em;margin:0}.hero h1{font-weight:500;font-size:clamp(44px,7.2vw,108px);letter-spacing:-.065em;line-height:.88;margin:22px 0 16px}.profession{font-size:clamp(13px,1.6vw,22px);letter-spacing:-.02em;margin:0}.hero-bottom{display:flex;justify-content:space-between;align-items:end;gap:15px;font-size:clamp(10px,.9vw,13px)}.hero-links{display:flex;gap:18px;flex-wrap:wrap}.status{display:flex;align-items:center;gap:7px}.status:before{content:'';width:5px;height:5px;border-radius:50%;background:currentColor;flex:none}.scroll-cue{position:absolute;bottom:22px;left:30px;background:var(--cream);padding:9px 12px;font-size:11px;letter-spacing:.08em;pointer-events:none}.page-footer{padding:45px 30px 28px;display:flex;justify-content:space-between;gap:24px;align-items:center;font-size:12px;border-top:1px solid #d9d3c3}.footer-links{display:flex;gap:24px}.intro{max-width:780px;margin:0 auto;padding:90px 30px 100px}.intro h2{font-size:clamp(40px,7vw,84px);letter-spacing:-.06em;font-weight:500;line-height:1;margin:20px 0 25px}.intro p{line-height:1.7;font-size:18px}.intro .english{font-size:15px;color:#656458}.intro nav{display:flex;gap:25px;margin-top:30px}.bio-page{min-height:100svh;padding-top:100px}.bio-page .intro{padding-top:50px}.bio-mark{font-size:13px;letter-spacing:.12em;text-transform:uppercase}.notice{padding:20px;border:1px solid #d9d3c3;font-size:14px!important}.preview-tag{position:fixed;right:20px;bottom:16px;z-index:15;background:var(--ink);color:var(--cream);padding:8px 12px;font-size:10px;letter-spacing:.07em;border-radius:2px}
@media(max-width:600px){:root{--center:290px;--side:190px;--row:340px;--gap:24px}.topbar{padding:12px 10px}.topbar a,.topbar button{font-size:11px;padding:9px}.hero{padding:22px}.hero h1{font-size:48px}.profession{font-size:13px}.hero-bottom{align-items:start;flex-direction:column;gap:16px;font-size:10px}.hero-links{gap:18px}.scroll-cue{left:14px;bottom:16px;font-size:9px}.page-footer{padding:28px 20px;flex-direction:column;align-items:start}.intro{padding:60px 24px}.intro p{font-size:16px}.preview-tag{right:10px;bottom:12px;font-size:9px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.scroll-stage{height:100svh}.board,.column{will-change:auto}}
.bio-layout{overflow:hidden;padding:180px 0 210px}.bio-composition{position:relative;width:min(700px,55vw);margin:auto;transform:rotate(-18deg);transform-origin:center}.bio-sheet{position:relative;background:#f5f0e1;padding:62px 48px 34px}.bio-index{text-align:right;font-size:10px;letter-spacing:.22em;margin-bottom:45px}.bio-sheet .bio-mark{font-size:10px}.bio-sheet h1{font-size:clamp(62px,7vw,100px);line-height:.88;letter-spacing:-.065em;font-weight:400;margin:18px 0}.bio-profession{font-size:12px;line-height:1.8;letter-spacing:.16em;text-transform:uppercase;margin:24px 0 7px}.bio-origin{font-size:13px;letter-spacing:.15em;margin:0 0 26px}.clients,.bio-copy{border-top:1px solid #bcb7a8;padding-top:22px;margin-top:24px}.bio-sheet h2{font-size:10px;letter-spacing:.23em;font-weight:400;margin:0 0 23px}.clients ul{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:23px 18px;align-items:center}.clients li{font-size:16px;letter-spacing:-.025em;line-height:1.15}.clients li:nth-child(5),.clients li:nth-child(7){font-weight:700;text-transform:uppercase}.bio-copy p{font-size:15px;line-height:1.65;letter-spacing:.015em;margin:0 0 18px}.bio-contact{border-top:1px solid #bcb7a8;margin-top:28px;padding-top:25px;display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;font-size:10px;letter-spacing:.14em;text-transform:uppercase}.bio-contact a{text-decoration:none}.shop-pending{color:#69665e;letter-spacing:.05em}.bio-rail{position:absolute;top:-180px;width:300px;display:flex;flex-direction:column;gap:36px;pointer-events:none}.bio-rail-left{right:calc(100% + 36px)}.bio-rail-right{left:calc(100% + 36px);top:-40px}.bio-rail .panel{height:430px;background:#eee8d9}.bio-rail .panel img{object-fit:contain}.bio-body .topbar{background:linear-gradient(var(--cream),transparent)}
@media(min-width:1600px){.bio-composition{width:760px}.bio-sheet{padding:70px 58px 40px}}
@media(max-width:900px){.bio-layout{padding:150px 0 170px}.bio-composition{width:65vw}.bio-sheet{padding:42px 30px}.bio-sheet h1{font-size:68px}.clients ul{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.bio-layout{padding:100px 18px 70px;background:linear-gradient(162deg,#e5e0d0 0 8%,var(--cream) 8% 93%,#e5e0d0 93%)}.bio-composition{width:100%;transform:none}.bio-sheet{padding:28px 20px;background:var(--cream)}.bio-index{margin-bottom:32px}.bio-sheet h1{font-size:72px}.bio-profession{font-size:10px;letter-spacing:.12em}.bio-copy p{font-size:15px;line-height:1.75}.clients li{font-size:15px}.bio-rail{display:none}.bio-contact{gap:22px 15px}}
.board{transform-origin:0 0}.hero{height:auto;min-height:570px;overflow:visible;background:#eee8d8;text-align:center;align-items:center;gap:24px;padding:38px 42px}.hero h1{font-size:96px;font-weight:400;line-height:.88;margin:0 0 22px}.hero .profession{font-size:16px;letter-spacing:.17em;text-transform:uppercase}.hero .eyebrow{align-self:flex-start;font-size:10px;letter-spacing:.18em}.hero-message{max-width:480px}.hero .status{justify-content:center;text-transform:uppercase;font-size:12px;font-weight:700;letter-spacing:.2em;margin:0 0 14px}.hero .status:before{display:none}.hero-announcement{font-size:16px;margin:0 0 10px}.hero-description{font-size:15px;line-height:1.65;letter-spacing:.025em;margin:0}.hero .hero-links{justify-content:center;gap:30px;font-size:11px;letter-spacing:.12em;text-transform:uppercase}.hero-links a{text-decoration:none}
.clients{padding-top:14px;margin-top:18px}.clients h2{margin-bottom:14px}.clients ul{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px 14px}.clients li{font-size:13px;line-height:1.2}.clients+.bio-copy{margin-top:18px;padding-top:18px}
.loop-track,.loop-group{display:flex;flex-direction:column;gap:var(--gap)}.loop-track{will-change:transform;animation-duration:var(--loop-duration,120s);animation-timing-function:linear;animation-iteration-count:infinite}.loop-group{flex:none}.loop-up{animation-name:images-up}.loop-down{animation-name:images-down}@keyframes images-up{from{transform:translateY(calc(-1 * var(--loop-distance,2000px)))}to{transform:translateY(calc(-2 * var(--loop-distance,2000px)))}}@keyframes images-down{from{transform:translateY(calc(-2 * var(--loop-distance,2000px)))}to{transform:translateY(calc(-1 * var(--loop-distance,2000px)))}}.motion-paused .loop-track,.motion-hidden .loop-track{animation-play-state:paused}.motion-toggle{position:absolute;right:20px;bottom:56px;z-index:12;border:1px solid #bcb7a8;background:var(--cream);padding:9px 12px;font-size:11px;cursor:pointer}.motion-toggle[aria-pressed=true]{background:#e9e5d8}
.bio-rail{--gap:36px}.bio-rail .panel img{object-fit:cover;object-position:50% 50%}.bio-layout>.motion-toggle{position:fixed;bottom:20px}
.bio-rail img[src*="art-01-"]{object-position:100% 50%}.bio-rail img[src*="art-06-"]{object-position:0% 50%}
@media(max-width:600px){.bio-layout{padding:90px 100px 70px 10px;background:var(--cream)}.bio-composition{width:100%;transform:none}.bio-sheet{padding:28px 12px;background:var(--cream)}.bio-sheet h1{font-size:clamp(48px,15vw,64px)}.bio-rail-left{display:flex;position:fixed;top:76px;bottom:0;left:auto;right:0;width:84px;overflow:hidden;--gap:12px;gap:12px;background:var(--cream)}.bio-rail-left .panel{height:190px;width:84px}.bio-rail-right{display:none}.bio-layout>.motion-toggle{display:block;right:100px;bottom:12px;font-size:10px;padding:8px}.bio-profession{letter-spacing:.06em}.bio-contact{font-size:10px;letter-spacing:.08em}}
@media(max-width:600px) and (prefers-reduced-motion:reduce){.bio-layout>.motion-toggle{display:none}}
.mobile-extra{display:none}
@media(max-width:600px){.mobile-extra{display:block}}
@media(prefers-reduced-motion:reduce){.loop-track{animation:none;transform:none;will-change:auto}.loop-group[aria-hidden=true]{display:none}.motion-toggle{display:none}}
@media(max-width:900px){.clients ul{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 12px}.clients li{font-size:12px}}
@media(max-width:600px){.clients ul{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px 14px}.clients li{font-size:13px}.clients h2{margin-bottom:12px}}
@media(max-width:900px) and (min-width:601px){.hero{min-height:540px;padding:30px;gap:22px}.hero h1{font-size:76px}.hero .profession{font-size:13px}.hero-description{font-size:15px}.hero .hero-links{gap:18px}}
@media(max-width:600px){.hero{min-height:510px;padding:25px 22px;gap:22px}.hero h1{font-size:60px;margin-bottom:20px}.hero .profession{font-size:12px;letter-spacing:.08em}.hero .status{font-size:12px;letter-spacing:.1em}.hero-announcement{font-size:15px}.hero-description{font-size:15px;line-height:1.65}.hero .hero-links{font-size:12px;gap:18px;letter-spacing:.03em}}