body{margin:0;background:#0D0C0B;color:#ECE7DF;font-family:"Hanken Grotesk",system-ui,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
.xy{--bg:#0D0C0B;--bg2:#141311;--bg3:#1A1917;--line:rgba(236,231,223,.12);--line2:rgba(236,231,223,.26);--tx:#ECE7DF;--tx2:#B4ADA2;--tx3:#8E877D;--acc:#D8C6A6;--g:clamp(20px,4vw,64px);--serif:"Instrument Serif","Times New Roman",serif;--sans:"Hanken Grotesk",system-ui,sans-serif;--mono:"IBM Plex Mono",ui-monospace,monospace;--ease:cubic-bezier(.2,.7,.1,1);min-height:100vh;background:var(--bg);color:var(--tx);font-family:var(--sans);font-size:16px;line-height:1.55;position:relative;overflow-x:clip}
.xy *,.xy *::before,.xy *::after{box-sizing:border-box}
.xy a{color:inherit;text-decoration:none}
.xy button,.xy select{font:inherit;color:inherit;background:none;border:0;padding:0;margin:0;cursor:pointer}
.xy h1,.xy h2,.xy h3,.xy p,.xy dl,.xy dd,.xy figure,.xy ul,.xy ol{margin:0;padding:0}
.xy ul,.xy ol{list-style:none}
.xy img,.xy video{display:block;max-width:100%}
.xy :focus-visible{outline:1px solid var(--acc);outline-offset:4px}
#main:focus{outline:none}
.lbl{font-family:var(--mono);font-size:11px;font-weight:400;letter-spacing:.14em;text-transform:uppercase;color:var(--tx2);line-height:1.4}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:fixed;left:16px;top:-80px;z-index:100;background:var(--tx);color:var(--bg)!important;padding:12px 16px;font-size:14px}
.skip:focus{top:16px}

/* ---------- navigation ---------- */
.nav{position:fixed;left:0;right:0;top:0;z-index:50;display:flex;align-items:flex-start;justify-content:space-between;padding:20px var(--g);pointer-events:none}
.nav>*{pointer-events:auto}
.brand{display:flex;flex-direction:column;gap:5px;padding:8px 0;text-align:left;transition:opacity .6s var(--ease),visibility .6s}
.brand-n{font-family:var(--serif);font-size:24px;line-height:1;letter-spacing:.005em;color:var(--tx)}
.brand-t{font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--tx2)}
.nav.at-hero .brand{opacity:0;visibility:hidden}
.brand{border:1px solid transparent;transition:opacity .6s var(--ease),visibility .6s,background-color .5s var(--ease),border-color .5s var(--ease),padding .5s var(--ease)}
.nav.is-solid .brand{background:rgba(20,19,17,.94);border-color:var(--line);padding:8px 14px}
.idx{display:flex;border:1px solid transparent;transition:background-color .5s var(--ease),border-color .5s var(--ease)}
.nav.is-solid .idx{background:rgba(20,19,17,.94);border-color:var(--line)}
.idx a{position:relative;display:flex;align-items:baseline;gap:7px;min-height:44px;padding:14px 16px 13px;font-size:13px;letter-spacing:.05em;color:var(--tx2);transition:color .3s}
.idx a:hover,.idx a[aria-current="page"]{color:var(--tx)}
.idx a i,.menu-a i{font-style:normal;font-family:var(--mono);font-size:9.5px;letter-spacing:.08em;color:var(--tx3)}
.idx a::after{content:"";position:absolute;left:16px;right:16px;bottom:8px;height:1px;background:var(--tx);transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease)}
.idx a[aria-current="page"]::after{transform:scaleX(1)}
.nav-toggle{display:none;min-height:44px;padding:0 16px;border:1px solid var(--line2);background:rgba(20,19,17,.9);font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase}
.menu{position:fixed;inset:0;z-index:60;background:#121110;display:flex;flex-direction:column;padding:20px var(--g) 32px;overflow:auto}
.menu-top{display:flex;justify-content:space-between;align-items:center;min-height:48px}
.menu-close{min-height:44px;padding:0 16px;border:1px solid var(--line2);font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase}
.menu-list{display:flex;flex-direction:column;gap:4px;margin-top:auto;padding:48px 0}
.menu-a{display:flex;align-items:baseline;gap:14px;font-family:var(--serif);font-size:48px;line-height:1.12;color:var(--tx2)}
.menu-a[aria-current="page"]{color:var(--tx)}
.menu-foot{border-top:1px solid var(--line);padding-top:20px}

/* ---------- hero ---------- */
.hero{position:relative;height:100vh;height:100svh;min-height:560px;overflow:hidden;background:var(--bg2);isolation:isolate}
.hero-ph{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-align:center;padding:24px;background:#141311}
.hero-poster,.hero-video{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover}
.hero-poster,.hero-video{transition:opacity 1.4s var(--ease),transform 2.8s cubic-bezier(.16,1,.3,1),filter 2.4s var(--ease)}
.hero-video{opacity:0}
.hero-video.is-ready{opacity:1}
.hero-shade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(to bottom,rgba(13,12,11,.5) 0%,rgba(13,12,11,0) 24%,rgba(13,12,11,0) 48%,rgba(13,12,11,.78) 100%)}
.vf span{position:absolute;width:16px;height:16px;border:0 solid rgba(236,231,223,.45)}
.vf span:nth-child(1){top:12px;left:12px;border-top-width:1px;border-left-width:1px}
.vf span:nth-child(2){top:12px;right:12px;border-top-width:1px;border-right-width:1px}
.vf span:nth-child(3){bottom:12px;left:12px;border-bottom-width:1px;border-left-width:1px}
.vf span:nth-child(4){bottom:12px;right:12px;border-bottom-width:1px;border-right-width:1px}
.hero-copy{position:absolute;left:var(--g);right:var(--g);bottom:clamp(104px,15vh,150px);max-width:1100px}
.hero-role{color:var(--tx)}
.hero-name{font-family:var(--serif);font-weight:400;font-size:clamp(64px,11.4vw,184px);line-height:.84;letter-spacing:-.012em;margin:18px 0 22px!important}
.hero-name span{display:block}
.hero-name span+span{padding-left:.6em}
.hero-desc{font-size:14px;letter-spacing:.1em;color:var(--tx2)}
.cta{display:inline-flex;align-items:center;gap:16px;min-height:44px;margin-top:22px;font-size:14px;letter-spacing:.06em;color:var(--tx)}
.cta-rule{display:block;width:56px;height:1px;background:currentColor;transition:width .6s var(--ease)}
.cta:hover .cta-rule{width:96px}
.scroll{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:10px;min-width:44px;min-height:44px}
.scroll-line{position:relative;display:block;width:1px;height:44px;background:rgba(236,231,223,.2);overflow:hidden}
.scroll-line::after{content:"";position:absolute;left:0;top:0;width:1px;height:40%;background:var(--tx);animation:xyScroll 2.6s var(--ease) infinite}
@keyframes xyScroll{0%{transform:translateY(-110%)}100%{transform:translateY(260%)}}
.hctl{position:absolute;right:var(--g);bottom:22px;display:flex;gap:8px;align-items:center}
.snd{display:inline-flex;align-items:center;gap:12px;min-height:44px;padding:0 16px;border:1px solid var(--line2);background:rgba(13,12,11,.4);font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--tx);transition:border-color .3s,background-color .3s}
.snd:hover{border-color:var(--tx)}
.bars{display:inline-flex;align-items:flex-end;gap:2px;height:12px}
.bars i{display:block;width:2px;height:12px;background:currentColor;transform:scaleY(.22);transform-origin:bottom;transition:transform .4s}
.snd.is-on .bars i{animation:xyBar 1s ease-in-out infinite alternate}
.snd.is-on .bars i:nth-child(2){animation-delay:-.35s}
.snd.is-on .bars i:nth-child(3){animation-delay:-.7s}
.snd.is-on .bars i:nth-child(4){animation-delay:-.2s}
@keyframes xyBar{0%{transform:scaleY(.2)}100%{transform:scaleY(1)}}
.snd-msg{position:absolute;right:0;bottom:100%;margin-bottom:10px;width:max-content;max-width:280px;text-align:right;font-family:var(--mono);font-size:10.5px;color:var(--tx2)}

/* ---------- frames ---------- */
.frame{position:relative;display:block;width:100%;overflow:hidden;background:var(--bg3)}
.frame .media{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover}
.frame video.media{background:#000;object-fit:contain}
.ph{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;gap:4px;padding:14px;background:repeating-linear-gradient(135deg,rgba(236,231,223,.03) 0 1px,transparent 1px 12px),#181715}
.ph-k{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--tx2)}
.ph-p{font-family:var(--mono);font-size:10px;color:var(--tx3);word-break:break-all}
.js-fade img.media{opacity:0;transition:opacity .9s var(--ease)}
.js-fade .hero-poster{opacity:0}
.js-fade img.media.is-loaded,.js-fade .hero-poster.is-loaded{opacity:1}
img.is-missing{visibility:hidden}
figcaption,.cap{display:block;margin-top:12px;font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--tx3)}

/* ---------- views ---------- */
.view{animation:xyIn .8s var(--ease) both}
@keyframes xyIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.page{padding:clamp(128px,18vh,190px) var(--g) clamp(96px,11vw,160px)}
.page-head{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(16px,2vw,32px);align-items:end;margin-bottom:clamp(40px,6vw,80px)}
.page-head .lbl{grid-column:1/-1;margin-bottom:18px}
.page-t{grid-column:1/span 8;font-family:var(--serif);font-weight:400;font-size:clamp(64px,10vw,152px);line-height:.86;letter-spacing:-.012em}
.page-sub{grid-column:9/-1;color:var(--tx2);font-size:15px;max-width:36ch;padding-bottom:10px}
.empty{padding:64px 0;color:var(--tx2);font-family:var(--serif);font-size:28px}

/* home — selected */
.sec{padding:clamp(96px,12vw,180px) var(--g)}
.sec-head{display:flex;align-items:baseline;gap:20px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:22px;margin-bottom:clamp(48px,7vw,104px)}
.sec-t{font-family:var(--serif);font-weight:400;font-size:clamp(40px,5vw,72px);line-height:1}
.more{margin-left:auto;display:inline-flex;align-items:center;gap:12px;min-height:44px;font-size:14px;letter-spacing:.05em;color:var(--tx2)}
.more:hover{color:var(--tx)}
.sel-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(16px,2vw,32px);row-gap:clamp(64px,9vw,140px);align-items:start}
.sel-item{display:block}
.sel-cap{display:grid;grid-template-columns:auto 1fr;column-gap:14px;row-gap:4px;margin-top:16px;align-items:baseline}
.sel-title{font-family:var(--serif);font-size:clamp(24px,2.2vw,32px);line-height:1.1}
.sel-cap .lbl:last-child{grid-column:2}
@media (hover:hover){.sel-item .frame img.media,.card .frame img.media{transition:opacity .9s var(--ease),transform 1.4s var(--ease)}.sel-item:hover img.media,.card:hover img.media{transform:scale(1.025)}}
.practice{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(16px,2vw,32px);border-top:1px solid var(--line);padding-top:22px}
.practice>.lbl{grid-column:1/span 3}
.statement{grid-column:4/-1;font-family:var(--serif);font-weight:400;font-size:clamp(34px,4.6vw,72px);line-height:1.04;max-width:18ch}
.pr-list{grid-column:4/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,3vw,48px);margin-top:clamp(56px,7vw,104px)!important}
.pr-list li{border-top:1px solid var(--line);padding-top:18px;display:flex;flex-direction:column;gap:10px}
.pr-list h3{font-family:var(--serif);font-weight:400;font-size:28px;line-height:1.1}
.pr-list p{color:var(--tx2);font-size:15px}

/* work */
.filters{display:flex;flex-wrap:wrap;gap:4px 8px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:6px 0;margin-bottom:clamp(40px,5vw,72px)}
.flt{position:relative;display:inline-flex;align-items:baseline;gap:6px;min-height:44px;padding:12px 12px 12px 0;margin-right:14px;font-size:14px;letter-spacing:.04em;color:var(--tx2);transition:color .3s}
.flt sup{font-family:var(--mono);font-size:9.5px;color:var(--tx3);top:-.2em}
.flt:hover,.flt[aria-pressed="true"]{color:var(--tx)}
.flt::after{content:"";position:absolute;left:0;right:12px;bottom:8px;height:1px;background:var(--tx);transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease)}
.flt[aria-pressed="true"]::after{transform:scaleX(1)}
.flt.is-zero{color:var(--tx3)}
.wgrid{column-count:3;column-gap:clamp(16px,2.2vw,32px)}
.card{position:relative;display:block;break-inside:avoid;margin-bottom:clamp(16px,2.2vw,32px);animation:xyIn .8s var(--ease) both}
.card-cap{position:absolute;left:0;right:0;bottom:0;display:flex;flex-direction:column;gap:3px;padding:56px 18px 16px;background:linear-gradient(to top,rgba(13,12,11,.86),rgba(13,12,11,0));opacity:0;transform:translateY(6px);transition:opacity .45s var(--ease),transform .45s var(--ease);pointer-events:none}
.card-t{font-family:var(--serif);font-size:26px;line-height:1.08;color:var(--tx)}
.card-m{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--tx2)}
.card:hover .card-cap,.card:focus-visible .card-cap{opacity:1;transform:none}
@media (hover:hover){.wgrid:hover .card:not(:hover) .frame{opacity:.62}.card .frame{transition:opacity .5s var(--ease)}}
.badge{position:absolute;top:12px;left:12px;font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;padding:5px 8px;background:rgba(13,12,11,.7);color:var(--tx)}

/* project */
.crumb{display:flex;gap:10px;align-items:center;margin-bottom:28px}
.crumb a{min-height:44px;display:inline-flex;align-items:center;color:var(--tx2)}
.crumb a:hover{color:var(--tx)}
.proj-head{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(16px,2vw,32px);row-gap:40px;align-items:end;margin-bottom:clamp(48px,6vw,88px)}
.proj-t{grid-column:1/span 8;font-family:var(--serif);font-weight:400;font-size:clamp(52px,8vw,128px);line-height:.9;letter-spacing:-.01em}
.meta{grid-column:9/-1;display:flex;flex-direction:column}
.meta div{display:grid;grid-template-columns:96px 1fr;gap:12px;padding:10px 0;border-top:1px solid var(--line)}
.meta dt{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--tx3);padding-top:2px}
.meta dd{font-size:15px;color:var(--tx)}
.proj-hero{margin:0 calc(var(--g) * -1);display:flex;justify-content:center;background:#0A0908}
.proj-hero .frame{margin:0 auto}
.intro{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(16px,2vw,32px);margin:clamp(72px,9vw,140px) 0 0}
.intro p{grid-column:5/span 7;font-family:var(--serif);font-size:clamp(24px,2.4vw,34px);line-height:1.28;color:var(--tx);max-width:36ch}
.seq{display:flex;flex-direction:column;gap:clamp(56px,9vw,150px);margin-top:clamp(80px,11vw,170px)}
.b-full{margin:0 calc(var(--g) * -1)}
.b-full figcaption{padding:0 var(--g)}
.b-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,2vw,28px);align-items:end;padding:0 clamp(0px,5vw,96px)}
.b-inset{width:min(100%,720px);margin:0 auto}
.b-offset{width:min(100%,60%)}
.b-offset.is-right{margin-left:auto}
.b-offset.is-left{margin-right:auto}
.b-break{min-height:clamp(24px,8vw,120px);display:flex;align-items:center;justify-content:center}
.b-break p{font-family:var(--serif);font-style:italic;font-size:24px;color:var(--tx2);max-width:36ch;text-align:center}
.credits{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(16px,2vw,32px);margin-top:clamp(96px,11vw,160px);border-top:1px solid var(--line);padding-top:22px}
.credits .lbl{grid-column:1/span 4}
.credits dl{grid-column:5/-1;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:24px 32px}
.credits dt{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--tx3);margin-bottom:6px}
.pn{display:grid;grid-template-columns:1fr 1fr;margin-top:clamp(96px,11vw,160px);border-top:1px solid var(--line)}
.pn-a{display:flex;flex-direction:column;gap:10px;padding:32px 0 8px;min-height:44px}
.pn-a.next{text-align:right;align-items:flex-end;border-left:1px solid var(--line);padding-left:24px}
.pn-t{font-family:var(--serif);font-size:clamp(28px,3.6vw,52px);line-height:1.02;color:var(--tx2);transition:color .3s}
.pn-a:hover .pn-t{color:var(--tx)}

/* archive */
.arch-bar{display:flex;flex-wrap:wrap;align-items:flex-end;gap:16px 32px;border-top:1px solid var(--line);padding-top:18px;margin-bottom:28px}
.fld{display:flex;flex-direction:column;gap:4px;position:relative;min-width:180px}
.fld::after{content:"";position:absolute;right:4px;bottom:20px;width:6px;height:6px;border-right:1px solid var(--tx2);border-bottom:1px solid var(--tx2);transform:rotate(45deg);pointer-events:none}
.fld select{appearance:none;-webkit-appearance:none;min-height:44px;padding:8px 28px 8px 0;border-bottom:1px solid var(--line2);font-size:15px;color:var(--tx)}
.fld select option{background:#141311;color:var(--tx)}
.vt{display:flex;gap:4px;margin-left:auto}
.vt button{min-height:44px;padding:0 10px;font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--tx3)}
.vt button[aria-pressed="true"]{color:var(--tx);text-decoration:underline;text-underline-offset:6px}
.ahead,.arow{display:grid;grid-template-columns:72px minmax(0,2.2fr) minmax(0,1fr) minmax(0,1.3fr) minmax(0,1fr);gap:20px;align-items:baseline}
.ahead{padding:12px 0;border-bottom:1px solid var(--line)}
.arow{padding:18px 0;border-bottom:1px solid var(--line);color:var(--tx2);transition:color .25s}
.a-y{font-family:var(--mono);font-size:12px;letter-spacing:.06em}
.a-t{font-family:var(--serif);font-size:24px;line-height:1.1;color:var(--tx)}
.a-c,.a-cl,.a-l{font-size:14px}
@media (hover:hover){.alist:hover .arow{color:var(--tx3)}.alist:hover .arow .a-t{color:var(--tx2)}.alist .arow:hover,.alist .arow:hover .a-t{color:var(--tx)}}
.agrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:32px 18px}
.agrid a{display:flex;flex-direction:column;gap:10px}
.thumb{position:relative;display:block;aspect-ratio:4/5;background:#0A0908;overflow:hidden}
.thumb .media{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.agrid .t{font-family:var(--serif);font-size:19px;line-height:1.15}

/* about */
.ab-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(16px,2vw,32px);align-items:start}
.xy .ab-portrait{grid-column:1/span 5;margin-top:clamp(0px,9vw,140px)}
.ab-text{grid-column:7/-1;display:flex;flex-direction:column}
.ab-name{font-family:var(--serif);font-weight:400;font-size:clamp(56px,7.4vw,120px);line-height:.88;letter-spacing:-.01em;margin:18px 0 28px!important}
.ab-titles{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.ab-titles li{display:flex;gap:16px;align-items:baseline;padding:12px 0;border-bottom:1px solid var(--line);font-size:16px}
.bio{margin-top:clamp(48px,6vw,80px)}
.bio-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px}
.lang{display:flex;align-items:center;gap:2px;color:var(--tx3)}
.lang button{min-height:44px;min-width:44px;padding:0 8px;font-family:var(--mono);font-size:11px;letter-spacing:.12em;color:var(--tx3)}
.lang button[aria-pressed="true"]{color:var(--tx);text-decoration:underline;text-underline-offset:6px}
.bio-body{display:flex;flex-direction:column;gap:1em;max-width:60ch;font-size:17px;line-height:1.72;color:var(--tx2);animation:xyIn .6s var(--ease) both}
.bio-body p:first-child{color:var(--tx)}
.bio-body.is-zh{font-family:"Noto Sans SC",var(--sans);font-weight:300;line-height:1.95;letter-spacing:.02em}
.kv{display:flex;flex-direction:column;margin-top:clamp(40px,5vw,64px)!important}
.kv div{display:grid;grid-template-columns:140px 1fr;gap:16px;padding:12px 0;border-top:1px solid var(--line)}
.kv dt{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--tx3);padding-top:3px}
.kv dd a{border-bottom:1px solid var(--line2)}
.kv dd a:hover{border-color:var(--tx)}
.actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:36px}
.btn{display:inline-flex;align-items:center;gap:14px;min-height:48px;padding:0 22px;border:1px solid var(--tx);font-size:14px;letter-spacing:.04em;transition:background-color .3s,color .3s}
.btn:hover{background:var(--tx);color:var(--bg)}
.btn.ghost{border-color:var(--line2)}
.btn.ghost:hover{background:transparent;color:var(--tx);border-color:var(--tx)}
.fields{margin-top:clamp(96px,11vw,170px);border-top:1px solid var(--line);padding-top:22px;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(16px,2vw,32px)}
.fields .lbl{grid-column:1/span 4}
.fields ul{grid-column:5/-1;display:flex;flex-wrap:wrap;gap:0 .45em;font-family:var(--serif);font-size:clamp(30px,3.8vw,56px);line-height:1.2}
.fields a{color:var(--tx2);transition:color .3s}
.fields a:hover{color:var(--tx)}
.fields li:not(:last-child)::after{content:" /";color:var(--tx3)}

.fields.cvs{margin-top:clamp(72px,8vw,120px)}
.xy .fields .cv-list{grid-column:5/-1;display:flex;flex-direction:column;flex-wrap:nowrap;gap:0;font-family:var(--sans);font-size:16px;line-height:1.4}
.cv-list li{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1.3fr) auto;gap:8px 24px;align-items:baseline;padding:14px 0;border-bottom:1px solid var(--line)}
.cv-list li:first-child{padding-top:0}
.cv-list li span:first-child{font-family:var(--serif);font-size:22px;line-height:1.15;color:var(--tx)}
.cv-list li span:nth-child(2){color:var(--tx2)}
.xy .fields .cv-list li::after{content:none}

/* contact */
.ct{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(16px,2vw,32px)}
.ct>.lbl{grid-column:1/-1;margin-bottom:22px}
.ct-t{grid-column:1/span 9;font-family:var(--serif);font-weight:400;font-size:clamp(44px,6.4vw,100px);line-height:.98;max-width:15ch}
.ct-mail{grid-column:1/-1;justify-self:start;margin-top:clamp(48px,6vw,88px);font-family:var(--serif);font-size:clamp(28px,4.2vw,64px);line-height:1.1;border-bottom:1px solid var(--line2);word-break:break-word}
.ct-mail:hover{border-color:var(--tx)}
.ct .kv{grid-column:1/span 7}

/* footer */
.foot{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:32px;border-top:1px solid var(--line);margin:0 var(--g);padding:48px 0 40px}
.foot-mail{display:inline-block;margin-top:10px;font-family:var(--serif);font-size:clamp(26px,3vw,40px);line-height:1.1}
.foot-r{display:flex;flex-wrap:wrap;gap:8px 28px;align-items:center;font-size:14px;color:var(--tx2)}
.foot-r a{min-height:44px;display:inline-flex;align-items:center}
.foot-r a:hover{color:var(--tx)}

/* ---------- entrance loader ---------- */
.ld{position:fixed;inset:0;z-index:90}
.ld-p{position:absolute;left:0;right:0;height:50.2%;background:#0D0C0B;overflow:hidden;transition:transform 1.3s cubic-bezier(.77,0,.18,1) .3s}
.ld-p.t{top:0}
.ld-p.b{bottom:0}
.ld.is-exit .ld-p.t{transform:translateY(-101%)}
.ld.is-exit .ld-p.b{transform:translateY(101%)}
.ld-in{position:absolute;left:var(--g);right:var(--g);display:flex;justify-content:space-between;gap:24px;transition:opacity .7s var(--ease) .15s,transform 1.3s cubic-bezier(.77,0,.18,1) .3s}
.ld-p.t .ld-in{top:26px;align-items:flex-start}
.ld-p.b .ld-in{bottom:clamp(22px,4vh,40px);align-items:flex-end}
.ld.is-exit .ld-in{opacity:0}
.ld.is-exit .ld-p.t .ld-in{transform:translateY(40px)}
.ld.is-exit .ld-p.b .ld-in{transform:translateY(-40px)}
.ld-rise{animation:xyRise 1.2s cubic-bezier(.16,1,.3,1) both}
.ld-rise.d2{animation-delay:.12s}
.ld-rise.d3{animation-delay:.24s}
@keyframes xyRise{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
.ld-num{display:flex;align-items:flex-start;gap:.08em;font-family:var(--serif);font-size:clamp(112px,21vw,330px);line-height:.8;letter-spacing:-.02em;color:var(--tx);font-variant-numeric:tabular-nums}
.ld-num small{font-family:var(--mono);font-size:12px;letter-spacing:.14em;color:var(--tx2);margin-top:1.2em}
.ld-line{position:absolute;left:var(--g);right:var(--g);top:50%;height:1px;margin-top:-.5px;background:rgba(236,231,223,.14);z-index:2;transition:left 1s cubic-bezier(.77,0,.18,1),right 1s cubic-bezier(.77,0,.18,1),opacity .8s var(--ease) .7s}
.ld-fill{position:absolute;inset:0;display:block;background:var(--tx);transform-origin:left center;transform:scaleX(0);box-shadow:0 0 18px rgba(236,231,223,.35)}
.ld.is-exit .ld-line{left:0;right:0;opacity:0}
.ld .vf span{border-color:rgba(236,231,223,.3);z-index:3;transition:opacity .5s var(--ease)}
.ld.is-exit .vf span{opacity:0}
.xy.is-loading{max-height:100vh;overflow:hidden}
.xy.is-loading .hero-poster,.xy.is-loading .hero-video{transform:scale(1.14);filter:brightness(.2) saturate(.5)}
.hero-name>span{overflow:hidden;padding:.1em 0 .16em;margin:-.1em 0 -.16em}
.hn{display:block;transition:transform 1.5s cubic-bezier(.16,1,.3,1) .6s}
.hero-name>span+span .hn{transition-delay:.72s}
.xy.is-loading .hn{transform:translateY(112%)}
.rv{transition:opacity 1.1s var(--ease) .95s,transform 1.4s cubic-bezier(.16,1,.3,1) .95s}
.rv.d2{transition-delay:1.08s}
.rv.d3{transition-delay:1.2s}
.xy.is-loading .rv{opacity:0;transform:translateY(26px)}
.hctl,.scroll,.hero .vf{transition:opacity 1s var(--ease) 1.4s}
.xy.is-loading .hctl,.xy.is-loading .scroll,.xy.is-loading .hero .vf{opacity:0}

/* ---------- responsive ---------- */
@media (max-width:1024px){
  .wgrid{column-count:2}
  .page-t{grid-column:1/-1}
  .page-sub{grid-column:1/-1;margin-top:22px}
  .proj-t{grid-column:1/-1}
  .meta{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:24px}
  .intro p{grid-column:2/-1}
  .statement,.pr-list{grid-column:1/-1}
  .practice>.lbl{margin-bottom:22px;grid-column:1/-1}
  .ahead,.arow{grid-template-columns:64px minmax(0,2fr) minmax(0,1fr) minmax(0,1fr)}
  .a-l{display:none}
}
@media (max-width:760px){
  .idx{display:none}
  .nav-toggle{display:inline-flex;align-items:center}
  .nav{padding:14px var(--g)}
  .hero-copy{bottom:112px}
  .hero-name span+span{padding-left:.35em}
  .scroll{left:var(--g);transform:none;align-items:flex-start}
  .scroll .lbl{display:none}
  .hctl{bottom:18px}
  .snd{padding:0 12px}
  .sel-item{grid-column:1/-1!important;grid-row:auto!important;margin-top:0!important}
  .sel-item:nth-child(odd){margin-right:10%!important}
  .sel-item:nth-child(even){margin-left:10%!important}
  .pr-list{grid-template-columns:1fr}
  .wgrid{column-count:1}
  .card-cap{position:static;opacity:1;transform:none;background:none;padding:12px 0 0;pointer-events:auto}
  .b-pair{grid-template-columns:1fr;padding:0}
  .b-offset{width:88%}
  .intro p{grid-column:1/-1}
  .meta{grid-template-columns:1fr}
  .credits .lbl,.credits dl{grid-column:1/-1}
  .credits .lbl{margin-bottom:18px}
  .pn{grid-template-columns:1fr}
  .pn-a.next{border-left:0;border-top:1px solid var(--line);padding-left:0;text-align:left;align-items:flex-start}
  .ahead{display:none}
  .arow{grid-template-columns:52px minmax(0,1fr);row-gap:4px}
  .a-c{grid-column:2;font-size:12px;font-family:var(--mono);letter-spacing:.1em;text-transform:uppercase}
  .a-cl{display:none}
  .vt{margin-left:0}
  .fld{min-width:0;flex:1 1 140px}
  .ab-portrait,.ab-text{grid-column:1/-1}
  .xy .ab-portrait{grid-column:1/-1;width:82%;margin:0 0 48px}
  .kv div{grid-template-columns:110px 1fr}
  .fields .lbl,.fields ul,.xy .fields .cv-list{grid-column:1/-1}
  .cv-list li{grid-template-columns:1fr}
  .fields .lbl{margin-bottom:18px}
  .ct-t,.ct .kv{grid-column:1/-1}
}
@media (hover:none){
  .card-cap{position:static;opacity:1;transform:none;background:none;padding:12px 0 0}
}
@media (prefers-reduced-motion:reduce){
  .xy *,.xy *::before,.xy *::after{animation:none!important;transition:none!important}
  .xy .ld{transition:opacity .4s linear!important}
  .xy .ld.is-exit{opacity:0}
  .xy.is-loading .hero-poster,.xy.is-loading .hero-video{transform:none;filter:none}
}