:root{
  --ink:#11110f;
  --paper:#f0ede7;
  --signal:#f0442e;
  --muted:#7c7870;
  --sans:"Helvetica Neue","Avenir Next",Helvetica,Arial,sans-serif;
  --mono:"SFMono-Regular",Menlo,Monaco,Consolas,monospace;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ink);color:#f5f2ec;font-family:var(--sans);overflow-x:hidden}
body.viewer-open{overflow:hidden}
img,video{display:block;width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit}

.topbar{position:fixed;z-index:50;top:0;left:0;right:0;height:72px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 3.2vw;color:#fff;mix-blend-mode:difference;pointer-events:none}
.topbar a,.topbar .place{pointer-events:auto}
.brand{font-size:23px;font-weight:700;letter-spacing:-.035em}
.nav{display:flex;gap:32px;font:10px var(--mono);letter-spacing:.14em}
.nav a{opacity:.72}.nav a:hover{opacity:1}
.place{justify-self:end;display:flex;align-items:center;gap:9px;font:9px var(--mono);letter-spacing:.1em}
.place i{width:9px;height:9px;background:var(--signal);border-radius:50%}

.hero{height:100svh;min-height:650px;position:relative;overflow:hidden;background:#050505}
.hero-video{height:100%;object-fit:cover;filter:saturate(.78) contrast(1.07) brightness(.78)}
.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.65),rgba(0,0,0,.26) 42%,rgba(0,0,0,.14) 70%,rgba(0,0,0,.3))}
.hero-copy{position:absolute;left:3.2vw;bottom:8.5vh}
.hero h1{margin:0;font-size:clamp(68px,10.5vw,170px);font-weight:650;letter-spacing:-.07em;line-height:.78}
.scroll-cue{position:absolute;left:3.2vw;bottom:28px;font:9px var(--mono);letter-spacing:.15em}
.scroll-cue b{display:inline-block;font-size:17px;margin-left:8px;font-weight:400}
.video-toggle{position:absolute;right:3.2vw;bottom:28px;background:none;border:0;color:#fff;font:10px var(--mono);cursor:pointer;padding:4px 0}

.paper{background:var(--paper);color:var(--ink)}
.first-turn{padding:90px 3.2vw 130px}
.first-turn-meta{display:grid;grid-template-columns:54px 1fr auto;align-items:center;border-top:1px solid #aaa39a;padding-top:12px;font:9px var(--mono);letter-spacing:.12em}
.first-turn-meta span{color:var(--signal);font-weight:700}.first-turn-meta b{font-size:10px}.first-turn-meta small{font-size:8px;color:#68645e}
.first-turn-image{margin:96px auto 0;width:min(850px,72vw)}
.first-turn-image img{max-height:72vh;object-fit:contain}
.first-turn-note{text-align:center;margin-top:32px;font:9px var(--mono);letter-spacing:.18em;color:#69655f}

.series{display:grid;grid-template-columns:minmax(230px,.65fr) 2.35fr;gap:5vw;padding:84px 3.2vw 38px;align-items:start}
.series-copy{padding-top:18px;position:sticky;top:95px}
.index{font:12px var(--mono);letter-spacing:.08em}.index span{color:var(--signal);font-weight:700}
.series h2,.motion-copy h2{font-size:clamp(40px,4.5vw,72px);font-weight:600;letter-spacing:-.055em;line-height:.92;margin:18px 0 32px}
.series p{max-width:300px;font:11px/1.65 var(--mono);color:#47433e}
.text-link{display:inline-block;margin-top:28px;color:var(--signal);font:9px var(--mono);letter-spacing:.1em}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:8px}.duo figure{margin:0;height:560px;overflow:hidden}.duo img{height:100%;object-fit:cover}
.wide-first{grid-template-columns:1.25fr .75fr}

.selected{background:#111;padding:58px 0 54px;color:#f2efe9}
.selected-head{display:flex;justify-content:space-between;align-items:end;padding:0 3.2vw 20px}
.selected-index{display:block;color:var(--signal);font:10px var(--mono);letter-spacing:.1em;margin-bottom:10px}
.selected h2{margin:0;font-size:clamp(34px,4vw,64px);letter-spacing:-.045em;line-height:.9;font-weight:650}
.selected-actions{display:flex;gap:8px}.selected-actions button{width:42px;height:42px;border:1px solid #585858;border-radius:50%;background:transparent;color:#eee;cursor:pointer}
.selected-sub{padding:0 3.2vw 27px;color:#7e7e7e;font:8px var(--mono);letter-spacing:.13em}
.rail{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:0 3.2vw 9px}.rail::-webkit-scrollbar{display:none}
.frame{flex:0 0 min(420px,71vw);scroll-snap-align:start;border:0;background:none;color:#8f8f8f;padding:0;text-align:left;cursor:pointer}.frame.wide{flex-basis:min(520px,78vw)}.frame.portrait{flex-basis:min(275px,50vw)}
.frame img{height:300px;object-fit:cover;filter:saturate(.84);transition:filter .25s ease,transform .25s ease}.frame.portrait img{height:390px}.frame:hover img{filter:saturate(1);transform:translateY(-2px)}
.frame span{display:block;font:9px var(--mono);margin-top:10px;letter-spacing:.12em}
.rail-foot{display:flex;justify-content:space-between;padding:10px 3.2vw 0;color:#666;font:8px var(--mono);letter-spacing:.12em}

.quiet{display:grid;grid-template-columns:1.45fr .58fr .72fr;gap:2.3vw;align-items:center;padding:110px 3.2vw}
.quiet figure{margin:0}.quiet-large img{height:72vh;min-height:520px;object-fit:cover}.quiet-small img{height:430px;object-fit:cover}
.quiet-word span{font:9px var(--mono);color:var(--signal);letter-spacing:.09em}.quiet-word h2{font-size:clamp(46px,6vw,96px);line-height:.82;font-weight:650;letter-spacing:-.065em;margin:18px 0}

.motion{display:grid;grid-template-columns:1.75fr .8fr;background:#0b0b0b;min-height:620px;align-items:center}.motion-media{height:620px;overflow:hidden}.motion-media video{height:100%;object-fit:cover}.motion-copy{padding:7vw}.motion-copy p{font:10px/1.65 var(--mono);color:#989898}

.about{padding:110px 3.2vw 42px}.about-kicker{font:9px var(--mono);color:var(--signal);letter-spacing:.12em}.about>p{font-size:clamp(32px,5.4vw,86px);font-weight:450;line-height:.98;letter-spacing:-.055em;max-width:1420px;margin:26px 0 90px}.about-links{display:flex;justify-content:space-between;border-top:1px solid #c8c3ba;padding-top:17px;font:9px var(--mono);letter-spacing:.09em}

.viewer{position:fixed;inset:0;z-index:100;background:#090909;color:#fff;display:none;align-items:center;justify-content:center;padding:38px 82px}.viewer.open{display:flex}
.viewer-stage{margin:0;max-width:calc(100vw - 164px);max-height:calc(100dvh - 70px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px}.viewer-stage img{max-width:100%;max-height:calc(100dvh - 120px);width:auto;height:auto;object-fit:contain}
.viewer-stage figcaption{width:100%;display:flex;justify-content:space-between;gap:20px;font:8px var(--mono);letter-spacing:.1em;color:#8b8b8b;text-transform:uppercase}
.viewer-close{position:absolute;top:18px;right:22px;border:0;background:none;color:#fff;font-size:36px;line-height:1;cursor:pointer;z-index:3}.viewer-nav{position:absolute;top:50%;transform:translateY(-50%);width:48px;height:48px;border:1px solid #555;border-radius:50%;background:rgba(15,15,15,.72);color:#fff;cursor:pointer;font-size:18px}.viewer-nav.prev{left:20px}.viewer-nav.next{right:20px}

@media(max-width:800px){
  .topbar{height:62px;padding:0 18px}.nav{display:none}.brand{font-size:20px}.place span{display:none}
  .hero-copy{left:18px;bottom:12vh}.hero h1{font-size:20vw}.scroll-cue{left:18px}.video-toggle{right:18px}
  .first-turn{padding:70px 18px 90px}.first-turn-meta{grid-template-columns:40px 1fr}.first-turn-meta small{display:none}.first-turn-image{width:100%;margin-top:65px}
  .series{grid-template-columns:1fr;padding:64px 18px 20px;gap:28px}.series-copy{position:static}.duo,.wide-first{grid-template-columns:1fr}.duo figure{height:58vh;min-height:390px}.duo figure:nth-child(2){width:76%;margin-left:auto;height:52vh}
  .selected{padding-top:50px}.selected-head,.selected-sub,.rail,.rail-foot{padding-left:18px;padding-right:18px}.selected-actions{display:none}.frame{flex-basis:78vw}.frame.wide{flex-basis:86vw}.frame.portrait{flex-basis:54vw}.frame img{height:55vw}.frame.portrait img{height:74vw}
  .quiet{grid-template-columns:1fr;padding:72px 18px}.quiet-large img{height:60vh;min-height:430px}.quiet-small{width:62%;margin-left:auto!important}.quiet-small img{height:auto}
  .motion{grid-template-columns:1fr}.motion-media{height:58vh}.motion-copy{padding:56px 18px 70px}.about{padding:75px 18px 30px}.about-links{display:grid;gap:12px}
  .viewer{padding:54px 12px 28px}.viewer-stage{max-width:100%;max-height:100%;width:100%}.viewer-stage img{max-height:calc(100dvh - 125px)}.viewer-stage figcaption{padding:0 8px}.viewer-nav{width:42px;height:42px;background:rgba(0,0,0,.48)}.viewer-nav.prev{left:8px}.viewer-nav.next{right:8px}.viewer-close{right:12px;top:12px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.hero-video{display:none}.hero{background:url('assets/DSCF4336_b1a.JPG') center/cover no-repeat}.frame img{transition:none}}

/* v07 portfolio architecture */
.projects{padding:95px 3.2vw 120px}
.projects-head{display:grid;grid-template-columns:1fr 1fr;align-items:start;border-top:1px solid #aaa39a;padding-top:13px;margin-bottom:70px}
.projects-head p{justify-self:end;max-width:360px;margin:0;font:10px/1.65 var(--mono);color:#625e57}
.project-card{display:grid;grid-template-columns:1.42fr .72fr;gap:4vw;align-items:end;color:var(--ink);margin-bottom:105px}
.project-card figure{margin:0;overflow:hidden;background:#ddd6cc}
.project-card figure img{height:68vh;min-height:520px;object-fit:cover;transition:transform .7s cubic-bezier(.2,.8,.2,1),filter .4s ease}
.project-card:hover figure img{transform:scale(1.018);filter:saturate(1.04)}
.project-copy{padding-bottom:12px}
.project-copy span{font:9px var(--mono);letter-spacing:.12em;color:var(--signal)}
.project-copy h2{font-size:clamp(44px,6vw,96px);letter-spacing:-.065em;line-height:.82;margin:20px 0 30px;max-width:570px}
.project-copy p{font:10px/1.7 var(--mono);max-width:360px;color:#504b45;margin:0 0 30px}
.project-copy b{font:9px var(--mono);letter-spacing:.1em;font-weight:500}
.project-pair{display:grid;grid-template-columns:1fr 1fr;gap:4vw;align-items:start}
.project-pair .project-card{display:block;margin-bottom:0}
.project-pair .project-card figure img{height:58vh;min-height:430px}
.project-pair .project-copy{padding-top:24px}
.project-pair .project-copy h2{font-size:clamp(38px,4.6vw,72px)}

.commissions{display:grid;grid-template-columns:1.35fr .85fr;min-height:720px;background:#0a0a0a;color:#f1eee8}
.commissions-image{overflow:hidden}.commissions-image img{height:100%;object-fit:cover;filter:contrast(1.08)}
.commissions-copy{padding:9vw 7vw;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}
.commissions-copy h2{font-size:clamp(52px,6.8vw,110px);line-height:.82;letter-spacing:-.07em;margin:24px 0 38px}
.commissions-copy p{font:10px/1.75 var(--mono);color:#a6a6a6;max-width:410px;margin:0 0 38px}
.commissions-copy>a{font:10px var(--mono);letter-spacing:.1em;border-bottom:1px solid #555;padding-bottom:8px}
.commissions-copy small{margin-top:80px;color:#555;font:8px var(--mono);letter-spacing:.1em}

.project-page{background:var(--paper);color:var(--ink)}
.project-hero{min-height:100svh;padding:110px 3.2vw 36px;display:grid;grid-template-columns:.72fr 1.6fr;gap:4vw;align-items:end}
.project-hero-copy{padding-bottom:3vw}.project-hero-copy .index{margin-bottom:18px}.project-hero-copy h1{font-size:clamp(58px,8vw,135px);line-height:.79;letter-spacing:-.07em;margin:0 0 34px}.project-hero-copy p{font:10px/1.7 var(--mono);max-width:370px;color:#514c46}.project-hero figure{margin:0;height:76vh;overflow:hidden}.project-hero figure img{height:100%;object-fit:cover}
.project-sequence{padding:120px 3.2vw}.project-row{display:grid;grid-template-columns:1fr 1fr;gap:5vw;align-items:center;margin:0 0 150px}.project-row.reverse{grid-template-columns:.8fr 1.2fr}.project-row figure{margin:0}.project-row img{max-height:78vh;object-fit:contain}.project-row .sequence-note{max-width:280px;font:9px/1.7 var(--mono);color:#6a655e;letter-spacing:.03em}.project-single{width:min(960px,82vw);margin:0 auto 160px}.project-single img{max-height:82vh;object-fit:contain}.project-footer{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #bdb7ae;padding:25px 3.2vw 50px;font:9px var(--mono);letter-spacing:.1em}
.project-page .topbar{color:#111;mix-blend-mode:normal;background:rgba(240,237,231,.88);backdrop-filter:blur(8px)}

@media(max-width:800px){
 .projects{padding:70px 18px 85px}.projects-head{grid-template-columns:1fr;gap:18px;margin-bottom:50px}.projects-head p{justify-self:start}.project-card{grid-template-columns:1fr;gap:24px;margin-bottom:85px}.project-card figure img,.project-pair .project-card figure img{height:56vh;min-height:390px}.project-pair{grid-template-columns:1fr;gap:80px}.project-copy h2{font-size:14vw}.commissions{grid-template-columns:1fr}.commissions-image{height:60vh}.commissions-copy{padding:70px 18px}.commissions-copy small{margin-top:55px}
 .project-hero{padding:95px 18px 30px;grid-template-columns:1fr;align-items:start}.project-hero-copy{padding-top:10vh}.project-hero figure{height:58vh}.project-sequence{padding:80px 18px}.project-row,.project-row.reverse{grid-template-columns:1fr;gap:30px;margin-bottom:90px}.project-single{width:100%;margin-bottom:90px}.project-footer{padding-left:18px;padding-right:18px;gap:20px;flex-wrap:wrap}
}

/* v08 — complete navigation + compact project galleries */
.nav a.active{opacity:1;border-bottom:1px solid currentColor;padding-bottom:4px}
.work-main{background:var(--paper);color:var(--ink);padding-top:72px}.work-intro{padding:90px 3.2vw 110px;display:grid;grid-template-columns:.45fr 1.15fr .7fr;gap:4vw;align-items:end;border-bottom:1px solid #c2bcb3}.work-intro h1{font-size:clamp(62px,9vw,145px);line-height:.78;letter-spacing:-.075em;margin:0}.work-intro p{font:10px/1.7 var(--mono);color:#5f5a53;max-width:360px;margin:0}.work-list{padding:90px 3.2vw 120px}.work-entry{display:grid;grid-template-columns:1.3fr .7fr;gap:5vw;align-items:end;margin-bottom:110px}.work-entry.flip{grid-template-columns:.7fr 1.3fr}.work-entry.flip figure{order:2}.work-entry figure{margin:0;overflow:hidden}.work-entry figure img{height:68vh;min-height:480px;object-fit:cover;transition:transform .7s ease}.work-entry:hover figure img{transform:scale(1.018)}.work-entry span{font:9px var(--mono);color:var(--signal);letter-spacing:.12em}.work-entry h2{font-size:clamp(46px,6.5vw,105px);line-height:.82;letter-spacing:-.065em;margin:18px 0 28px}.work-entry p{font:10px/1.7 var(--mono);color:#5d5851;max-width:390px;margin:0 0 28px}.work-entry b{font:9px var(--mono);font-weight:500;letter-spacing:.1em}
.project-gallery-page{background:var(--paper)}.pg-intro{padding:135px 3.2vw 42px;display:grid;grid-template-columns:1.3fr .7fr;gap:5vw;align-items:end}.pg-title h1{font-size:clamp(62px,9.5vw,150px);line-height:.78;letter-spacing:-.075em;margin:20px 0 0}.pg-intro>p{font:10px/1.75 var(--mono);color:#5b5650;max-width:390px;margin:0}.pg-lead{margin:0 3.2vw 36px;height:min(70vh,760px);overflow:hidden;background:#d8d2ca}.pg-lead img{height:100%;object-fit:cover}.pg-gallery{padding:0 3.2vw 40px;display:grid;grid-template-columns:repeat(12,1fr);gap:12px}.pg-item{position:relative;border:0;background:#d8d2ca;padding:0;cursor:zoom-in;overflow:hidden;grid-column:span 4;height:30vw;max-height:460px;min-height:260px}.pg-item.wide:nth-child(5n+1){grid-column:span 8}.pg-item.wide:nth-child(5n+1){height:38vw;max-height:600px}.pg-item.tall{grid-column:span 4;height:42vw;max-height:650px}.pg-item img{height:100%;object-fit:cover;transition:transform .45s ease,filter .35s ease}.pg-item:hover img{transform:scale(1.015);filter:brightness(.94)}.pg-item span{position:absolute;left:10px;bottom:9px;background:rgba(240,237,231,.92);color:#111;padding:4px 6px;font:8px var(--mono);letter-spacing:.08em}.pg-note{margin:0 3.2vw 55px;padding-top:12px;border-top:1px solid #bbb5ac;display:flex;justify-content:space-between;font:8px var(--mono);letter-spacing:.1em;color:#68635d}
@media(max-width:800px){.work-intro{padding:80px 18px 70px;grid-template-columns:1fr;gap:28px}.work-list{padding:60px 18px 80px}.work-entry,.work-entry.flip{grid-template-columns:1fr;gap:24px;margin-bottom:80px}.work-entry.flip figure{order:0}.work-entry figure img{height:56vh;min-height:380px}.pg-intro{padding:105px 18px 32px;grid-template-columns:1fr;gap:26px}.pg-title h1{font-size:16vw}.pg-lead{margin:0 18px 18px;height:56vh}.pg-gallery{padding:0 18px 30px;grid-template-columns:repeat(2,1fr);gap:7px}.pg-item,.pg-item.wide:nth-child(5n+1),.pg-item.tall{grid-column:span 1;height:55vw;min-height:0}.pg-item.tall{height:72vw}.pg-item.wide:nth-child(4n+1){grid-column:span 2;height:58vw}.pg-note{margin:0 18px 40px}.pg-note span:last-child{display:none}}

/* v09 — INDEX + disciplined horizontal project galleries */
.project-horizontal-page{background:var(--paper);color:var(--ink);min-height:100vh;overflow-x:hidden}
.project-horizontal-page .topbar{color:#111;mix-blend-mode:normal;background:rgba(240,237,231,.92);backdrop-filter:blur(10px);border-bottom:1px solid rgba(17,17,15,.08)}
.hpg-main{padding-top:72px;min-height:calc(100vh - 72px);display:flex;flex-direction:column}
.hpg-intro{padding:48px 3.2vw 26px;display:grid;grid-template-columns:1.25fr .75fr;gap:5vw;align-items:end}
.hpg-kicker{font:9px var(--mono);letter-spacing:.12em}.hpg-kicker span{color:var(--signal);font-weight:700}
.hpg-intro h1{font-size:clamp(54px,7.7vw,126px);line-height:.8;letter-spacing:-.072em;margin:12px 0 0}
.hpg-intro p{font:10px/1.7 var(--mono);color:#5d5851;max-width:390px;margin:0 0 5px}
.hpg-controls{display:flex;justify-content:space-between;align-items:center;padding:0 3.2vw 12px;font:8px var(--mono);letter-spacing:.11em;color:#69645e}
.hpg-arrows{display:flex;gap:6px}.hpg-arrows button{width:38px;height:30px;border:1px solid #b8b2a9;background:transparent;cursor:pointer;color:#111}.hpg-arrows button:hover{background:#111;color:#f5f2ec;border-color:#111}
.horizontal-strip{display:flex;align-items:center;gap:14px;overflow-x:auto;overflow-y:hidden;padding:0 3.2vw 20px;scroll-snap-type:x proximity;scrollbar-width:none;overscroll-behavior-x:contain;flex:1;min-height:0}
.horizontal-strip::-webkit-scrollbar{display:none}
.hframe{position:relative;flex:0 0 auto;height:clamp(390px,58vh,690px);border:0;padding:0;background:#d7d1c8;cursor:zoom-in;scroll-snap-align:center;overflow:hidden}
.hframe img{height:100%;width:auto;max-width:none;object-fit:contain;display:block;transition:filter .3s ease,transform .45s ease}
.hframe:hover img{filter:brightness(.94);transform:scale(1.006)}
.hframe span{position:absolute;left:9px;bottom:8px;background:rgba(240,237,231,.93);padding:4px 6px;font:8px var(--mono);letter-spacing:.09em;color:#111}
.hpg-footer{margin-top:auto;display:flex;justify-content:space-between;align-items:center;border-top:1px solid #bbb5ad;padding:18px 3.2vw 24px;font:9px var(--mono);letter-spacing:.1em}

/* strict contact-sheet INDEX */
.index-page{background:var(--paper);color:var(--ink);min-height:100vh}
.index-page .topbar{color:#111;mix-blend-mode:normal;background:rgba(240,237,231,.92);backdrop-filter:blur(10px);border-bottom:1px solid rgba(17,17,15,.08)}
.index-main{padding-top:72px}
.index-intro{padding:72px 3.2vw 58px;display:grid;grid-template-columns:.45fr 1.05fr .7fr;gap:4vw;align-items:end;border-bottom:1px solid #c2bcb3}
.index-intro h1{font-size:clamp(62px,9vw,145px);line-height:.78;letter-spacing:-.075em;margin:0}
.index-intro p{font:10px/1.7 var(--mono);color:#5f5a53;max-width:390px;margin:0}
.contact-sheet{padding:52px 3.2vw 80px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:18px;row-gap:42px;align-items:start}
.contact-frame{border:0;padding:0;background:transparent;text-align:left;cursor:zoom-in;color:#111}
.contact-frame figure{margin:0;background:#d9d3ca;display:flex;align-items:center;justify-content:center;overflow:hidden;aspect-ratio:4/3}
.contact-frame.portrait figure{aspect-ratio:3/4}
.contact-frame img{width:100%;height:100%;object-fit:cover;transition:filter .3s ease}
.contact-frame:hover img{filter:brightness(.93)}
.contact-frame div{display:flex;justify-content:space-between;gap:10px;padding-top:9px;border-top:1px solid #c3bdb4;margin-top:8px;font:8px var(--mono);letter-spacing:.08em;color:#68635d}
.selected-index-link{font:9px var(--mono);letter-spacing:.1em;border-bottom:1px solid #555;padding-bottom:5px;white-space:nowrap}
.selected-head{gap:20px}

@media(max-width:800px){
  .hpg-intro{padding:38px 18px 20px;grid-template-columns:1fr;gap:20px}.hpg-intro h1{font-size:15.5vw}.hpg-controls{padding:0 18px 10px}.hpg-controls>span{font-size:7px}.horizontal-strip{padding:0 18px 16px;gap:9px}.hframe{height:57vh;max-height:560px}.hpg-footer{padding:16px 18px 22px;gap:12px;flex-wrap:wrap}
  .index-intro{padding:55px 18px 45px;grid-template-columns:1fr;gap:24px}.contact-sheet{padding:34px 18px 60px;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 8px}.contact-frame div{font-size:7px}.selected-index-link{display:none}
}
@media(max-width:520px){.hframe{height:51vh}.contact-sheet{grid-template-columns:1fr}.contact-frame figure,.contact-frame.portrait figure{aspect-ratio:auto}.contact-frame img{height:auto;object-fit:contain}}

/* v10 — homepage identity pass */
.home-v10 .first-turn{padding-bottom:95px}
.home-v10 .selected{padding-top:72px;padding-bottom:72px}
.project-selector{position:relative;min-height:88vh;background:#0b0b0a;color:#f4f1eb;overflow:hidden;display:grid;grid-template-columns:.82fr 1.18fr}
.project-selector-bg{position:absolute;inset:0;z-index:0;background:#090909}
.project-selector-bg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.025);filter:brightness(.43) saturate(.82);transition:opacity .45s ease,transform .8s ease}
.project-selector-bg img.active{opacity:1;transform:scale(1)}
.project-selector:after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(8,8,7,.94) 0%,rgba(8,8,7,.78) 38%,rgba(8,8,7,.24) 72%,rgba(8,8,7,.32) 100%)}
.project-selector-inner{position:relative;z-index:2;grid-column:1/-1;display:grid;grid-template-columns:.82fr 1.18fr;width:100%;padding:92px 3.2vw 70px;align-items:end}
.project-selector-copy{align-self:start;padding-top:8px}.project-selector-copy .index{margin-bottom:34px}.project-selector-copy p{font:9px/1.65 var(--mono);letter-spacing:.06em;color:#8e8a84;max-width:280px}
.project-selector-list{align-self:center;border-top:1px solid rgba(255,255,255,.28)}
.project-choice{display:grid;grid-template-columns:58px 1fr auto;align-items:center;gap:16px;padding:25px 0 27px;border-bottom:1px solid rgba(255,255,255,.28);transition:padding .25s ease,color .25s ease}
.project-choice .num{font:9px var(--mono);letter-spacing:.12em;color:var(--signal)}
.project-choice strong{font-size:clamp(34px,4.6vw,76px);font-weight:560;line-height:.86;letter-spacing:-.055em}
.project-choice em{font:8px var(--mono);font-style:normal;letter-spacing:.11em;color:#9a9690;opacity:0;transform:translateX(-8px);transition:.25s ease}
.project-choice:hover{padding-left:10px}.project-choice:hover em,.project-choice:focus-visible em{opacity:1;transform:none}
.project-selector-foot{position:absolute;z-index:3;left:3.2vw;right:3.2vw;bottom:24px;display:flex;justify-content:space-between;font:8px var(--mono);letter-spacing:.12em;color:#77736e}
.home-v10 .about{padding-top:95px}.home-v10 .about>p{margin-bottom:75px}
@media(max-width:800px){
 .project-selector{min-height:auto;display:block}.project-selector:after{background:linear-gradient(180deg,rgba(8,8,7,.62),rgba(8,8,7,.92) 54%,#090909 100%)}.project-selector-inner{display:block;padding:70px 18px 92px}.project-selector-copy{padding:0 0 45vh}.project-selector-copy p{max-width:230px}.project-choice{grid-template-columns:38px 1fr;padding:19px 0 21px}.project-choice strong{font-size:10.5vw}.project-choice em{display:none}.project-selector-foot{left:18px;right:18px;bottom:20px}.project-selector-bg img{filter:brightness(.55) saturate(.85)}
}
/* v0.11 — quiet project index */
.work-index{background:#f2efe8;color:#111;padding:84px 3.2vw 34px;border-top:1px solid #cbc6bc;border-bottom:1px solid #cbc6bc}
.work-index-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:72px;font:9px/1 var(--mono);letter-spacing:.1em}
.work-index-head a{color:inherit;text-decoration:none;border-bottom:1px solid #aaa49a;padding-bottom:4px}
.work-index-grid{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(320px,.88fr);gap:7vw;align-items:center;min-height:66vh}
.work-index-list{border-top:1px solid #aaa59c}
.work-row{display:grid;grid-template-columns:48px 1fr 105px 26px;align-items:center;gap:12px;padding:27px 0;border-bottom:1px solid #aaa59c;color:#171716;text-decoration:none;transition:opacity .2s ease}
.work-row span,.work-row small,.work-row em{font:9px/1 var(--mono);letter-spacing:.08em;font-style:normal}
.work-row strong{font:500 clamp(28px,4.15vw,66px)/.94 var(--sans);letter-spacing:-.045em}
.work-row small{color:#777269}.work-row em{text-align:right;font-size:15px;transform:translateX(0);transition:transform .2s ease}
.work-index-list:hover .work-row{opacity:.38}.work-index-list .work-row:hover,.work-index-list .work-row.active{opacity:1}.work-row:hover em{transform:translateX(5px)}
.work-index-preview{position:relative;margin:0;width:100%;aspect-ratio:4/5;background:#ded9cf;overflow:hidden}
.work-index-preview img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.012);transition:opacity .3s ease,transform .6s ease}
.work-index-preview img.active{opacity:1;transform:scale(1)}
.work-index-foot{display:flex;justify-content:space-between;margin-top:60px;padding-top:14px;border-top:1px solid #cbc6bc;font:8px/1 var(--mono);letter-spacing:.12em;color:#777269}
@media(max-width:760px){.work-index{padding:62px 18px 25px}.work-index-head{margin-bottom:36px}.work-index-grid{display:flex;flex-direction:column-reverse;gap:30px;min-height:0;align-items:stretch}.work-index-preview{aspect-ratio:4/3}.work-row{grid-template-columns:32px 1fr 20px;padding:18px 0}.work-row strong{font-size:9vw}.work-row small{display:none}.work-index-foot{margin-top:36px}}

/* v0.12 — PROJECT PRINTS / no automatic cropping */
.project-prints{
  background:#f2efe8;
  color:#111;
  padding:82px 3.2vw 34px;
  border-top:1px solid #cbc6bc;
  border-bottom:1px solid #cbc6bc;
}
.project-prints-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:58px;
  font:9px/1 var(--mono);
  letter-spacing:.1em;
}
.project-prints-head a{
  border-bottom:1px solid #aaa49a;
  padding-bottom:4px;
}
.project-prints-grid{
  display:grid;
  grid-template-columns:.72fr 1.12fr 1fr;
  gap:clamp(22px,3.4vw,58px);
  align-items:end;
}
.project-print{
  display:block;
  color:#111;
  text-decoration:none;
}
.project-print figure{
  margin:0;
  background:#ded9cf;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  overflow:hidden;
}
.project-print img{
  display:block;
  width:100%;
  height:auto;
  max-height:61vh;
  object-fit:contain;
  transition:transform .35s ease, filter .35s ease;
}
.project-print-portrait img{
  width:auto;
  max-width:100%;
  max-height:61vh;
}
.project-print:hover img{
  transform:scale(1.012);
  filter:brightness(.97);
}
.project-print-meta{
  display:grid;
  grid-template-columns:34px 1fr auto 18px;
  align-items:baseline;
  gap:10px;
  border-top:1px solid #aaa59c;
  margin-top:14px;
  padding-top:10px;
}
.project-print-meta span,
.project-print-meta small,
.project-print-meta em{
  font:8px/1 var(--mono);
  letter-spacing:.09em;
  font-style:normal;
}
.project-print-meta span{color:var(--signal);font-weight:700}
.project-print-meta strong{
  font:600 clamp(18px,2.1vw,34px)/1 var(--sans);
  letter-spacing:-.035em;
}
.project-print-meta small{color:#777269}
.project-print-meta em{
  font-size:14px;
  transform:translateX(0);
  transition:transform .2s ease;
}
.project-print:hover .project-print-meta em{transform:translateX(4px)}
.project-prints-foot{
  display:flex;
  justify-content:space-between;
  margin-top:58px;
  padding-top:14px;
  border-top:1px solid #cbc6bc;
  font:8px/1 var(--mono);
  letter-spacing:.12em;
  color:#777269;
}

@media(max-width:900px){
  .project-prints-grid{grid-template-columns:1fr 1fr;align-items:start}
  .project-print:nth-child(3){grid-column:1/-1;width:min(72%,720px);justify-self:center}
  .project-print img,.project-print-portrait img{max-height:none;width:100%;height:auto}
}
@media(max-width:620px){
  .project-prints{padding:62px 18px 25px}
  .project-prints-head{margin-bottom:34px}
  .project-prints-grid{grid-template-columns:1fr;gap:42px}
  .project-print:nth-child(3){grid-column:auto;width:100%}
  .project-print figure{background:transparent}
  .project-print img,.project-print-portrait img{width:100%;height:auto;max-width:100%;max-height:none}
  .project-print-meta{grid-template-columns:28px 1fr 18px}
  .project-print-meta small{display:none}
  .project-print-meta strong{font-size:8.2vw}
  .project-prints-foot{margin-top:42px}
}

/* v0.14 — CONTINUITY PASS: keeps v0.12 language, integrates new material */
.project-prints-grid.four{grid-template-columns:repeat(12,1fr);gap:clamp(28px,4vw,70px) clamp(18px,2.8vw,46px);align-items:end}
.project-prints-grid.four .project-print:nth-child(1){grid-column:1/6}.project-prints-grid.four .project-print:nth-child(2){grid-column:7/13}.project-prints-grid.four .project-print:nth-child(3){grid-column:2/7}.project-prints-grid.four .project-print:nth-child(4){grid-column:8/13}
.project-prints-grid.four .project-print figure{background:#ded9cf}.project-prints-grid.four .project-print img{width:100%;height:auto;max-height:60vh;object-fit:contain}
.motion-v14 .motion-feature{display:block;position:relative}.motion-v14 .motion-feature video{max-height:76vh;object-fit:contain;background:#050505}.motion-play{position:absolute;left:18px;bottom:16px;background:var(--signal);color:white;padding:8px 11px;font:8px var(--mono);letter-spacing:.12em}.motion-dots{display:flex;align-items:center;gap:9px;margin-top:28px;font:8px var(--mono);letter-spacing:.12em;color:#8d8880}.motion-dots i{width:9px;height:9px;background:var(--signal);border-radius:50%}.motion-link{display:inline-block;margin-top:18px;font:9px var(--mono);letter-spacing:.1em;border-bottom:1px solid #555;padding-bottom:5px}.ig-link{display:block!important;margin-top:13px!important;font-size:11px!important}
.index-v14 .contact-frame figure{background:#d9d3ca}.index-v14 .contact-frame img{object-fit:contain;background:#d9d3ca}
.motion-main{padding-top:72px;background:var(--paper);color:var(--ink);min-height:100vh}.motion-intro{padding:72px 3.2vw 68px;display:grid;grid-template-columns:.46fr 1.06fr .7fr;gap:4vw;align-items:end;border-bottom:1px solid #c2bcb3}.motion-intro h1{font-size:clamp(62px,9vw,145px);line-height:.78;letter-spacing:-.075em;margin:0}.motion-intro p{font:10px/1.7 var(--mono);color:#5f5a53;max-width:390px;margin:0}.motion-sequence{padding:62px 3.2vw 110px}.motion-piece{display:grid;grid-template-columns:minmax(160px,.42fr) 1.58fr;gap:4vw;padding:0 0 92px;margin:0 0 92px;border-bottom:1px solid #c2bcb3}.motion-piece:nth-child(even){grid-template-columns:1.58fr minmax(160px,.42fr)}.motion-piece:nth-child(even) .motion-piece-meta{grid-column:2;grid-row:1}.motion-piece:nth-child(even) video{grid-column:1;grid-row:1}.motion-piece video{width:100%;height:auto;max-height:77vh;background:#090909;object-fit:contain}.motion-piece-meta{align-self:start;border-top:1px solid #9f998f;padding-top:12px}.motion-piece-meta .redno{color:var(--signal);font:700 10px var(--mono);letter-spacing:.1em}.motion-piece-meta h2{font-size:clamp(30px,4vw,62px);line-height:.92;letter-spacing:-.05em;margin:25px 0 18px}.motion-piece-meta small{font:8px var(--mono);letter-spacing:.14em;color:#777269}
@media(max-width:900px){.project-prints-grid.four{display:grid;grid-template-columns:1fr 1fr}.project-prints-grid.four .project-print:nth-child(n){grid-column:auto;width:100%;margin:0}.project-prints-grid.four .project-print img{max-height:none}}
@media(max-width:800px){.motion-intro{padding:55px 18px 45px;grid-template-columns:1fr;gap:24px}.motion-piece,.motion-piece:nth-child(even){grid-template-columns:1fr;gap:22px;padding-bottom:58px;margin-bottom:58px}.motion-piece:nth-child(even) .motion-piece-meta,.motion-piece:nth-child(even) video{grid-column:1;grid-row:auto}.motion-piece-meta h2{margin-top:14px}.motion-sequence{padding:38px 18px 70px}}
@media(max-width:620px){.project-prints-grid.four{grid-template-columns:1fr}.project-prints-grid.four .project-print:nth-child(n){grid-column:auto}}


/* v0.15 — continuity refinement: preserve the established language, remove literal frames */
.project-prints-grid.four .project-print figure{background:transparent;display:block;overflow:visible}
.project-prints-grid.four .project-print img{display:block;width:100%;height:auto;max-height:none;object-fit:contain}
.project-print:hover img{transform:none;filter:brightness(.98)}

/* INDEX — natural images, no fake mounts / boxes */
.index-natural{padding:52px 3.2vw 90px;columns:3;column-gap:clamp(16px,2vw,34px)}
.index-natural-item{width:100%;display:inline-block;break-inside:avoid;margin:0 0 44px;padding:0;border:0;background:none;color:var(--ink);text-align:left;cursor:zoom-in}
.index-natural-item img{width:100%;height:auto;display:block;transition:opacity .25s ease}
.index-natural-item:hover img{opacity:.88}
.index-natural-item>span{display:flex;justify-content:space-between;gap:12px;margin-top:9px;padding-top:8px;border-top:1px solid #c4beb5;font:8px/1 var(--mono);letter-spacing:.09em;color:#6f6a63}
.index-natural-item b{color:var(--signal);font-weight:700}.index-natural-item em{font-style:normal;text-align:right}

/* MOTION — one reusable player instead of editorial video stacks */
.motion-deck{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(310px,.72fr);background:#0b0b0b;color:#f3f0ea;min-height:720px;border-top:1px solid #272727;border-bottom:1px solid #272727}
.motion-deck-media{position:relative;min-height:720px;background:#040404;display:flex;align-items:center;justify-content:center;overflow:hidden}
.motion-deck-media video{width:100%;height:100%;max-height:84vh;object-fit:contain;background:#040404}
.motion-deck-side{padding:72px 3.2vw 54px;display:flex;flex-direction:column;justify-content:center;border-left:1px solid #282828}
.motion-deck-side h2{font-size:clamp(52px,6vw,92px);line-height:.8;letter-spacing:-.07em;margin:24px 0 28px}
.motion-deck-side>p{font:9px/1.75 var(--mono);color:#858585;max-width:330px;margin:0 0 32px}
.motion-now{border-top:1px solid #393939;border-bottom:1px solid #393939;padding:13px 0;display:grid;grid-template-columns:55px 1fr;align-items:center;gap:12px}
.motion-now span{color:var(--signal);font:8px var(--mono);letter-spacing:.08em}.motion-now strong{font:500 13px var(--sans);letter-spacing:.02em}
.motion-controls{display:flex;gap:8px;margin:15px 0 20px}.motion-controls button{border:1px solid #454545;background:none;color:#eee;min-width:48px;height:36px;padding:0 13px;font:8px var(--mono);letter-spacing:.09em;cursor:pointer}.motion-controls button:hover{border-color:var(--signal);color:var(--signal)}
.motion-mini-list{border-top:1px solid #2f2f2f}.motion-mini-item{width:100%;display:grid;grid-template-columns:30px 1fr;gap:8px;text-align:left;background:none;border:0;border-bottom:1px solid #2f2f2f;color:#6f6f6f;padding:9px 0;cursor:pointer}.motion-mini-item span{font:7px var(--mono);color:#555}.motion-mini-item b{font:500 8px var(--mono);letter-spacing:.07em}.motion-mini-item.active,.motion-mini-item:hover{color:#fff}.motion-mini-item.active span{color:var(--signal)}
.motion-open{margin-top:24px;align-self:flex-start;color:var(--signal);font:8px var(--mono);letter-spacing:.11em;border-bottom:1px solid #6b2c23;padding-bottom:5px}
.motion-center-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:62px;height:62px;border:1px solid rgba(255,255,255,.65);border-radius:50%;background:rgba(0,0,0,.36);color:#fff;font-size:17px;cursor:pointer;backdrop-filter:blur(4px)}
.motion-progress{position:absolute;left:0;right:0;bottom:0;height:3px;background:#242424}.motion-progress span{display:block;width:0;height:100%;background:var(--signal)}

.motion-player-page{background:#0b0b0b;color:#f2efe9}.motion-player-page .topbar{background:rgba(10,10,10,.84);mix-blend-mode:normal}
.motion-player-main{padding-top:72px;min-height:100vh;background:#0b0b0b}
.motion-player-head{padding:64px 3.2vw 42px;display:grid;grid-template-columns:.36fr 1.05fr .62fr;gap:4vw;align-items:end;border-bottom:1px solid #303030}
.motion-player-head h1{font-size:clamp(66px,9vw,150px);line-height:.76;letter-spacing:-.075em;margin:0}.motion-player-head p{font:9px/1.75 var(--mono);color:#868686;max-width:350px;margin:0}
.cinema-player{padding:36px 3.2vw 70px}.cinema-screen{position:relative;background:#040404;min-height:58vh;max-height:76vh;display:flex;align-items:center;justify-content:center;overflow:hidden;border-top:1px solid #292929}.cinema-screen video{width:100%;height:100%;max-height:76vh;object-fit:contain}
.cinema-info{display:grid;grid-template-columns:1fr auto;gap:28px;align-items:end;padding:16px 0 28px;border-bottom:1px solid #323232}.cinema-now span{font:8px var(--mono);color:var(--signal);letter-spacing:.1em}.cinema-now h2{font-size:clamp(26px,3.5vw,54px);line-height:.9;letter-spacing:-.045em;margin:9px 0 6px}.cinema-now small{font:7px var(--mono);letter-spacing:.13em;color:#6e6e6e}.cinema-controls{margin:0}
.cinema-playlist{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;padding-top:22px}.cinema-thumb{border:0;background:none;color:#777;padding:0;text-align:left;cursor:pointer}.cinema-thumb figure{margin:0;aspect-ratio:16/9;overflow:hidden;background:#050505}.cinema-thumb img{width:100%;height:100%;object-fit:cover;filter:grayscale(.35) brightness(.72);transition:.2s ease}.cinema-thumb div{display:grid;grid-template-columns:25px 1fr;gap:6px;padding-top:8px;border-top:1px solid #2f2f2f;margin-top:7px}.cinema-thumb span{font:7px var(--mono);color:#555}.cinema-thumb b{font:500 7px var(--mono);letter-spacing:.05em;line-height:1.25}.cinema-thumb.active,.cinema-thumb:hover{color:#fff}.cinema-thumb.active img,.cinema-thumb:hover img{filter:none}.cinema-thumb.active span{color:var(--signal)}

/* ABOUT + CONTACT — resolved as real sections, not placeholders */
.about-v15{padding:105px 3.2vw 100px}.about-v15-head{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #c5bfb6;padding-top:12px}.about-mark{display:flex;align-items:center;gap:9px;font:8px var(--mono);letter-spacing:.1em;color:#716c65}.about-mark i{width:8px;height:8px;border-radius:50%;background:var(--signal)}
.about-v15-grid{display:grid;grid-template-columns:1.06fr .94fr;gap:8vw;margin-top:84px;align-items:start}.about-v15 h2{font-size:clamp(64px,9.2vw,150px);line-height:.74;letter-spacing:-.075em;margin:0}.about-v15 .alias{margin:24px 0 0;color:var(--signal);font:9px var(--mono);letter-spacing:.12em}.about-copy{padding-top:8px}.about-copy>p{font-size:clamp(22px,2.25vw,37px);line-height:1.12;letter-spacing:-.025em;margin:0 0 30px;max-width:670px}.about-copy>p+p{font-size:clamp(16px,1.5vw,24px);color:#605b54;max-width:610px}.about-meta{display:grid;gap:9px;border-top:1px solid #c5bfb6;padding-top:15px;margin-top:54px;font:8px var(--mono);letter-spacing:.1em;color:#716c65}
.contact-v15{background:#0a0a0a;color:#f4f0ea;padding:72px 3.2vw 26px}.contact-v15-top{display:flex;justify-content:space-between;padding-bottom:18px;border-bottom:1px solid #303030;font:8px var(--mono);letter-spacing:.11em;color:#858585}.contact-v15-main{display:grid;grid-template-columns:1.25fr .75fr;gap:7vw;align-items:end;padding:72px 0 92px}.contact-v15 h2{font-size:clamp(72px,10.5vw,172px);line-height:.72;letter-spacing:-.08em;margin:0}.contact-actions{padding-bottom:8px}.contact-actions a{display:block;font-size:clamp(19px,2.2vw,36px);letter-spacing:-.025em;padding:14px 0;border-top:1px solid #343434}.contact-actions a:hover{color:var(--signal)}.contact-actions p{font:8px/1.7 var(--mono);letter-spacing:.11em;color:#6f6f6f;border-top:1px solid #343434;padding-top:15px;margin:0}.contact-v15-foot{display:flex;justify-content:space-between;gap:18px;border-top:1px solid #303030;padding-top:15px;font:7px var(--mono);letter-spacing:.1em;color:#666}

@media(max-width:900px){.index-natural{columns:2}.motion-deck{grid-template-columns:1fr}.motion-deck-media{min-height:56vh}.motion-deck-side{border-left:0;border-top:1px solid #282828}.motion-player-head{grid-template-columns:1fr;gap:22px}.cinema-playlist{grid-template-columns:repeat(3,1fr)}.about-v15-grid{grid-template-columns:1fr;gap:60px}.contact-v15-main{grid-template-columns:1fr;gap:60px}}
@media(max-width:620px){.index-natural{columns:1;padding:34px 18px 60px}.index-natural-item{margin-bottom:34px}.motion-deck-media{min-height:44vh}.motion-deck-side{padding:55px 18px}.motion-mini-list{display:none}.motion-player-head{padding:55px 18px 35px}.cinema-player{padding:24px 18px 55px}.cinema-screen{min-height:34vh}.cinema-info{grid-template-columns:1fr}.cinema-playlist{grid-template-columns:repeat(2,1fr)}.about-v15{padding:72px 18px}.about-v15-head{align-items:flex-start;gap:20px}.about-mark span{display:none}.about-v15-grid{margin-top:58px}.about-v15 h2{font-size:17vw}.contact-v15{padding:58px 18px 24px}.contact-v15-top span:last-child{display:none}.contact-v15-main{padding:58px 0 72px}.contact-v15 h2{font-size:19vw}.contact-v15-foot{flex-wrap:wrap}.project-prints-grid.four .project-print figure{background:transparent}}


/* v0.16 recovery — restore established visual language */
.brand{
  font-family:"Helvetica Neue","Avenir Next",Helvetica,Arial,sans-serif;
  font-weight:500;
  letter-spacing:-.055em;
  font-size:22px;
  line-height:1;
  -webkit-font-smoothing:antialiased;
  text-rendering:geometricPrecision;
}
.brand::after{content:"";display:inline-block;width:5px;height:5px;margin-left:5px;border-radius:50%;background:var(--signal);vertical-align:.2em}
.hero-copy h1{
  font-family:"Helvetica Neue","Avenir Next",Helvetica,Arial,sans-serif;
  font-weight:400;
  letter-spacing:-.075em;
  line-height:.78;
  -webkit-font-smoothing:antialiased;
  text-rendering:geometricPrecision;
}
.hero-copy h1::after{content:"";display:inline-block;width:.105em;height:.105em;margin-left:.045em;border-radius:50%;background:var(--signal);vertical-align:.07em}

/* WORK — recovered project-print direction, no literal frame */
.restored-work{padding:92px 3.2vw 72px;background:var(--paper);color:var(--ink);border-top:1px solid #c9c3b9}
.restored-work .project-prints-head{margin-bottom:70px}
.restored-work-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:90px 3vw;align-items:start}
.restored-project{display:block;color:inherit;text-decoration:none}
.restored-project figure{margin:0;background:transparent;overflow:visible}
.restored-project img{display:block;width:100%;height:auto;max-height:none;object-fit:contain;transition:opacity .25s ease,transform .35s ease}
.restored-project:hover img{opacity:.94;transform:translateY(-2px)}
.rp-a{grid-column:1/6}.rp-b{grid-column:7/13;margin-top:11vh}.rp-c{grid-column:2/7}.rp-d{grid-column:8/13;margin-top:-2vh}
.restored-meta{display:grid;grid-template-columns:34px 1fr auto 18px;gap:12px;align-items:end;padding-top:12px;border-top:1px solid #aaa49a;margin-top:14px}
.restored-meta span,.restored-meta small,.restored-meta em{font:8px var(--mono);letter-spacing:.09em;font-style:normal}
.restored-meta span{color:var(--signal);font-weight:700}.restored-meta strong{font-size:clamp(21px,2.4vw,43px);font-weight:500;letter-spacing:-.045em;line-height:.95}.restored-meta small{color:#777269}.restored-meta em{transition:transform .2s}.restored-project:hover .restored-meta em{transform:translateX(4px)}

/* WORK page — same language, larger and calmer */
.work-recovery-main{background:var(--paper);color:var(--ink)}
.work-recovery-intro{padding-bottom:85px}
.work-recovery-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:120px 3vw;padding:20px 3.2vw 130px}
.work-recovery-card{display:block;color:inherit;text-decoration:none}
.work-recovery-card figure{margin:0;background:transparent;overflow:visible}
.work-recovery-card img{display:block;width:100%;height:auto;object-fit:contain;transition:opacity .25s ease,transform .35s ease}
.work-recovery-card:hover img{opacity:.94;transform:translateY(-2px)}
.wrc-1{grid-column:1/7}.wrc-2{grid-column:8/13;margin-top:18vh}.wrc-3{grid-column:2/7}.wrc-4{grid-column:7/13;margin-top:-5vh}
.work-recovery-meta{border-top:1px solid #aaa49a;margin-top:14px;padding-top:12px}
.work-recovery-meta span{font:700 8px var(--mono);letter-spacing:.1em;color:var(--signal)}
.work-recovery-meta h2{font-size:clamp(34px,4.4vw,76px);line-height:.84;letter-spacing:-.065em;font-weight:500;margin:25px 0 14px}
.work-recovery-meta p{max-width:430px;font:9px/1.7 var(--mono);color:#666057;margin:0 0 18px}
.work-recovery-meta b{font:8px var(--mono);letter-spacing:.11em;font-weight:500}

/* motion labels: intentionally anonymous / sequence-like */
.motion-now strong,.cinema-now h2{letter-spacing:.08em;text-transform:uppercase}

@media(max-width:900px){
 .restored-work-grid,.work-recovery-grid{grid-template-columns:1fr 1fr;gap:60px 28px}
 .rp-a,.rp-b,.rp-c,.rp-d,.wrc-1,.wrc-2,.wrc-3,.wrc-4{grid-column:auto;margin-top:0}
 .restored-meta{grid-template-columns:28px 1fr 18px}.restored-meta small{display:none}
 .work-recovery-grid{padding-left:18px;padding-right:18px}
}
@media(max-width:620px){
 .brand{font-size:19px}
 .restored-work{padding:62px 18px 50px}.restored-work-grid,.work-recovery-grid{grid-template-columns:1fr;gap:52px}
 .restored-meta strong{font-size:8vw}.work-recovery-grid{padding-bottom:80px}
}
/* v17 continuity: preserve established language, refine hierarchy */
.hero-copy-refined{left:3.2vw;bottom:8.2vh;display:flex;align-items:flex-end;gap:18px}
.hero-wordmark{font-size:clamp(42px,6.3vw,94px);font-weight:520;letter-spacing:-.055em;line-height:.78;color:#fff;text-shadow:0 1px 16px rgba(0,0,0,.22)}
.hero-wordmark span{display:inline-block;width:.11em;height:.11em;border-radius:50%;background:var(--signal);margin-left:.06em;vertical-align:.08em}
.hero-copy-refined small{font:7px var(--mono);letter-spacing:.14em;color:rgba(255,255,255,.7);padding-bottom:2px;white-space:nowrap}
.selected-projects{background:var(--paper)}
.project-balanced{display:grid!important;grid-template-columns:1fr 1fr!important;gap:clamp(54px,7vw,120px) clamp(28px,5vw,80px)!important;align-items:start!important}
.project-balanced .project-print{width:100%!important;margin:0!important;grid-column:auto!important}
.project-balanced .project-print figure{background:transparent!important;display:flex;align-items:flex-end;justify-content:center;min-height:0!important;overflow:visible!important}
.project-balanced .project-print img{display:block;width:auto!important;max-width:100%!important;height:auto!important;max-height:56vh!important;object-fit:contain!important}
.project-balanced .project-print:nth-child(2n) figure{justify-content:flex-start}
.project-balanced .project-print:nth-child(2n+1) figure{justify-content:flex-end}
.motion-deck-reverse{grid-template-columns:minmax(310px,.72fr) minmax(0,1.65fr)}
.motion-deck-reverse .motion-deck-side{order:1;border-left:0;border-right:1px solid #282828}
.motion-deck-reverse .motion-deck-media{order:2}
.about-photo-grid{display:grid;grid-template-columns:minmax(280px,.72fr) 1.28fr;gap:7vw;align-items:end;margin-top:70px}
.about-photo-grid figure{margin:0}.about-photo-grid figure img{display:block;width:100%;height:auto;max-height:72vh;object-fit:contain}
.about-photo-copy h2{font-size:clamp(62px,8vw,132px);line-height:.76;letter-spacing:-.075em;margin:0}.about-photo-copy>.alias{margin:22px 0 45px;color:var(--signal);font:9px var(--mono);letter-spacing:.12em}.about-photo-copy>p:not(.alias){font-size:clamp(20px,2vw,32px);line-height:1.14;max-width:650px;margin:0}
.contact-photo-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:7vw;align-items:end;padding:70px 0 88px}.contact-photo-grid figure{margin:0}.contact-photo-grid figure img{display:block;width:100%;height:auto;max-height:70vh;object-fit:contain}.contact-photo-copy h2{font-size:clamp(62px,8.6vw,142px);line-height:.74;letter-spacing:-.08em;margin:0 0 54px}
@media(max-width:900px){.project-balanced{grid-template-columns:1fr 1fr!important;gap:55px 22px!important}.motion-deck-reverse{grid-template-columns:1fr}.motion-deck-reverse .motion-deck-side{order:2;border-right:0;border-top:1px solid #282828}.motion-deck-reverse .motion-deck-media{order:1}.about-photo-grid,.contact-photo-grid{grid-template-columns:1fr;gap:48px}.about-photo-grid figure{max-width:70vw}.contact-photo-grid figure{max-width:72vw}}
@media(max-width:620px){.hero-copy-refined{left:18px;bottom:12vh;display:block}.hero-wordmark{font-size:14vw}.hero-copy-refined small{display:block;margin-top:12px}.project-balanced{grid-template-columns:1fr!important;gap:58px!important}.project-balanced .project-print figure{justify-content:flex-start!important}.project-balanced .project-print img{max-height:none!important}.about-photo-grid figure,.contact-photo-grid figure{max-width:100%}}
.cinema-player-side{display:grid;grid-template-columns:minmax(250px,.42fr) minmax(0,1.58fr);gap:0;padding:0!important;background:#080808;min-height:72vh}.cinema-player-side .cinema-side-menu{padding:46px 3.2vw;border-right:1px solid #292929;display:flex;flex-direction:column;justify-content:center}.cinema-player-side .cinema-screen{min-height:72vh}.cinema-player-side .cinema-playlist{display:block;margin-top:34px}.cinema-player-side .cinema-thumb{display:block;width:100%;border:0;border-top:1px solid #292929;background:none;color:inherit;padding:10px 0;text-align:left}.cinema-player-side .cinema-thumb figure{display:none}.cinema-player-side .cinema-thumb div{display:flex;justify-content:space-between;gap:16px}.cinema-player-side .cinema-thumb.active b{color:var(--signal)}
@media(max-width:800px){.cinema-player-side{grid-template-columns:1fr}.cinema-player-side .cinema-side-menu{order:2;border-right:0;border-top:1px solid #292929}.cinema-player-side .cinema-screen{order:1;min-height:48vh}}

/* v0.18 — BALANCE PASS */
.personal-work{border-top:0}
/* Selected Projects: a quieter, centered 2×2 print wall. Symmetry lives in the grid, not in cropping. */
.selected-projects{padding-top:76px;padding-bottom:38px}
.selected-projects .project-prints-head{margin-bottom:68px}
.project-balanced{width:min(1120px,82vw);margin:0 auto;grid-template-columns:1fr 1fr!important;column-gap:clamp(48px,7vw,110px)!important;row-gap:clamp(68px,8vw,118px)!important;align-items:start!important}
.project-balanced .project-print{display:flex!important;flex-direction:column;justify-content:flex-start}
.project-balanced .project-print figure{height:clamp(260px,31vw,455px)!important;width:100%;align-items:center!important;justify-content:center!important}
.project-balanced .project-print img{width:auto!important;height:auto!important;max-width:88%!important;max-height:100%!important;object-fit:contain!important}
.project-balanced .project-print-meta{width:88%;margin-left:auto;margin-right:auto}
.selected-projects .project-prints-foot{width:min(1120px,82vw);margin-left:auto;margin-right:auto}

/* WORK: one project after another, alternating on one strict axis. */
.work-sequence-balanced{padding:10px 3.2vw 130px}
.work-sequence-row{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(280px,.72fr);gap:clamp(48px,8vw,130px);align-items:center;padding:82px 0;border-top:1px solid #b8b1a7;color:inherit;text-decoration:none}
.work-sequence-row figure{margin:0;display:flex;justify-content:center;align-items:center;min-height:430px}
.work-sequence-row figure img{display:block;width:auto;height:auto;max-width:100%;max-height:68vh;object-fit:contain;transition:transform .3s ease,opacity .3s ease}
.work-sequence-row:hover figure img{transform:translateY(-3px);opacity:.94}
.work-sequence-copy{max-width:520px}
.work-sequence-copy>span{font:700 8px var(--mono);letter-spacing:.12em;color:var(--signal)}
.work-sequence-copy h2{font:500 clamp(42px,6vw,92px)/.82 var(--sans);letter-spacing:-.065em;margin:30px 0 22px}
.work-sequence-copy p{font:9px/1.75 var(--mono);color:#666057;max-width:390px;margin:0 0 28px}
.work-sequence-copy b{font:500 8px var(--mono);letter-spacing:.12em;border-bottom:1px solid #aaa49a;padding-bottom:5px}
.work-sequence-row.reverse{grid-template-columns:minmax(280px,.72fr) minmax(0,1.08fr)}
.work-sequence-row.reverse figure{grid-column:2;grid-row:1}
.work-sequence-row.reverse .work-sequence-copy{grid-column:1;grid-row:1;justify-self:end;width:100%}
@media(max-width:900px){.project-balanced{width:90vw;column-gap:24px!important}.project-balanced .project-print figure{height:42vw!important}.work-sequence-row,.work-sequence-row.reverse{grid-template-columns:1fr;gap:38px}.work-sequence-row.reverse figure,.work-sequence-row.reverse .work-sequence-copy{grid-column:1;grid-row:auto;justify-self:start}.work-sequence-row figure{min-height:0}.work-sequence-row figure img{max-height:none}}
@media(max-width:620px){.project-balanced{width:100%;grid-template-columns:1fr!important}.project-balanced .project-print figure{height:auto!important;justify-content:flex-start!important}.project-balanced .project-print img{max-width:100%!important}.project-balanced .project-print-meta{width:100%}.selected-projects .project-prints-foot{width:100%}.work-sequence-balanced{padding:0 18px 80px}.work-sequence-row{padding:58px 0}.work-sequence-copy h2{font-size:13vw}}


/* v0.19 — WORK: one consistent left-image / right-text line */
.work-page .work-sequence-balanced{
  padding:10px 7vw 130px;
}
.work-page .work-sequence-row,
.work-page .work-sequence-row.reverse{
  grid-template-columns:minmax(0,.88fr) minmax(280px,.72fr);
  gap:clamp(54px,7vw,112px);
  align-items:center;
  padding:72px 0;
}
.work-page .work-sequence-row figure,
.work-page .work-sequence-row.reverse figure{
  grid-column:1;
  grid-row:1;
  min-height:0;
  justify-content:flex-start;
}
.work-page .work-sequence-row figure img,
.work-page .work-sequence-row.reverse figure img{
  width:auto;
  height:auto;
  max-width:min(100%,680px);
  max-height:56vh;
  object-fit:contain;
}
.work-page .work-sequence-copy,
.work-page .work-sequence-row.reverse .work-sequence-copy{
  grid-column:2;
  grid-row:1;
  justify-self:start;
  width:100%;
  max-width:450px;
}
.work-page .work-sequence-copy h2{
  font-size:clamp(38px,5vw,76px);
  margin:25px 0 19px;
}
@media(max-width:900px){
  .work-page .work-sequence-balanced{padding-left:5vw;padding-right:5vw}
  .work-page .work-sequence-row,
  .work-page .work-sequence-row.reverse{grid-template-columns:minmax(0,.95fr) minmax(250px,.75fr);gap:36px;padding:60px 0}
  .work-page .work-sequence-row figure img,
  .work-page .work-sequence-row.reverse figure img{max-width:100%;max-height:48vh}
}
@media(max-width:700px){
  .work-page .work-sequence-balanced{padding:0 18px 80px}
  .work-page .work-sequence-row,
  .work-page .work-sequence-row.reverse{grid-template-columns:1fr;gap:28px;padding:52px 0}
  .work-page .work-sequence-row figure,
  .work-page .work-sequence-row.reverse figure,
  .work-page .work-sequence-copy,
  .work-page .work-sequence-row.reverse .work-sequence-copy{grid-column:1;grid-row:auto}
  .work-page .work-sequence-row figure img,
  .work-page .work-sequence-row.reverse figure img{max-height:none}
}

/* v0.20 — cream / black rhythm on secondary pages */
.work-page .work-recovery-intro{
  background:#0b0b0b;
  color:#f1eee7;
  padding:96px 7vw 92px;
  border-bottom:0;
}
.work-page .work-recovery-intro p{color:#aaa59c}
.work-page .work-recovery-intro .index{color:#d5d0c8}
.work-page .work-recovery-intro .index span{color:var(--signal)}
.work-page .work-sequence-balanced{padding-top:34px}

.index-page .index-intro{
  background:#0b0b0b;
  color:#f1eee7;
  border-bottom-color:#292929;
}
.index-page .index-intro p{color:#aaa59c}
.index-page .index-intro .index{color:#d5d0c8}
.index-page .index-intro .index span{color:var(--signal)}
.index-natural.index-dark-band{
  background:#0b0b0b;
  color:#f1eee7;
  margin:18px 0;
  padding-top:72px;
  padding-bottom:72px;
}
.index-dark-band .index-natural-item{color:#f1eee7}
.index-dark-band .index-natural-item>span{border-top-color:#373737;color:#aaa59c}
.index-natural.index-cream-tail{padding-top:72px}

@media(max-width:620px){
  .work-page .work-recovery-intro{padding:82px 18px 64px}
  .index-natural.index-dark-band,.index-natural.index-cream-tail{padding-top:50px;padding-bottom:50px}
}

/* v0.21 — black menu only on WORK + INDEX; all content stays cream */
.work-page .topbar,
.index-page .topbar{
  color:var(--paper);
  mix-blend-mode:normal;
  background:#0b0b0b;
  backdrop-filter:none;
  border-bottom:1px solid rgba(240,237,231,.08);
}
.work-page .topbar .brand,
.work-page .topbar .nav a,
.work-page .topbar .place,
.index-page .topbar .brand,
.index-page .topbar .nav a,
.index-page .topbar .place{color:var(--paper)}
.work-page .topbar .place i,
.index-page .topbar .place i{background:var(--signal)}

.work-page .work-recovery-intro,
.index-page .index-intro{
  background:var(--paper);
  color:var(--ink);
  border-bottom:1px solid #c2bcb3;
}
.work-page .work-recovery-intro{padding:90px 7vw 92px}
.work-page .work-recovery-intro p,
.index-page .index-intro p{color:#5f5a53}
.work-page .work-recovery-intro .index,
.index-page .index-intro .index{color:var(--ink)}
.work-page .work-recovery-intro .index span,
.index-page .index-intro .index span{color:var(--signal)}

.index-natural.index-dark-band,
.index-natural.index-cream-tail,
.index-natural.index-cream-head{
  background:var(--paper);
  color:var(--ink);
  margin:0;
  padding-top:52px;
  padding-bottom:90px;
}
.index-dark-band .index-natural-item{color:var(--ink)}
.index-dark-band .index-natural-item>span{
  border-top-color:#c4beb5;
  color:#6f6a63;
}

@media(max-width:620px){
  .work-page .work-recovery-intro{padding:80px 18px 64px}
  .index-natural.index-dark-band,
  .index-natural.index-cream-tail,
  .index-natural.index-cream-head{padding:34px 18px 60px}
}

/* v0.23 — unify black navigation across project category pages */
.project-page .topbar{
  color:var(--paper);
  mix-blend-mode:normal;
  background:#0b0b0b;
  backdrop-filter:none;
  border-bottom:1px solid rgba(240,237,231,.08);
}
.project-page .topbar .brand,
.project-page .topbar .nav a,
.project-page .topbar .place{color:var(--paper)}
.project-page .topbar .place i{background:var(--signal)}




/* v0.25 — ZEWLEAN brand-system fix -------------------------------------
   Tight SVG; the rat belongs to the wordmark, never to the location label. */
.brand-lockup{
  display:inline-flex;
  align-items:center;
  gap:7px;
  white-space:nowrap;
}
.brand-lockup::after{display:none!important}
.brand-lockup .brand-rat{
  display:block;
  width:22px;
  height:auto;
  flex:0 0 auto;
  transform:translateY(1px);
}

.hero-wordmark{
  display:inline-flex;
  align-items:center;
  gap:clamp(12px,1.25vw,22px);
  max-width:100%;
}
.hero-wordmark-text{display:block}
.hero-rat{
  display:block;
  width:clamp(56px,5.8vw,92px)!important;
  height:auto!important;
  max-height:none!important;
  flex:0 0 auto;
  object-fit:contain;
  transform:none!important;
  filter:none;
}

/* Location stays a location signal, not a second logo. */
.topbar .place{gap:8px}
.topbar .place i{
  display:block;
  width:7px;
  height:7px;
  flex:0 0 auto;
  border-radius:50%;
  background:var(--signal);
}

/* All dark secondary headers use the exact same lockup. */
.work-page .topbar .brand-rat,
.index-page .topbar .brand-rat,
.project-page .topbar .brand-rat,
.motion-page .topbar .brand-rat{width:22px}

@media(max-width:700px){
  .brand-lockup{gap:6px}
  .brand-lockup .brand-rat{width:19px}
  .hero-wordmark{gap:10px}
  .hero-rat{width:clamp(46px,12vw,62px)!important}
}


/* v0.26 — HERO RAT ONLY -------------------------------------------------
   Rat mark lives only beside the large ZEWLEAN over the landing video.
   All navigation/header wordmarks return to the original red signal dot. */
.brand-lockup{display:inline!important}
.brand-rat{display:none!important}

/* Undo the old generic hero span-as-dot rule for the actual wordmark text. */
.hero-wordmark .hero-wordmark-text{
  display:block!important;
  width:auto!important;
  height:auto!important;
  margin:0!important;
  border-radius:0!important;
  background:transparent!important;
  vertical-align:baseline!important;
  color:#fff!important;
  overflow:visible!important;
}
.hero-wordmark{
  display:inline-flex!important;
  align-items:center!important;
  gap:clamp(8px,.75vw,14px)!important;
  max-width:none!important;
  overflow:visible!important;
}
.hero-rat{
  display:block!important;
  width:clamp(32px,3.35vw,52px)!important;
  height:auto!important;
  aspect-ratio:1224 / 632;
  flex:0 0 auto!important;
  object-fit:contain!important;
  overflow:visible!important;
  transform:translateY(.03em)!important;
  filter:none!important;
}
/* No extra red dot in the hero lockup: the rat is the signal. */
.hero-wordmark::after,.hero-wordmark-text::after{content:none!important;display:none!important}

@media(max-width:700px){
  .hero-wordmark{gap:7px!important}
  .hero-rat{width:clamp(27px,9vw,38px)!important}
}

/* v0.27 — TECH / MOBILE / ACCESSIBILITY PASS --------------------------- */
:root{
  --safe-left:max(18px,env(safe-area-inset-left));
  --safe-right:max(18px,env(safe-area-inset-right));
}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:82px}
body{min-width:320px}
button,a{-webkit-tap-highlight-color:transparent}
button{touch-action:manipulation}
img{height:auto}

.skip-link{
  position:fixed;z-index:9999;left:12px;top:10px;
  transform:translateY(-160%);background:var(--paper);color:var(--ink);
  padding:10px 12px;font:9px var(--mono);letter-spacing:.1em;
  border:1px solid var(--ink);transition:transform .15s ease;
}
.skip-link:focus{transform:translateY(0)}
:focus-visible{outline:2px solid var(--signal);outline-offset:4px}
.nav a[aria-current="page"]{opacity:1}

.menu-toggle{
  display:none;pointer-events:auto;border:0;background:none;color:inherit;
  padding:12px 0;font:9px var(--mono);letter-spacing:.12em;cursor:pointer;
}

/* Prevent expensive off-screen sections from blocking first paint. */
.selected-projects,.about-v15,.contact-v15{content-visibility:auto;contain-intrinsic-size:900px}

/* Motion controls: expanded but still quiet. */
.motion-controls{flex-wrap:wrap}
.motion-controls [data-motion-mute],.motion-controls [data-motion-fullscreen]{opacity:.7}
.motion-controls [data-motion-mute]:hover,.motion-controls [data-motion-fullscreen]:hover{opacity:1}

/* Project strip buttons were not consistently receiving the arrow styling. */
[data-strip-prev],[data-strip-next]{
  min-width:42px;min-height:36px;border:1px solid #b8b2a9;background:transparent;
  color:inherit;cursor:pointer;
}

@media (hover:hover) and (pointer:fine){
  .nav a,.project-print,.work-sequence-row,.motion-mini-item,[data-motion-item]{transition:opacity .2s ease}
}

@media(max-width:800px){
  html{scroll-padding-top:62px}
  .topbar{
    height:62px;padding-left:var(--safe-left);padding-right:var(--safe-right);
    grid-template-columns:auto 1fr auto;gap:16px;
  }
  .topbar .brand{grid-column:1;z-index:2}
  .topbar .place{display:none!important}
  .menu-toggle{display:block;grid-column:3;justify-self:end;z-index:2}
  .topbar .nav{
    display:flex!important;position:fixed;z-index:-1;inset:62px 0 0;
    flex-direction:column;align-items:flex-start;justify-content:center;
    gap:0;padding:calc(28px + env(safe-area-inset-top)) var(--safe-right) calc(36px + env(safe-area-inset-bottom)) var(--safe-left);
    background:#0b0b0b;color:var(--paper);opacity:0;visibility:hidden;
    transform:translateY(-8px);transition:opacity .2s ease,transform .2s ease,visibility .2s;
    pointer-events:none;mix-blend-mode:normal;
  }
  .topbar .nav a{
    width:100%;padding:15px 0;border-bottom:1px solid #292929;
    font:500 clamp(34px,11vw,58px)/.9 var(--sans);letter-spacing:-.05em;opacity:1;
  }
  .topbar .nav a[aria-current="page"]{color:var(--signal)}
  body.menu-open{overflow:hidden}
  body.menu-open .topbar{background:#0b0b0b!important;color:var(--paper)!important;mix-blend-mode:normal!important;border-bottom:1px solid #292929}
  body.menu-open .topbar .nav{opacity:1;visibility:visible;transform:none;pointer-events:auto}
  body.menu-open .menu-toggle{color:var(--paper)}
  body.menu-open .brand{color:var(--paper)}

  .hero{min-height:540px;height:100svh}
  .hero-copy-refined{left:var(--safe-left);right:var(--safe-right);bottom:max(12vh,86px)}
  .scroll-cue{left:var(--safe-left);bottom:max(22px,env(safe-area-inset-bottom))}
  .video-toggle{right:var(--safe-right);bottom:max(22px,env(safe-area-inset-bottom));min-width:36px;min-height:36px}
  .hero-wordmark{max-width:calc(100vw - 36px)!important;flex-wrap:nowrap}
  .hero-wordmark-text{font-size:clamp(44px,14vw,76px)!important;line-height:.8}
  .hero-rat{width:clamp(29px,9vw,44px)!important;max-width:15vw!important}

  .selected-head{align-items:flex-start}
  .rail{scroll-padding-left:var(--safe-left);overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}

  .project-balanced{width:auto!important;margin-left:var(--safe-left);margin-right:var(--safe-right)}
  .project-balanced .project-print-meta{padding-top:11px}

  .motion-deck-media video,.cinema-screen video{object-fit:contain;background:#050505}
  .motion-controls button,.cinema-controls button{min-height:42px}
  .cinema-player-side .cinema-screen{min-height:42svh}

  .horizontal-strip{overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory}
  .hframe{height:min(56svh,560px);max-width:88vw;scroll-snap-align:center}
  .hframe img{max-width:88vw}
  .hpg-arrows,[data-strip-prev],[data-strip-next]{touch-action:manipulation}

  .viewer{padding-bottom:max(28px,env(safe-area-inset-bottom))}
  .viewer-close{min-width:44px;min-height:44px}
  .viewer-nav{min-width:44px;min-height:44px}
  .project-footer{padding-bottom:max(24px,env(safe-area-inset-bottom))}
}

@media(max-width:480px){
  .first-turn{padding-top:58px}
  .first-turn-image{margin-top:48px}
  .selected{padding-top:54px!important;padding-bottom:58px!important}
  .selected h2{font-size:11vw}
  .selected-sub{line-height:1.45}
  .project-prints-head{align-items:flex-start;gap:18px}
  .project-prints-head a{white-space:nowrap}
  .work-page .work-sequence-copy h2{font-size:12vw;line-height:.86}
  .work-page .work-sequence-row,.work-page .work-sequence-row.reverse{padding:44px 0}
  .hpg-intro{padding-top:34px}
  .hpg-controls{align-items:flex-end;gap:12px}
  .hpg-controls>span{max-width:170px;line-height:1.45}
  .hframe{height:min(49svh,500px);max-width:90vw}
  .hframe img{max-width:90vw}
  .cinema-player-side .cinema-side-menu{padding-top:44px;padding-bottom:48px}
  .motion-controls{gap:6px}
  .motion-controls button{font-size:8px}
  .about-photo-copy h2,.contact-photo-copy h2{overflow-wrap:anywhere}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .hero-video{display:none!important}
  .hero{background:url('assets/posters/ponikva-kocani1.jpg') center/cover no-repeat!important}
}

/* PREFINAL — CREATIVE POLISH / SYSTEM PASS ----------------------------- */
:root{
  --ease-out:cubic-bezier(.22,.61,.36,1);
  --ease-soft:cubic-bezier(.25,.46,.45,.94);
}
html{scroll-behavior:smooth}
body{font-kerning:normal;text-rendering:optimizeLegibility}

/* Navigation: quiet, tactile, consistent. */
.topbar .nav a,.topbar .brand,.project-footer a,.contact-actions a,.motion-open,.selected-index-link,.project-prints-head a{
  transition:opacity .22s var(--ease-soft),color .22s var(--ease-soft),border-color .22s var(--ease-soft);
}
@media (hover:hover) and (pointer:fine){
  .topbar .nav:hover a{opacity:.48}
  .topbar .nav a:hover,.topbar .nav a:focus-visible{opacity:1;color:var(--signal)}
  .project-footer a:hover,.contact-actions a:hover,.motion-open:hover,.selected-index-link:hover,.project-prints-head a:hover{color:var(--signal)}
}

/* Hero mark: one intentional signal only; no clipping or inherited dot rules. */
.hero-copy-refined{overflow:visible}
.hero-wordmark,.hero-wordmark-text,.hero-rat{overflow:visible!important}
.hero-rat{min-width:32px;will-change:auto}

/* Selected frames: preserve the photograph; animate tone rather than crop. */
.frame{transition:opacity .25s var(--ease-soft)}
.frame img{transition:filter .3s var(--ease-soft),transform .35s var(--ease-out)}
@media (hover:hover) and (pointer:fine){
  .rail:hover .frame{opacity:.66}
  .rail .frame:hover{opacity:1}
  .rail .frame:hover img{transform:translateY(-3px)}
}

/* Project cards and WORK: movement stays small and editorial. */
.project-print figure img,.work-sequence-row figure img{transition:transform .38s var(--ease-out),opacity .3s ease,filter .3s ease!important}
.project-print-meta em,.work-sequence-copy b{transition:transform .3s var(--ease-out),color .25s ease,border-color .25s ease;display:inline-block}
@media (hover:hover) and (pointer:fine){
  .project-print:hover figure img{transform:translateY(-4px)}
  .project-print:hover .project-print-meta em{transform:translateX(5px);color:var(--signal)}
  .work-sequence-row:hover figure img{transform:translateY(-4px);opacity:.96}
  .work-sequence-row:hover .work-sequence-copy b{transform:translateX(4px);color:var(--signal);border-color:var(--signal)}
}

/* Natural-ratio pages remain natural. Never turn project photography into thumbnails. */
.horizontal-strip .hframe,.horizontal-strip .hframe img,.index-natural-item,.index-natural-item img{
  object-fit:contain!important;
}
.index-natural-item img{transition:filter .3s ease,transform .35s var(--ease-out)}
.index-natural-item span{transition:border-color .25s ease,color .25s ease}
@media (hover:hover) and (pointer:fine){
  .index-natural-item:hover img{transform:translateY(-3px);filter:saturate(1.02)}
  .index-natural-item:hover span{border-color:var(--signal);color:var(--signal)}
}

/* Horizontal project sequence: clearer affordance without visual chrome. */
.horizontal-strip{scrollbar-width:thin;scrollbar-color:#8e8880 transparent}
.hframe{transition:opacity .22s ease,transform .3s var(--ease-out)}
@media (hover:hover) and (pointer:fine){
  .horizontal-strip:hover .hframe{opacity:.72}
  .horizontal-strip .hframe:hover{opacity:1;transform:translateY(-2px)}
}

/* Motion controls behave like one system. */
.motion-controls button,.cinema-controls button,[data-strip-prev],[data-strip-next],.selected-actions button{
  transition:background .2s ease,color .2s ease,border-color .2s ease,opacity .2s ease,transform .2s var(--ease-out);
}
@media (hover:hover) and (pointer:fine){
  .motion-controls button:hover,.cinema-controls button:hover,[data-strip-prev]:hover,[data-strip-next]:hover,.selected-actions button:hover{
    border-color:var(--signal);color:var(--signal);transform:translateY(-1px)
  }
}

/* About: researched bio gets room to read; metadata remains secondary. */
.about-photo-copy>p:not(.alias){max-width:760px;font-size:clamp(19px,1.72vw,29px);line-height:1.22;letter-spacing:-.018em}
.about-meta{display:flex;flex-direction:column;align-items:flex-start;gap:7px;margin-top:42px}
.about-meta span{line-height:1.45}

/* Touch targets and mobile rhythm. */
@media(max-width:800px){
  .topbar .nav a{min-height:54px;display:flex;align-items:center}
  .project-print,.work-sequence-row{-webkit-tap-highlight-color:rgba(240,68,46,.12)}
  .about-meta{margin-top:30px;gap:8px}
  .about-photo-copy>p:not(.alias){font-size:clamp(18px,5.3vw,24px);line-height:1.25}
}
@media(max-width:480px){
  .hero-rat{min-width:27px}
  .about-photo-copy>.alias{margin-bottom:30px}
  .about-meta span{font-size:7px}
}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.project-print figure img,.work-sequence-row figure img,.frame img,.hframe,.index-natural-item img{transform:none!important}}


/* PREFINAL LIVE POLISH — GSAP / GALLERIES / MOTION --------------------- */
:root{--ease-editorial:cubic-bezier(.22,1,.36,1)}

/* Project galleries: photographs stay natural; no paper-colour "frame" on mobile. */
.hframe{background:transparent}
.hframe img{background:transparent}
.project-sequence-counter{
  margin-left:auto;font:8px var(--mono);letter-spacing:.12em;color:#625e58;
  white-space:nowrap;min-width:58px;text-align:right
}
.hpg-controls{gap:18px}
.hpg-controls>div{display:flex;align-items:center;gap:6px}

/* Quiet opening state is created by JS only when animation is available. */
.hpg-intro h1,.hpg-intro p,.hpg-intro .index{will-change:transform,opacity}

/* A next-project link behaves like an editorial hand-off, not a card. */
.hpg-footer{position:relative;overflow:visible}
.next-project-link{position:relative;z-index:2;display:inline-flex;align-items:center;gap:10px}
.next-project-preview{
  position:absolute;right:3.2vw;bottom:54px;width:min(250px,24vw);pointer-events:none;
  opacity:0;visibility:hidden;transform:translateY(10px);z-index:1
}
.next-project-preview img{display:block;width:100%;height:auto;max-height:220px;object-fit:contain;background:#111}

/* Full-screen image viewer: quieter chrome, stronger image. */
.viewer{opacity:0}
.viewer.open{opacity:1}
.viewer-stage img{will-change:transform,opacity}
.viewer-nav,.viewer-close{transition:opacity .2s ease,border-color .2s ease,background .2s ease}
.viewer:not(:hover) .viewer-nav{opacity:.55}
.viewer-stage figcaption{user-select:none}

/* Direct fullscreen affordance for moving images. */
.motion-deck-media,.cinema-screen{position:relative}
.video-direct-fullscreen{
  position:absolute;z-index:6;top:14px;right:14px;width:38px;height:38px;padding:0;
  display:grid;place-items:center;border:1px solid rgba(255,255,255,.42);border-radius:50%;
  background:rgba(5,5,5,.32);backdrop-filter:blur(5px);color:#fff;cursor:pointer;
  font:15px/1 var(--sans);opacity:.72;transition:opacity .2s ease,background .2s ease,transform .2s ease
}
.video-direct-fullscreen:hover{opacity:1;background:rgba(5,5,5,.62);transform:scale(1.035)}
.video-direct-fullscreen:focus-visible{opacity:1}
.motion-deck-media video,.cinema-screen video{cursor:pointer}

/* GSAP-enhanced sections keep the movement almost imperceptible. */
.gsap-soft-reveal{will-change:transform,opacity}

@media(max-width:800px){
  /* Mobile: image itself defines the frame. No fixed coloured box around it. */
  .horizontal-strip{align-items:center;padding-left:var(--safe-left);padding-right:var(--safe-right);gap:18px}
  .hframe{
    height:auto!important;max-height:none!important;max-width:calc(100vw - 36px)!important;
    overflow:visible;background:transparent!important;display:flex;align-items:center;justify-content:center
  }
  .hframe img{
    width:auto!important;height:auto!important;max-width:calc(100vw - 36px)!important;
    max-height:70svh!important;object-fit:contain!important;background:transparent!important
  }
  .hpg-controls{align-items:center}
  .project-sequence-counter{font-size:7px}
  .next-project-preview{display:none}
  .video-direct-fullscreen{top:10px;right:10px;width:42px;height:42px;opacity:.82}
}
@media(max-width:480px){
  .horizontal-strip{gap:14px}
  .hframe img{max-height:68svh!important}
}
@media(prefers-reduced-motion:reduce){
  .next-project-preview,.video-direct-fullscreen,.viewer,.viewer-stage img{transition:none!important}
}

/* HOME GSAP PASS ------------------------------------------------------- */
.hero-video{transform-origin:center center;will-change:transform}
.hero-copy-refined,.scroll-cue{will-change:transform,opacity}
.first-turn-image,.selected-projects .project-print figure,.motion-deck-media{will-change:transform,opacity}
.rail .frame,.rail .frame img{will-change:transform,opacity}

/* Project gallery safety: the first frame must always exist visually even if animation is interrupted. */
.horizontal-strip .hframe:first-child{opacity:1!important;visibility:visible!important}
.horizontal-strip .hframe:first-child img{visibility:visible!important}

@media(max-width:800px){
  /* Keep mobile motion restrained; no artificial vertical drift in Selected Frames. */
  .rail .frame img{transform-origin:center center}
}
@media(prefers-reduced-motion:reduce){
  .hero-video,.hero-copy-refined,.scroll-cue,.first-turn-image,.rail .frame,.rail .frame img,
  .selected-projects .project-print figure,.motion-deck-media{will-change:auto!important}
}

/* === CINEMATIC MOTION PASS === */
.cinematic-page-veil{
  position:fixed; inset:0; z-index:99999; pointer-events:none;
  background:#050505;
}
.project-sequence-counter{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:74px; margin-left:14px;
  font:600 11px/1 "SFMono-Regular",Consolas,"Liberation Mono",monospace;
  letter-spacing:.12em; color:var(--signal,#f0442e);
}
@media (max-width:800px){
  .project-sequence-counter{min-width:auto;margin-left:8px;font-size:10px;letter-spacing:.08em}
}

/* Project-to-project / Work-to-project cinematic handoff */
body.cinematic-entry{--entry-opacity:1}
body.cinematic-entry::after{
  content:""; position:fixed; inset:0; z-index:99998; pointer-events:none;
  background:#050505; opacity:var(--entry-opacity,1);
}
body.cinematic-entry.cinematic-entered::after{display:none}

/* Keep project frames photographic, never card-like. */
.project-page .horizontal-strip .hframe{
  background:transparent!important; box-shadow:none!important; border:0!important;
}
.project-page .horizontal-strip .hframe img{
  box-shadow:none!important; outline:0!important;
}

/* Selected Frames fullscreen — cinematic handoff and cleaner depth. */
.selected-transition-clone{box-shadow:0 24px 70px rgba(0,0,0,.38)}
#viewer .viewer-stage{perspective:1200px}
#viewer #viewerImage{transform-origin:center center}
#viewer.open .viewer-stage figcaption{position:relative;z-index:2}
@media(max-width:700px){
  .selected-transition-clone{box-shadow:none}
}


/* === R4 PREVIEW: cinematic landscape fullscreen + social WebView safety === */
/* Landscape photographs may become full-bleed only when JS confirms the crop stays reasonable.
   Portraits and extreme aspect ratios keep the full original frame visible. */
.viewer.viewer-landscape-fullbleed{padding:0;background:#050505}
.viewer.viewer-landscape-fullbleed .viewer-stage{
  width:100vw;height:100dvh;max-width:none;max-height:none;gap:0;margin:0;display:block;position:relative
}
.viewer.viewer-landscape-fullbleed .viewer-stage img{
  width:100vw!important;height:100dvh!important;max-width:none!important;max-height:none!important;
  object-fit:cover!important;object-position:center center
}
.viewer.viewer-landscape-fullbleed .viewer-stage figcaption{
  position:absolute;z-index:4;left:0;right:0;bottom:0;width:100%;padding:42px 80px 24px;
  background:linear-gradient(to top,rgba(0,0,0,.58),rgba(0,0,0,0));color:rgba(255,255,255,.72)
}
.viewer.viewer-landscape-fullbleed .viewer-nav{z-index:5;background:rgba(5,5,5,.34);border-color:rgba(255,255,255,.38)}
.viewer.viewer-landscape-fullbleed .viewer-close{z-index:6;text-shadow:0 1px 12px rgba(0,0,0,.7)}

/* Facebook / Messenger / Instagram in-app browsers can leave ScrollTrigger's initial
   hidden state behind. Keep the Motion block fully usable there and avoid blur filters. */
.social-webview .motion-deck-side,
.social-webview .motion-deck-media{
  opacity:1!important;visibility:visible!important;transform:none!important;clip-path:none!important
}
.social-webview .motion-controls button,
.social-webview .motion-mini-item{
  -webkit-appearance:none;appearance:none;background:#0b0b0b!important;color:#eee!important;
  opacity:1!important;visibility:visible!important
}
.social-webview .motion-mini-item.active{color:#fff!important}
.social-webview .motion-mini-item.active span{color:var(--signal)!important}
.social-webview .motion-center-play,
.social-webview .video-direct-fullscreen{
  -webkit-backdrop-filter:none!important;backdrop-filter:none!important;background:rgba(5,5,5,.68)!important
}

@media(max-width:800px){
  .viewer.viewer-landscape-fullbleed .viewer-stage figcaption{padding:48px 18px 18px}
  .viewer.viewer-landscape-fullbleed .viewer-nav.prev{left:10px}
  .viewer.viewer-landscape-fullbleed .viewer-nav.next{right:10px}
}
/* Selected Frames has an older ID-specific caption rule; full-bleed must win over it. */
#viewer.viewer-landscape-fullbleed .viewer-stage figcaption{position:absolute;z-index:4}

/* R4 EXPERIMENT — 03 / SELECTED PROJECTS: compact 2x2, same visual language */
@media (min-width:621px){
  .selected-projects{padding-top:54px;padding-bottom:30px}
  .selected-projects .project-prints-head{margin-bottom:38px}
  .project-balanced{
    width:min(1040px,78vw);
    column-gap:clamp(34px,5vw,72px)!important;
    row-gap:clamp(34px,4.5vw,62px)!important;
  }
  .project-balanced .project-print figure{
    height:clamp(220px,25vw,350px)!important;
  }
  .project-balanced .project-print img{max-width:86%!important}
  .project-balanced .project-print-meta{width:86%}
  .selected-projects .project-prints-foot{width:min(1040px,78vw);margin-top:28px}
}
@media (max-width:620px){
  .selected-projects{padding-top:54px;padding-bottom:30px}
  .selected-projects .project-prints-head{margin-bottom:40px}
  .project-balanced{gap:44px!important}
}

/* R4 EXPERIMENT — 04 / MOTION: translucent signage panel over the existing film */
@media (min-width:901px){
  .motion-deck-reverse{
    position:relative;
    display:block;
    min-height:720px;
    overflow:hidden;
    background:#050505;
  }
  .motion-deck-reverse .motion-deck-media{
    position:absolute;
    inset:0;
    width:100%;
    min-height:720px;
    order:initial;
  }
  .motion-deck-reverse .motion-deck-media video{
    width:100%;height:100%;max-height:none;
    object-fit:contain;
  }
  .motion-deck-reverse .motion-deck-side{
    position:relative;z-index:3;
    width:clamp(285px,28vw,430px);
    min-height:720px;
    padding:58px clamp(26px,3vw,48px) 42px;
    justify-content:center;
    border:0;
    border-right:1px solid rgba(255,255,255,.11);
    background:linear-gradient(90deg,rgba(5,5,5,.88) 0%,rgba(5,5,5,.70) 72%,rgba(5,5,5,.50) 100%);
    -webkit-backdrop-filter:blur(2px);
    backdrop-filter:blur(2px);
  }
  .motion-deck-side h2{
    margin:18px 0 22px;
    font-size:clamp(46px,5vw,76px);
  }
  .motion-deck-side>p{margin-bottom:25px;color:rgba(243,240,234,.52)}
  .motion-now{
    border:0;
    padding:8px 0 12px;
    grid-template-columns:48px 1fr;
    position:relative;
  }
  .motion-now:before{
    content:"";position:absolute;left:-15px;top:12px;width:5px;height:5px;border-radius:50%;background:var(--signal)
  }
  .motion-controls{gap:4px;margin:5px 0 16px}
  .motion-controls button{
    min-width:0;height:30px;padding:0 8px;
    border:0;border-radius:0;
    background:transparent;
    color:rgba(243,240,234,.72);
  }
  .motion-controls button:hover{background:transparent;color:var(--signal)}
  .motion-mini-list{border:0;margin-top:2px}
  .motion-mini-item{
    grid-template-columns:28px 1fr;
    border:0;
    padding:6px 0;
    color:rgba(243,240,234,.38);
    position:relative;
  }
  .motion-mini-item.active{color:#f3f0ea}
  .motion-mini-item.active:before{
    content:"";position:absolute;left:-15px;top:50%;width:5px;height:5px;border-radius:50%;background:var(--signal);transform:translateY(-50%)
  }
  .motion-mini-item.active span{color:var(--signal)}
  .motion-open{margin-top:18px;border:0;padding:0;color:rgba(243,240,234,.58)}
  .motion-open:hover{color:var(--signal)}

  /* keep the in-app browser fallback readable without turning the panel/buttons solid black */
  .social-webview .motion-deck-side{
    background:rgba(5,5,5,.82)!important;
    -webkit-backdrop-filter:none!important;backdrop-filter:none!important;
  }
  .social-webview .motion-controls button,
  .social-webview .motion-mini-item{background:transparent!important}
}

/* R4 EXPERIMENT B — 04 / MOTION: full gradient veil + stronger Tokyo signage rhythm */
@media (min-width:901px){
  .motion-deck-reverse .motion-deck-side{
    width:clamp(390px,42vw,650px);
    padding-right:clamp(90px,13vw,210px);
    border-right:0;
    background:linear-gradient(90deg,
      rgba(5,5,5,.94) 0%,
      rgba(5,5,5,.86) 34%,
      rgba(5,5,5,.62) 58%,
      rgba(5,5,5,.26) 79%,
      rgba(5,5,5,0) 100%);
    -webkit-backdrop-filter:none;
    backdrop-filter:none;
  }
  .motion-deck-reverse .motion-deck-side:after{
    content:"04  •  MOV  /  16:09";
    position:absolute;left:clamp(26px,3vw,48px);bottom:20px;
    font:500 8px/1 "SFMono-Regular",Consolas,"Liberation Mono",monospace;
    letter-spacing:.18em;color:rgba(243,240,234,.34);
    pointer-events:none;
  }
  .motion-deck-side .index{
    display:flex;align-items:center;gap:8px;
    letter-spacing:.14em;
  }
  .motion-deck-side .index:before{
    content:"";display:inline-block;width:8px;height:8px;border:2px solid var(--signal);border-radius:50%;
  }
  .motion-deck-side h2{letter-spacing:-.055em;line-height:.82}
  .motion-now{grid-template-columns:54px 1fr;column-gap:8px}
  .motion-now:before{display:none}
  .motion-now [data-motion-count]{
    display:inline-flex;align-items:center;justify-content:center;
    width:44px;height:20px;border-radius:999px;background:var(--signal);color:#090909;
    font-weight:700;letter-spacing:.06em;
  }
  .motion-controls{align-items:center;gap:10px;margin:9px 0 19px}
  .motion-controls button{
    height:25px;padding:0 2px;font-size:9px;letter-spacing:.12em;
  }
  .motion-controls button:first-child,.motion-controls button:nth-child(3){font-size:14px}
  .motion-mini-list{display:grid;gap:1px}
  .motion-mini-item{
    grid-template-columns:34px 1fr;padding:5px 0;
    font-size:9px;letter-spacing:.09em;
  }
  .motion-mini-item span{
    width:24px;height:16px;display:inline-flex;align-items:center;justify-content:center;
    border-radius:999px;
  }
  .motion-mini-item.active:before{display:none}
  .motion-mini-item.active span{background:var(--signal);color:#090909!important;font-weight:700}
  .motion-mini-item b{font-weight:500}
  .motion-open{font-size:9px;letter-spacing:.14em}

  /* Messenger/Facebook fallback keeps the same fading silhouette, only without filters. */
  .social-webview .motion-deck-side{
    background:linear-gradient(90deg,
      rgba(5,5,5,.96) 0%,rgba(5,5,5,.88) 34%,rgba(5,5,5,.66) 58%,rgba(5,5,5,.30) 79%,rgba(5,5,5,0) 100%)!important;
  }
}

/* R4 EXPERIMENT C — 04 / MOTION: FULL-BLEED FILM + transparent Tokyo control overlay */
@media (min-width:901px){
  .motion-deck-reverse{
    position:relative;display:block;min-height:720px;overflow:hidden;background:#050505;
  }
  .motion-deck-reverse .motion-deck-media{
    position:absolute;inset:0;z-index:1;width:100%;height:100%;min-height:720px;
  }
  .motion-deck-reverse .motion-deck-media video{
    position:absolute;inset:0;width:100%;height:100%;max-height:none;object-fit:cover;background:transparent;
  }
  .motion-deck-reverse .motion-deck-side{
    position:relative;z-index:3;width:clamp(310px,31vw,470px);min-height:720px;
    padding:52px clamp(28px,3.2vw,52px) 42px;
    border:0!important;background:transparent!important;
    -webkit-backdrop-filter:none!important;backdrop-filter:none!important;
    text-shadow:0 1px 16px rgba(0,0,0,.62);
  }
  /* only a soft readability shadow — never a visible panel */
  .motion-deck-reverse:after{
    content:"";position:absolute;z-index:2;inset:0 auto 0 0;width:min(54vw,760px);pointer-events:none;
    background:linear-gradient(90deg,rgba(0,0,0,.46) 0%,rgba(0,0,0,.23) 43%,rgba(0,0,0,.07) 72%,rgba(0,0,0,0) 100%);
  }
  .motion-deck-side .index{
    font:600 9px/1 var(--mono);letter-spacing:.22em;display:flex;align-items:center;gap:10px;color:rgba(255,255,255,.86)
  }
  .motion-deck-side .index:before{width:7px;height:7px;border:0;border-radius:50%;background:var(--signal)}
  .motion-deck-side .index:after{content:"MOV / ZEW";font:500 7px/1 var(--mono);letter-spacing:.2em;color:rgba(255,255,255,.48);margin-left:auto}
  .motion-deck-side h2{
    margin:22px 0 20px;font-size:clamp(48px,5.4vw,82px);line-height:.78;letter-spacing:-.065em;color:#f4f1eb
  }
  .motion-deck-side>p{max-width:290px;margin:0 0 26px;color:rgba(255,255,255,.68);font-size:8px;letter-spacing:.08em}
  .motion-now{border:0;padding:0 0 13px;grid-template-columns:52px 1fr;gap:10px}
  .motion-now [data-motion-count]{
    width:46px;height:22px;border-radius:0;background:var(--signal);color:#090909;
    font:700 8px/22px var(--mono);letter-spacing:.08em;text-align:center
  }
  .motion-now strong{font:600 10px/1 var(--mono);letter-spacing:.16em;color:#fff}
  .motion-controls{display:grid;grid-template-columns:34px 64px 34px 62px 48px;gap:3px;margin:4px 0 19px;align-items:center}
  .motion-controls button{
    height:30px;min-width:0;padding:0;border:0!important;background:rgba(0,0,0,.18)!important;
    color:rgba(255,255,255,.88);font:600 7px/1 var(--mono);letter-spacing:.14em;
  }
  .motion-controls button:first-child,.motion-controls button:nth-child(3){font-size:13px;color:var(--signal)}
  .motion-controls button:hover{background:var(--signal)!important;color:#090909!important}
  .motion-mini-list{display:grid;grid-template-columns:repeat(var(--motion-count,6),minmax(34px,1fr));gap:3px;border:0;margin:0;max-width:min(350px,100%)}
  .motion-mini-item{
    display:flex;align-items:center;justify-content:center;width:auto;height:29px;padding:0;border:0!important;
    background:rgba(0,0,0,.18)!important;color:rgba(255,255,255,.55);text-align:center
  }
  .motion-mini-item b{display:none}
  .motion-mini-item span{width:auto;height:auto;background:none!important;color:inherit!important;font:600 8px/1 var(--mono);letter-spacing:.08em}
  .motion-mini-item.active{background:var(--signal)!important;color:#090909!important}
  .motion-mini-item.active span{background:none!important;color:#090909!important}
  .motion-open{margin-top:18px;border:0;color:rgba(255,255,255,.76);font:600 8px/1 var(--mono);letter-spacing:.16em;text-shadow:0 1px 12px #000}
  .motion-open:before{content:"↗  ";color:var(--signal)}
  .motion-deck-reverse .motion-deck-side:after{
    content:"04—06   /   16:09   /   MOVING IMAGE UNIT";left:clamp(28px,3.2vw,52px);bottom:20px;
    color:rgba(255,255,255,.52);font:600 7px/1 var(--mono);letter-spacing:.18em
  }
  .motion-progress{z-index:5;background:rgba(255,255,255,.15)}
  .motion-center-play{z-index:5;background:rgba(0,0,0,.14);border-color:rgba(255,255,255,.72);backdrop-filter:none}
  .social-webview .motion-deck-side{background:transparent!important}
  .social-webview .motion-controls button,.social-webview .motion-mini-item{background:rgba(0,0,0,.24)!important;color:#fff!important}
  .social-webview .motion-mini-item.active{background:var(--signal)!important;color:#090909!important}
}

/* R4 MOTION WORLD EXPERIMENT — 04 is the portal, /motion is the room behind it. */
.motion-world-page{background:#050505;overflow:hidden}
.motion-world-page .topbar{z-index:90}
.motion-world{height:100svh;min-height:620px;background:#050505}
.motion-world-stage{position:relative;width:100%;height:100%;overflow:hidden;background:#050505}
.motion-world-screen{position:absolute!important;inset:0!important;z-index:1;min-height:0!important;max-height:none!important;width:100%;height:100%;border:0!important;background:#050505!important}
.motion-world-screen video{position:absolute;inset:0;width:100%;height:100%;max-height:none!important;object-fit:cover!important;background:#050505;cursor:pointer;filter:saturate(.90) contrast(1.03)}
.motion-world-shade{position:absolute;z-index:2;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(0,0,0,.58) 0%,rgba(0,0,0,.31) 27%,rgba(0,0,0,.08) 55%,rgba(0,0,0,.05) 100%),linear-gradient(0deg,rgba(0,0,0,.38) 0%,transparent 31%)}
.motion-world-ui{position:absolute;z-index:4;inset:0;padding:112px 3.2vw 26px;display:flex;flex-direction:column;pointer-events:none;text-shadow:0 1px 18px rgba(0,0,0,.58)}
.motion-world-ui button,.motion-world-ui a{pointer-events:auto}
.motion-world-head{width:min(560px,46vw)}
.motion-world-kicker{display:grid;grid-template-columns:8px auto 1fr;align-items:center;gap:10px;font:600 8px/1 var(--mono);letter-spacing:.20em;color:rgba(255,255,255,.82)}
.motion-world-kicker i{display:block;width:7px;height:7px;border-radius:50%;background:var(--signal)}
.motion-world-kicker b{justify-self:end;font:500 7px/1 var(--mono);letter-spacing:.17em;color:rgba(255,255,255,.45)}
.motion-world-head h1{margin:20px 0 13px;font:600 clamp(58px,7.4vw,124px)/.76 var(--sans);letter-spacing:-.075em;color:#f4f1eb}
.motion-world-head p{margin:0;font:600 7px/1.4 var(--mono);letter-spacing:.17em;color:rgba(255,255,255,.55)}
.motion-world-console{margin-top:auto;width:min(650px,58vw)}
.motion-world-now{display:grid;grid-template-columns:58px minmax(120px,1fr) auto;align-items:center;gap:10px;margin-bottom:10px}
.motion-world-now [data-motion-count]{height:23px;display:flex;align-items:center;justify-content:center;background:var(--signal);color:#090909;font:700 8px/1 var(--mono);letter-spacing:.08em;text-shadow:none}
.motion-world-now strong{font:600 10px/1 var(--mono);letter-spacing:.16em;color:#fff}
.motion-world-now small{font:500 7px/1 var(--mono);letter-spacing:.15em;color:rgba(255,255,255,.47)}
.motion-world-controls{display:grid!important;grid-template-columns:38px 72px 38px 66px 52px!important;gap:3px!important;margin:0 0 8px!important;width:max-content}
.motion-world-controls button{height:31px!important;min-width:0!important;padding:0 8px!important;border:0!important;background:rgba(0,0,0,.25)!important;color:rgba(255,255,255,.9)!important;font:600 7px/1 var(--mono)!important;letter-spacing:.13em!important;backdrop-filter:blur(3px)}
.motion-world-controls button:first-child,.motion-world-controls button:nth-child(3){font-size:14px!important;color:var(--signal)!important}
.motion-world-controls button:hover{background:var(--signal)!important;color:#090909!important;text-shadow:none}
.motion-world-route{display:grid;grid-template-columns:repeat(var(--motion-count,6),minmax(28px,1fr));gap:3px;width:100%}
.motion-world-stop{position:relative;height:42px;border:0;background:rgba(0,0,0,.25);color:rgba(255,255,255,.58);cursor:pointer;text-align:left;padding:8px 9px;backdrop-filter:blur(3px)}
.motion-world-stop span{display:block;font:700 8px/1 var(--mono);letter-spacing:.09em}
.motion-world-stop b{display:block;margin-top:6px;font:500 6px/1 var(--mono);letter-spacing:.10em;opacity:.55}
.motion-world-stop:after{content:"";position:absolute;left:9px;right:9px;bottom:5px;height:1px;background:rgba(255,255,255,.18)}
.motion-world-stop.active{background:var(--signal);color:#090909;text-shadow:none}
.motion-world-stop.active b{opacity:.75}.motion-world-stop.active:after{background:#090909}
.motion-world-stop:hover:not(.active){color:#fff;background:rgba(0,0,0,.42)}
.motion-world-status{display:flex;gap:22px;margin-top:13px;font:500 6px/1 var(--mono);letter-spacing:.14em;color:rgba(255,255,255,.44)}
.motion-world-screen .motion-progress{position:absolute;z-index:6;left:0;right:0;bottom:0;height:2px;background:rgba(255,255,255,.12)}
.motion-world-screen .motion-progress span{display:block;height:100%;width:0;background:var(--signal)}
.motion-world-screen .motion-center-play{z-index:7;background:rgba(0,0,0,.14);border-color:rgba(255,255,255,.76);backdrop-filter:none}
.motion-world-screen .video-direct-fullscreen{z-index:7}
.motion-entry-curtain{position:fixed;z-index:999;inset:0;background:#050505;pointer-events:none;animation:motionWorldEnter .72s cubic-bezier(.22,.75,.22,1) forwards}
@keyframes motionWorldEnter{0%{opacity:1}38%{opacity:1}100%{opacity:0;visibility:hidden}}
.motion-handoff-curtain{position:fixed;z-index:9999;inset:0;background:#050505;opacity:0;pointer-events:none;transition:opacity .42s cubic-bezier(.4,0,.2,1)}
.motion-handoff-curtain.on{opacity:1}

@media(max-width:800px){
  .motion-world-page{overflow:hidden}
  .motion-world{min-height:100svh;height:100svh}
  .motion-world-ui{padding:86px 18px 17px}
  .motion-world-head{width:min(88vw,480px)}
  .motion-world-head h1{font-size:15.5vw;margin-top:16px}
  .motion-world-kicker{grid-template-columns:7px auto 1fr}.motion-world-kicker b{font-size:6px}
  .motion-world-console{width:100%}
  .motion-world-now{grid-template-columns:54px 1fr}.motion-world-now small{display:none}
  .motion-world-controls{grid-template-columns:36px 66px 36px 60px 48px!important}
  .motion-world-route{grid-template-columns:repeat(var(--motion-count,6),minmax(26px,1fr));gap:2px;overflow-x:auto}
  .motion-world-stop{height:34px;padding:0;display:flex;align-items:center;justify-content:center;text-align:center;background:rgba(0,0,0,.32)}
  .motion-world-stop b,.motion-world-stop:after{display:none}.motion-world-stop span{font-size:7px}
  .motion-world-status{gap:13px;white-space:nowrap;overflow:hidden}.motion-world-status span:nth-child(n+3){display:none}
  .motion-world-shade{background:linear-gradient(90deg,rgba(0,0,0,.46) 0%,rgba(0,0,0,.12) 72%),linear-gradient(0deg,rgba(0,0,0,.58) 0%,transparent 43%)}
}
@media(max-width:520px){
  .motion-world-head h1{font-size:17.2vw}
  .motion-world-head p{font-size:6px;max-width:78vw}
  .motion-world-controls{grid-template-columns:34px 60px 34px 56px 44px!important}
  .motion-world-controls button{padding:0 4px!important}
}
@media(prefers-reduced-motion:reduce){.motion-entry-curtain{animation:none;display:none}.motion-handoff-curtain{transition:none}}


/* R4 PORTALS + INDEX MICRO-SIGNAGE EXPERIMENT
   HOME titles become quiet portals; INDEX keeps the existing natural masonry. */
.section-portal-title{
  color:inherit;
  text-decoration:none;
  display:inline-block;
  position:relative;
}
.section-portal-title>span{
  display:inline-block;
  margin-left:.22em;
  font:600 .18em/1 var(--mono);
  letter-spacing:0;
  vertical-align:top;
  transform:translateY(.35em);
  opacity:.42;
  transition:opacity .2s ease,transform .24s var(--ease-out),color .2s ease;
}
@media(hover:hover){
  .section-portal-title:hover>span{opacity:1;color:var(--signal);transform:translate(.18em,.18em)}
}
.section-portal-title:focus-visible{outline:1px solid var(--signal);outline-offset:6px}

/* INDEX stays photographic; the added language is archival, not MOTION/Tokyo UI. */
.index-natural-item>span{
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
}
.index-natural-item .index-archive-code{
  position:relative;
  padding-left:12px;
  font:500 6px/1 var(--mono);
  font-style:normal;
  letter-spacing:.16em;
  color:#9a958d;
  white-space:nowrap;
  justify-self:start;
}
.index-natural-item .index-archive-code:before{
  content:"";
  position:absolute;
  left:0;
  top:50%;
  width:5px;
  height:5px;
  transform:translateY(-50%);
  border:1px solid #9a958d;
  border-radius:50%;
}
.index-natural-item em{justify-self:end}
@media(hover:hover){
  .index-natural-item:hover .index-archive-code{color:#6f6a63}
  .index-natural-item:hover .index-archive-code:before{background:var(--signal);border-color:var(--signal)}
}
@media(max-width:620px){
  .section-portal-title>span{opacity:.62}
  .index-natural-item>span{grid-template-columns:auto 1fr auto;gap:8px}
  .index-natural-item .index-archive-code{font-size:5.5px;padding-left:9px;letter-spacing:.12em}
  .index-natural-item .index-archive-code:before{width:4px;height:4px}
}


/* === INDEX SIGNAL / stronger archive language, still secondary to the photographs === */
.index-signal-strip{
  margin:0 3.2vw;
  padding:10px 0 9px;
  border-top:1px solid #bdb7ae;
  border-bottom:1px solid #bdb7ae;
  display:grid;
  grid-template-columns:1.25fr .75fr .75fr 1fr 1fr;
  gap:18px;
  align-items:center;
  font:600 7px/1 var(--mono);
  letter-spacing:.17em;
  color:#777169;
  text-transform:uppercase;
}
.index-signal-strip span{white-space:nowrap}
.index-signal-strip span:last-child{text-align:right;color:var(--signal)}
.index-signal-strip i{
  display:inline-block;
  width:6px;height:6px;
  margin-right:9px;
  background:var(--signal);
  vertical-align:-1px;
}
.index-natural{padding-top:34px}
.index-natural-item>span{
  border-top-color:#aaa49b;
  grid-template-columns:30px 1fr auto;
}
.index-natural-item b{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:24px;height:14px;
  background:var(--signal);
  color:#fff;
  font:700 7px/1 var(--mono);
  letter-spacing:.08em;
}
.index-natural-item .index-archive-code{
  color:#6e6961;
  font-size:6.5px;
  letter-spacing:.19em;
}
.index-natural-item .index-archive-code:before{
  width:6px;height:6px;
  border-radius:0;
  border-color:#777169;
}
.index-natural-item em{
  font-size:7px;
  letter-spacing:.14em;
  color:#5f5a53;
}
@media(hover:hover){
  .index-natural-item:hover .index-archive-code:before{transform:translateY(-50%) rotate(45deg)}
}
@media(max-width:620px){
  .index-signal-strip{
    margin:0 18px;
    grid-template-columns:1fr auto;
    gap:8px 14px;
    font-size:6px;
    letter-spacing:.13em;
  }
  .index-signal-strip span:nth-child(2),
  .index-signal-strip span:nth-child(4){display:none}
  .index-signal-strip span:last-child{text-align:right}
  .index-natural{padding-top:26px}
  .index-natural-item>span{grid-template-columns:28px 1fr auto}
}

/* R4 TOKYO PORTAL — a wayfinding marker, not a CTA button. */
.motion-metro-portal{
  position:absolute;z-index:8;right:clamp(20px,2.6vw,42px);bottom:clamp(25px,3.1vw,46px);
  display:flex;align-items:center;gap:10px;text-decoration:none;color:#fff;
  opacity:0;transform:translate3d(7px,0,0);pointer-events:none;
  filter:drop-shadow(0 2px 10px rgba(0,0,0,.42));
  transition:opacity .20s ease,transform .30s cubic-bezier(.22,.75,.22,1);
}
.motion-deck-media:hover .motion-metro-portal,.motion-deck-media:focus-within .motion-metro-portal,.motion-metro-portal:focus-visible{
  opacity:.96;transform:translate3d(0,0,0);pointer-events:auto;
}
.motion-metro-badge{
  width:39px;height:39px;border-radius:50%;background:var(--signal);color:#fff;
  display:grid;grid-template-columns:auto auto;place-content:center;align-items:baseline;gap:2px;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.30);
  font-family:var(--mono);line-height:1;text-shadow:none;
}
.motion-metro-line{font-size:8px;font-weight:800;letter-spacing:.01em}
.motion-metro-code{font-size:10px;font-weight:800;letter-spacing:-.03em}
.motion-metro-arrow{
  position:relative;display:block;width:29px;height:29px;
  font:500 22px/29px var(--sans);text-align:center;color:#fff;text-shadow:0 1px 10px rgba(0,0,0,.7);
  transition:transform .24s cubic-bezier(.22,.75,.22,1),opacity .2s ease;
}
.motion-metro-arrow::after{
  content:"";position:absolute;left:2px;right:2px;bottom:-4px;height:1px;background:rgba(255,255,255,.46);
}
.motion-metro-portal:hover .motion-metro-arrow,.motion-metro-portal:focus-visible .motion-metro-arrow{
  transform:translate3d(3px,-3px,0);
}
.motion-metro-portal:hover .motion-metro-badge,.motion-metro-portal:focus-visible .motion-metro-badge{
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.50),0 0 0 1px rgba(240,68,46,.18);
}
@media(max-width:900px){
  .motion-metro-portal{right:15px;bottom:25px;opacity:.88;transform:none;pointer-events:auto;gap:8px}
  .motion-metro-badge{width:36px;height:36px}
  .motion-metro-line{font-size:7px}.motion-metro-code{font-size:9px}
  .motion-metro-arrow{width:25px;height:25px;font-size:19px;line-height:25px}
}
@media(prefers-reduced-motion:reduce){.motion-metro-portal,.motion-metro-arrow{transition:none!important}}


/* HERO TAG TEST — ZEWLEAN as an imperfect authored mark, no rat. */
.hero-copy-refined{
  left:clamp(22px,4.6vw,76px);
  bottom:clamp(72px,10.5vh,118px);
  align-items:flex-end;
  gap:14px;
}
.hero-tag{
  display:inline-block!important;
  position:relative;
  transform:rotate(-1.15deg) skewX(-2.2deg);
  transform-origin:left bottom;
  opacity:.82;
  mix-blend-mode:normal;
}
.hero-tag .hero-wordmark-text{
  display:inline-block!important;
  color:var(--signal)!important;
  font-size:clamp(29.07px,4.1895vw,61.56px)!important;
  font-weight:650!important;
  letter-spacing:-.068em!important;
  line-height:.82!important;
  text-shadow:
    .018em .012em 0 rgba(240,68,46,.26),
    -.012em .018em 0 rgba(240,68,46,.16)!important;
  filter:blur(0.8px) contrast(1.08);
}
.hero-tag .hero-wordmark-text::before{
  content:"ZEWLEAN";
  position:absolute;
  inset:0;
  color:transparent;
  -webkit-text-stroke:.45px rgba(240,68,46,.36);
  transform:translate(.018em,-.012em) scaleX(1.002);
  pointer-events:none;
}
.hero-copy-refined small{
  color:rgba(255,255,255,.58);
  padding-bottom:0;
}
@media(max-width:700px){
  .hero-copy-refined{left:var(--safe-left);right:var(--safe-right);bottom:max(12vh,86px)}
  .hero-tag{transform:rotate(-1.35deg) skewX(-2deg);opacity:.84}
  .hero-tag .hero-wordmark-text{font-size:clamp(33.345px,10.6875vw,53.01px)!important}
}

/* R4 MOBILE FIX — HOME / 04 MOTION keeps the same full-bleed Tokyo overlay language */
@media (max-width:900px){
  .motion-deck-reverse{
    position:relative!important;
    display:block!important;
    min-height:clamp(620px,86svh,820px)!important;
    overflow:hidden!important;
    background:#050505!important;
    border-top:1px solid #272727;
    border-bottom:1px solid #272727;
  }
  .motion-deck-reverse .motion-deck-media{
    position:absolute!important;
    inset:0!important;
    z-index:1!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    background:#050505!important;
    order:initial!important;
  }
  .motion-deck-reverse .motion-deck-media video{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    max-height:none!important;
    object-fit:cover!important;
    background:transparent!important;
  }
  .motion-deck-reverse:after{
    content:"";
    position:absolute;
    z-index:2;
    inset:0;
    pointer-events:none;
    background:
      linear-gradient(0deg,rgba(0,0,0,.70) 0%,rgba(0,0,0,.39) 33%,rgba(0,0,0,.10) 58%,rgba(0,0,0,.04) 100%),
      linear-gradient(90deg,rgba(0,0,0,.19) 0%,transparent 72%);
  }
  .motion-deck-reverse .motion-deck-side{
    position:absolute!important;
    z-index:4!important;
    inset:0!important;
    width:auto!important;
    min-height:0!important;
    padding:78px 18px 28px!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:flex-end!important;
    border:0!important;
    background:transparent!important;
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
    text-shadow:0 1px 16px rgba(0,0,0,.68);
    pointer-events:none;
    order:initial!important;
  }
  .motion-deck-reverse .motion-deck-side a,
  .motion-deck-reverse .motion-deck-side button{pointer-events:auto}
  .motion-deck-side .index{
    display:flex!important;
    align-items:center;
    gap:9px;
    color:rgba(255,255,255,.86);
    font:600 8px/1 var(--mono)!important;
    letter-spacing:.20em!important;
  }
  .motion-deck-side .index:before{
    content:"";
    display:inline-block;
    width:7px!important;
    height:7px!important;
    border:0!important;
    border-radius:50%;
    background:var(--signal)!important;
  }
  .motion-deck-side .index:after{
    content:"MOV / ZEW";
    margin-left:auto;
    color:rgba(255,255,255,.48);
    font:500 6px/1 var(--mono);
    letter-spacing:.18em;
  }
  .motion-deck-side h2{
    margin:16px 0 14px!important;
    color:#f4f1eb!important;
    font-size:clamp(46px,14vw,72px)!important;
    line-height:.79!important;
    letter-spacing:-.065em!important;
  }
  .motion-deck-side>p{
    display:block!important;
    max-width:78vw!important;
    margin:0 0 18px!important;
    color:rgba(255,255,255,.64)!important;
    font:500 7px/1.55 var(--mono)!important;
    letter-spacing:.07em!important;
  }
  .motion-now{
    display:grid!important;
    grid-template-columns:48px 1fr!important;
    align-items:center!important;
    gap:9px!important;
    padding:0 0 10px!important;
    border:0!important;
  }
  .motion-now:before{display:none!important}
  .motion-now [data-motion-count]{
    width:44px!important;
    height:21px!important;
    display:block!important;
    border-radius:0!important;
    background:var(--signal)!important;
    color:#090909!important;
    font:700 8px/21px var(--mono)!important;
    letter-spacing:.07em!important;
    text-align:center!important;
  }
  .motion-now strong{
    color:#fff!important;
    font:600 9px/1 var(--mono)!important;
    letter-spacing:.15em!important;
  }
  .motion-controls{
    display:grid!important;
    grid-template-columns:32px 58px 32px 58px 46px!important;
    gap:3px!important;
    margin:3px 0 10px!important;
    width:max-content!important;
    align-items:center!important;
  }
  .motion-controls button{
    min-width:0!important;
    height:29px!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    background:rgba(0,0,0,.22)!important;
    color:rgba(255,255,255,.90)!important;
    font:600 6.5px/1 var(--mono)!important;
    letter-spacing:.12em!important;
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
  }
  .motion-controls button:first-child,
  .motion-controls button:nth-child(3){font-size:13px!important;color:var(--signal)!important}
  .motion-mini-list{
    display:grid!important;
    grid-template-columns:repeat(var(--motion-count,6),minmax(28px,1fr))!important;
    gap:3px!important;
    width:min(100%,330px)!important;
    max-width:none!important;
    margin:0!important;
    border:0!important;
  }
  .motion-mini-item{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:auto!important;
    height:28px!important;
    padding:0!important;
    border:0!important;
    background:rgba(0,0,0,.22)!important;
    color:rgba(255,255,255,.56)!important;
    text-align:center!important;
  }
  .motion-mini-item b{display:none!important}
  .motion-mini-item span{
    width:auto!important;
    height:auto!important;
    background:none!important;
    color:inherit!important;
    font:600 7px/1 var(--mono)!important;
    letter-spacing:.08em!important;
  }
  .motion-mini-item.active{background:var(--signal)!important;color:#090909!important}
  .motion-mini-item.active span{color:#090909!important}
  .motion-open{
    margin-top:12px!important;
    padding:0!important;
    border:0!important;
    color:rgba(255,255,255,.74)!important;
    font:600 7px/1 var(--mono)!important;
    letter-spacing:.14em!important;
    text-shadow:0 1px 12px #000;
  }
  .motion-open:before{content:"↗  ";color:var(--signal)}
  .motion-deck-reverse .motion-deck-side:after{
    content:"04—06 / MOVING IMAGE UNIT"!important;
    position:static!important;
    display:block!important;
    margin-top:13px!important;
    color:rgba(255,255,255,.43)!important;
    font:600 6px/1 var(--mono)!important;
    letter-spacing:.15em!important;
  }
  .motion-progress{z-index:6!important;background:rgba(255,255,255,.15)!important}
  .motion-center-play{z-index:6!important;background:rgba(0,0,0,.14)!important;border-color:rgba(255,255,255,.72)!important;backdrop-filter:none!important}
  .motion-metro-portal{
    top:78px!important;
    right:16px!important;
    bottom:auto!important;
    z-index:7!important;
  }
  .social-webview .motion-deck-side{background:transparent!important}
  .social-webview .motion-controls button,
  .social-webview .motion-mini-item{background:rgba(0,0,0,.26)!important;color:#fff!important}
  .social-webview .motion-mini-item.active{background:var(--signal)!important;color:#090909!important}
}

@media (max-width:420px){
  .motion-deck-reverse{min-height:clamp(610px,88svh,760px)!important}
  .motion-deck-reverse .motion-deck-side{padding-left:16px!important;padding-right:16px!important;padding-bottom:22px!important}
  .motion-deck-side h2{font-size:13.6vw!important}
  .motion-deck-side>p{max-width:88vw!important}
  .motion-controls{grid-template-columns:30px 54px 30px 54px 44px!important}
  .motion-mini-list{width:100%!important}
}


/* R4 stabilization — mobile motion controls live below the persistent header safe-zone. */
@media(max-width:800px){
  .motion-deck-media .video-direct-fullscreen,
  .cinema-screen .video-direct-fullscreen,
  .motion-world-screen .video-direct-fullscreen{
    top:calc(62px + env(safe-area-inset-top) + 10px)!important;
    right:max(10px,env(safe-area-inset-right))!important;
    z-index:8!important;
  }
  .viewer{min-height:100dvh}
}


/* STABILIZATION 02 — content-count agnostic + viewport-safe stages */
.horizontal-strip .hframe img{max-height:min(70vh,var(--project-stage-max,70vh))!important}
@media(max-width:800px){
  .horizontal-strip .hframe img{max-height:min(68svh,var(--project-stage-max,68svh))!important}
  /* Motion controls share one reserved safe zone; no header/menu collision. */
  .motion-deck-media .video-direct-fullscreen{top:auto!important;right:var(--safe-right)!important;bottom:max(72px,calc(env(safe-area-inset-bottom) + 58px))!important}
  .motion-world-screen .video-direct-fullscreen{top:calc(62px + env(safe-area-inset-top) + 10px)!important;right:var(--safe-right)!important;bottom:auto!important}
  .motion-metro-portal{display:flex!important;opacity:.96!important;transform:none!important;pointer-events:auto!important;right:var(--safe-right)!important;bottom:max(18px,env(safe-area-inset-bottom))!important}
  .motion-deck-media .motion-center-play{z-index:7}
}
@media(max-width:520px){
  .motion-world-route{scrollbar-width:none}.motion-world-route::-webkit-scrollbar{display:none}
}

.contact-form{display:grid;gap:0;margin:0 0 22px;border-top:1px solid #343434}
.contact-form label{display:grid;grid-template-columns:78px 1fr;align-items:start;gap:14px;padding:13px 0;border-bottom:1px solid #343434}
.contact-form label span{font:600 7px/1.3 var(--mono);letter-spacing:.14em;color:#777}
.contact-form input,.contact-form textarea{width:100%;border:0;outline:0;background:transparent;color:#f4f0ea;font:500 13px/1.4 var(--sans);resize:vertical;padding:0}
.contact-form input:focus,.contact-form textarea:focus{color:#fff}.contact-form label:focus-within span{color:var(--signal)}
.contact-form button{justify-self:end;margin-top:12px;border:0;border-bottom:1px solid var(--signal);background:transparent;color:var(--signal);padding:8px 0;font:700 8px/1 var(--mono);letter-spacing:.14em;cursor:pointer}
.contact-form button:disabled{opacity:.45}.contact-form-status{min-height:1em!important;border:0!important;padding:4px 0 0!important;font-size:6px!important;color:#777!important}
@media(max-width:620px){.contact-form label{grid-template-columns:64px 1fr}.contact-form{margin-top:4px}}

/* STABILIZATION 03 — interaction/layout corrections after live-device QA */
/* Selected Frames: focus must never leave the rail's physical image stage. */
.rail .frame,.rail .frame img{transform-origin:center center}
.rail .frame{overflow:visible}
@media(max-width:800px){
  .rail .frame,.rail .frame img{transform:none!important}
  .rail .frame{opacity:1!important}
}

/* Project sequence: compose the opening viewport; mobile is native, still and immediate. */
.hpg-main{min-height:100svh}
@media(max-width:800px){
  .hpg-main{height:100svh;min-height:0;overflow:hidden}
  .hpg-intro{padding:82px 18px 10px;gap:10px;flex:0 0 auto}
  .hpg-intro h1{font-size:clamp(42px,12.5vw,68px);line-height:.82;margin-top:6px}
  .hpg-intro p{font-size:8px;line-height:1.5;max-width:88vw}
  .hpg-controls{padding:0 18px 7px;flex:0 0 auto}
  .horizontal-strip{flex:1 1 auto;min-height:0;padding:0 18px 8px;align-items:center;scroll-snap-type:x mandatory;touch-action:pan-x pan-y}
  .hframe{height:100%!important;max-height:100%!important;background:transparent!important;overflow:visible!important;opacity:1!important;transform:none!important;display:flex;align-items:center;justify-content:center}
  .hframe img{width:auto!important;height:auto!important;max-width:calc(100vw - 36px)!important;max-height:100%!important;object-fit:contain!important;transform:none!important;filter:none!important}
  .hpg-footer{flex:0 0 auto;padding:10px 18px max(12px,env(safe-area-inset-bottom));font-size:7px}
}
@media(max-width:520px){
  .hpg-intro p{display:none}
  .hpg-intro{padding-top:78px}
  .hpg-footer{padding-top:8px}
}

/* Motion mobile: the floating fullscreen glyph is redundant and collided with editorial text.
   FULL remains in the dedicated control row; double-tap remains available on the film. */
@media(max-width:800px){
  .motion-world-screen .video-direct-fullscreen{display:none!important}
  .motion-deck-media .video-direct-fullscreen{display:none!important}
  .motion-world-controls [data-motion-fullscreen],.motion-controls [data-motion-fullscreen]{display:block!important}
  .motion-metro-portal{display:flex!important}
}

/* Contact: unmistakably a message composer, while staying in the ZEWLEAN editorial language. */
.contact-form-intro{border-top:1px solid #343434;padding:14px 0 18px;display:grid;grid-template-columns:86px 1fr;column-gap:14px;row-gap:7px}
.contact-form-intro span{grid-row:1/3;font:600 7px/1.3 var(--mono);letter-spacing:.14em;color:var(--signal)}
.contact-form-intro strong{font:600 18px/1 var(--sans);letter-spacing:-.025em;color:#f4f0ea}
.contact-form-intro p{margin:0!important;max-width:420px;font:500 8px/1.55 var(--mono)!important;letter-spacing:.04em;color:#777!important}
.contact-form{border-top:0!important}
.contact-form label{grid-template-columns:86px 1fr!important;padding:15px 0!important}
.contact-form textarea{min-height:96px}
.contact-form button{margin-top:16px!important;font-size:9px!important;padding:10px 0!important}
@media(max-width:620px){
  .contact-form-intro{grid-template-columns:1fr;gap:8px;padding-top:16px}.contact-form-intro span{grid-row:auto}.contact-form-intro strong{font-size:20px}
  .contact-form label{grid-template-columns:1fr!important;gap:7px!important}.contact-form textarea{min-height:110px}
  .contact-form button{justify-self:start!important}
}
/* Desktop project stage uses the actual remaining viewport too; the frame itself, not only its image, is bounded. */
@media(min-width:801px){
  .hpg-main{height:100svh;min-height:620px;overflow:hidden}
  .hframe{height:min(clamp(300px,58vh,690px),var(--project-stage-max,690px))}
}


/* STABILIZATION 04 — Contact is a closing editorial letter, not a web-form card. */
.contact-letter{background:#f0ede5!important;color:#111!important;padding-top:58px!important}
.contact-letter .contact-v15-top{color:#777!important;border-color:#bdb9b0!important}
.contact-letter .contact-v15-top .index span{color:var(--signal)!important}
.contact-letter-grid{display:grid;grid-template-columns:minmax(0,.82fr) minmax(420px,1.18fr);gap:8vw;align-items:start;padding:clamp(64px,9vw,132px) 0 clamp(82px,10vw,148px)}
.contact-letter-title>span{display:block;margin-bottom:22px;font:700 7px/1 var(--mono);letter-spacing:.18em;color:var(--signal)}
.contact-letter .contact-letter-title h2{margin:0!important;font-size:clamp(76px,11.2vw,180px)!important;line-height:.72!important;letter-spacing:-.085em!important;color:#111!important}
.contact-letter-compose{padding-top:9px}
.contact-letter-form{margin:0!important;border-top:1px solid #111!important}
.contact-letter-form label{display:grid!important;grid-template-columns:92px minmax(0,1fr)!important;gap:20px!important;align-items:start!important;padding:19px 0 18px!important;border-bottom:1px solid #bdb9b0!important}
.contact-letter-form label>span{padding-top:4px;font:700 7px/1.2 var(--mono)!important;letter-spacing:.17em!important;color:#777!important}
.contact-letter-form input,.contact-letter-form textarea{margin:0!important;padding:0!important;border:0!important;outline:0!important;background:transparent!important;color:#111!important;font:500 clamp(15px,1.35vw,21px)/1.35 var(--sans)!important;letter-spacing:-.015em!important;resize:none!important}
.contact-letter-form input::placeholder,.contact-letter-form textarea::placeholder{color:#aaa69e;opacity:1}
.contact-letter-form label:focus-within>span{color:var(--signal)!important}
.contact-letter-form .message-field{padding-bottom:22px!important}
.contact-letter-form textarea{min-height:clamp(126px,18vh,210px)!important}
.contact-letter-send{display:flex;justify-content:space-between;align-items:flex-end;gap:22px;padding-top:20px}
.contact-letter-form .contact-form-status{margin:0!important;min-height:1em!important;padding:0!important;border:0!important;color:#777!important;font:600 7px/1.35 var(--mono)!important;letter-spacing:.09em!important}
.contact-letter-form button{margin:0!important;padding:0 0 7px!important;border:0!important;border-bottom:2px solid var(--signal)!important;background:transparent!important;color:#111!important;font:700 clamp(18px,1.8vw,28px)/1 var(--sans)!important;letter-spacing:-.025em!important;cursor:pointer!important}
.contact-letter-form button b{font-weight:500;color:var(--signal)}
.contact-letter-form button:hover{color:var(--signal)!important}
.contact-letter-alt{display:flex;gap:26px;flex-wrap:wrap;margin-top:58px;padding-top:14px;border-top:1px solid #bdb9b0}
.contact-letter .contact-letter-alt a{display:inline-block!important;padding:0!important;border:0!important;color:#555!important;font:700 7px/1.3 var(--mono)!important;letter-spacing:.13em!important}
.contact-letter .contact-letter-alt a:hover{color:var(--signal)!important}
.contact-letter .contact-v15-foot{border-color:#bdb9b0!important;color:#777!important}
.contact-letter .contact-v15-foot a{color:#555}
@media(max-width:900px){
 .contact-letter-grid{grid-template-columns:1fr;gap:54px;padding:72px 0 90px}
 .contact-letter .contact-letter-title h2{font-size:clamp(72px,17vw,140px)!important}
 .contact-letter-compose{padding-top:0}
}
@media(max-width:620px){
 .contact-letter{padding:48px 18px 22px!important}
 .contact-letter-grid{gap:42px;padding:58px 0 72px}
 .contact-letter-title>span{margin-bottom:17px}
 .contact-letter .contact-letter-title h2{font-size:20vw!important}
 .contact-letter-form label{grid-template-columns:1fr!important;gap:9px!important;padding:15px 0 14px!important}
 .contact-letter-form label>span{padding-top:0}
 .contact-letter-form input,.contact-letter-form textarea{font-size:16px!important}
 .contact-letter-form textarea{min-height:128px!important}
 .contact-letter-send{padding-top:17px;align-items:center}
 .contact-letter-form button{font-size:20px!important}
 .contact-letter-alt{margin-top:46px;gap:16px 22px}
}

/* STABILIZATION 05 — Contact belongs to the existing ZEWLEAN dark closing scene. */
.contact-letter{background:#0a0a0a!important;color:#f4f0ea!important}
.contact-letter .contact-v15-top{color:#858585!important;border-color:#303030!important}
.contact-letter .contact-letter-title h2{color:#f4f0ea!important}
.contact-letter-form{border-top-color:#f4f0ea!important}
.contact-letter-form label{border-bottom-color:#343434!important}
.contact-letter-form label>span{color:#777!important}
.contact-letter-form input,.contact-letter-form textarea{color:#f4f0ea!important}
.contact-letter-form input::placeholder,.contact-letter-form textarea::placeholder{color:#626262!important}
.contact-letter-form .contact-form-status{color:#777!important}
.contact-letter-form button{color:#f4f0ea!important}
.contact-letter-alt{border-top-color:#343434!important}
.contact-letter .contact-letter-alt a{color:#858585!important}
.contact-letter .contact-v15-foot{border-color:#303030!important;color:#666!important}
.contact-letter .contact-v15-foot a{color:#858585!important}


/* BETA 03 — mobile/video hardening ------------------------------------- */
html,body{max-width:100%;overflow-x:clip}
video{max-width:100%}
.motion-deck-media,.cinema-screen{position:relative}
.motion-deck-media:fullscreen,.cinema-screen:fullscreen,
.motion-deck-media:-webkit-full-screen,.cinema-screen:-webkit-full-screen{
  width:100vw;height:100vh;background:#050505;display:flex;align-items:center;justify-content:center
}
.motion-deck-media:fullscreen video,.cinema-screen:fullscreen video,
.motion-deck-media:-webkit-full-screen video,.cinema-screen:-webkit-full-screen video{
  width:100%;height:100%;max-height:100vh;object-fit:contain
}
.video-direct-fullscreen{touch-action:manipulation}
@supports(height:100dvh){
  @media(max-width:800px){
    .hero{height:100dvh}
    .topbar .nav{min-height:calc(100dvh - 62px)}
    .cinema-player-side .cinema-screen{min-height:42dvh}
  }
}
@media(max-width:800px){
  body.menu-open{position:fixed;width:100%;inset:0;overflow:hidden}
  .motion-deck-media,.cinema-screen{isolation:isolate}
  .motion-deck-media video,.cinema-screen video{width:100%;height:auto;max-height:72svh}
  .video-direct-fullscreen{min-width:44px;min-height:44px}
}