/* AMR RABIE — PROTOTYPE 02 | editorial cinema / autumn 2026 */
:root{--forest:#092f26;--deep:#061d19;--mid:#174b3b;--acid:#f3c426;--paper:#f1f0e9;--paper2:#e5e7de;--ink:#172c25;--text:#f5f3e9;--muted:#a6b6a9;--rule:#c9cec2;--sans:'Helvetica Neue',Helvetica,Arial,sans-serif;--serif:'Iowan Old Style','Baskerville','Times New Roman',Georgia,serif}
*,*::before,*::after{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-width:320px;background:var(--paper);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}img{display:block;max-width:100%}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid var(--acid);outline-offset:4px}::selection{background:var(--acid);color:var(--deep)}.container{width:min(calc(100% - 9.2vw),1440px);margin-inline:auto}.caps,.index,.nav-link,.pill,.micro{font-size:10px;letter-spacing:.17em;text-transform:uppercase;font-weight:700}.arrow{height:1em;width:1em;display:inline-block;vertical-align:-.12em;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.6}.arrow-sm{width:18px;height:18px}.arrow-lg{width:33px;height:33px}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.reveal{opacity:0;transform:translateY(22px);transition:opacity .85s ease,transform .85s cubic-bezier(.21,.66,.31,1)}.reveal.visible{opacity:1;transform:none}
/* Header */
.header{height:90px;padding-inline:4.6vw;position:absolute;top:0;left:0;right:0;z-index:30;display:flex;align-items:center;justify-content:space-between;gap:24px;color:var(--text);border-bottom:1px solid #ffffff29}.brand{display:flex;align-items:center;gap:14px;position:relative;z-index:35}.brand img{width:63px;height:52px;object-fit:contain}.brand-title{font-size:12px;line-height:1.3;letter-spacing:.19em;font-weight:800}.brand-title small{display:block;color:#b2c4b7;font-size:9px;letter-spacing:.13em;margin-top:3px;font-weight:500}.main-nav{display:flex;gap:37px;align-items:center}.nav-link{display:inline-flex;gap:8px;align-items:center;transition:color .25s}.nav-link:hover{color:var(--acid)}.nav-no{font-weight:500;font-size:8px;color:var(--acid)}.nav-contact{border-bottom:1px solid var(--acid);padding-bottom:7px}.nav-contact .arrow{color:var(--acid)}.menu{display:none;position:relative;z-index:38;width:44px;height:44px;align-items:center;justify-content:center;flex-direction:column;gap:6px;border:1px solid #ffffff63;background:#082a22;color:white}.menu span{height:1.5px;width:20px;background:currentColor;transition:transform .25s}.menu[aria-expanded=true] span:first-child{transform:translateY(3.7px) rotate(45deg)}.menu[aria-expanded=true] span:last-child{transform:translateY(-3.7px) rotate(-45deg)}.mobile-menu{position:fixed;inset:0;background:var(--forest);z-index:32;padding:128px 6vw 8vh;display:flex;flex-direction:column;gap:0}.mobile-menu[hidden]{display:none}.mobile-menu a{font-size:clamp(37px,9vw,65px);line-height:1.3;font-weight:850;letter-spacing:-.06em;padding:14px 0;border-bottom:1px solid #ffffff24}.mobile-menu a span{font-family:var(--serif);font-style:italic;color:var(--acid)}.mobile-menu p{font-size:10px;letter-spacing:.18em;color:var(--muted);margin-top:auto}.menu-open{overflow:hidden}
/* Homepage hero - carefully controlled contrast */
.hero{height:max(730px,100svh);max-height:1100px;background:var(--deep);color:var(--text);position:relative;overflow:hidden;isolation:isolate}.hero:before{content:'';position:absolute;inset:0;z-index:0;background:radial-gradient(circle at 19% 51%,#14523b99,transparent 47%),linear-gradient(100deg,#031c17,#082d24 62%,#0d291f)}.hero::after{content:'';position:absolute;z-index:3;left:0;right:0;bottom:0;height:130px;background:linear-gradient(transparent,#041c1688);pointer-events:none}.hero-layout{height:100%;padding-top:140px;padding-bottom:36px;display:grid;grid-template-columns:52% 48%;gap:0;position:relative;z-index:2}.hero-left{display:flex;flex-direction:column;justify-content:space-between;min-width:0}.eyebrow{display:flex;gap:15px;align-items:center;color:var(--acid);font-size:10px;letter-spacing:.19em;line-height:1.8;font-weight:700}.eyebrow:before{content:'';width:34px;height:1px;background:var(--acid)}.hero-main{padding-bottom:55px;position:relative;z-index:3}.hero-kicker{margin:0 0 16px;color:#bbcfc0;letter-spacing:.2em;font-size:11px}.hero h1{font-size:clamp(99px,11.65vw,184px);line-height:.76;letter-spacing:-.105em;font-weight:800;margin:0;white-space:nowrap}.hero h1 span{display:block}.hero h1 span:nth-child(2){padding-left:.1em}.hero h1 .period{color:var(--acid);display:inline}.hero-signature{margin:27px 0 0;font-family:var(--serif);font-style:italic;font-size:clamp(24px,2.7vw,42px);line-height:1.2;color:var(--text);letter-spacing:-.035em}.hero-link-row{display:flex;align-items:center;gap:21px;margin-top:45px}.circle-link{border:1px solid #e9ece0aa;border-radius:50%;display:grid;place-items:center;width:66px;height:66px;color:var(--text);transition:background .3s,color .3s,transform .3s}.circle-link:hover{background:var(--acid);color:var(--deep);transform:rotate(45deg)}.circle-link .arrow{width:23px;height:23px}.circle-caption{font-size:10px;letter-spacing:.2em;font-weight:700}.hero-bottomline{display:flex;justify-content:space-between;align-items:center;gap:15px;color:#afc2b6;font-size:9px;letter-spacing:.16em;position:relative;z-index:4}.hero-frame{position:relative;margin:0 0 0 4%;align-self:stretch;min-height:0}.hero-photo{position:absolute;inset:1% 0 10% 0;overflow:hidden;background:#0f312b;transform:rotate(0deg);box-shadow:0 30px 70px #0004}.hero-photo img{width:100%;height:100%;object-fit:cover;object-position:47% 40%;filter:saturate(.85) contrast(1.1);transition:transform 1.2s cubic-bezier(.2,.65,.3,1)}.hero-photo:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#071a1640,transparent 40%,#061b19dc),linear-gradient(90deg,#07241d80,transparent 26%)}.hero:hover .hero-photo img{transform:scale(1.035)}.frame-stamp{position:absolute;left:25px;bottom:22px;z-index:2;display:flex;flex-direction:column;gap:8px;color:white}.frame-stamp strong{font-size:24px;line-height:1.05;letter-spacing:-.055em;font-weight:750}.frame-stamp small{font-size:9px;letter-spacing:.17em;color:#e7e6d6}.frame-badge{position:absolute;right:23px;top:22px;color:var(--acid);font-size:10px;letter-spacing:.15em;font-weight:750;z-index:2}.hero-vertical{position:absolute;right:12px;top:40%;z-index:5;color:#c8d6cd;font-size:8px;writing-mode:vertical-rl;letter-spacing:.25em}.hero-progress{position:absolute;z-index:2;bottom:3%;left:0;right:0;height:1px;background:#ffffff50}.hero-progress:after{content:'';display:block;background:var(--acid);width:22%;height:2px;position:relative;top:-1px}.hero-word{position:absolute;right:-8vw;bottom:-4vw;font-family:var(--serif);font-style:italic;font-size:clamp(220px,34vw,590px);opacity:.06;letter-spacing:-.14em;color:#fff;pointer-events:none}
/* Intro micro-manifesto */
.thesis{background:var(--paper);padding:80px 0 87px;border-bottom:1px solid #bfc6bc}.thesis-row{display:grid;grid-template-columns:25% 1fr;align-items:start;gap:35px}.section-tag{font-size:10px;letter-spacing:.17em;font-weight:750;display:flex;align-items:center;gap:10px}.section-tag b{font-family:var(--serif);font-weight:400;font-size:17px;letter-spacing:0}.thesis h2{margin:-14px 0 0;font-size:clamp(42px,5.8vw,92px);line-height:1.08;letter-spacing:-.07em;font-weight:740;max-width:980px}.thesis h2 em,.section-title em,.about-title em,.callout h2 em,.story-title em,.case-main-title em{font-family:var(--serif);font-weight:400}.thesis h2 em{color:#557a62}
/* Projects */
.work{background:var(--paper);padding:100px 0 120px}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:50px}.section-title{font-size:clamp(59px,8.5vw,132px);letter-spacing:-.087em;line-height:.89;font-weight:780;margin:24px 0 0}.section-intro{max-width:275px;font-family:var(--serif);font-size:20px;line-height:1.38;color:#596b5e;font-style:italic;margin:0 6px 4px}.projects{display:grid;grid-template-columns:1.3fr 1fr;column-gap:28px;row-gap:58px}.project{min-width:0}.project a{display:block}.project-img{position:relative;overflow:hidden;background:var(--forest)}.project.featured .project-img{aspect-ratio:1.13}.project:not(.featured) .project-img{aspect-ratio:1.7}.project img{height:100%;width:100%;object-fit:cover;filter:saturate(.82) contrast(1.07);transition:transform .85s cubic-bezier(.2,.65,.3,1),filter .85s}.project a:hover img{transform:scale(1.045);filter:saturate(1.08)}.project-img:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#001b15b1,transparent 43%);pointer-events:none}.project-img .work-no{position:absolute;z-index:2;top:19px;left:21px;background:var(--paper);padding:9px 11px;font-size:9px;letter-spacing:.17em;font-weight:750;color:var(--forest)}.project-img .project-action{position:absolute;z-index:3;right:18px;bottom:18px;background:var(--acid);color:var(--deep);width:49px;height:49px;display:grid;place-items:center;transition:transform .3s}.project a:hover .project-action{transform:translate(2px,-2px)}.project-meta{display:flex;align-items:start;justify-content:space-between;gap:10px;padding-top:17px}.project-meta h3{margin:5px 0 0;font-size:clamp(27px,2.7vw,46px);line-height:1.02;letter-spacing:-.06em;font-weight:760}.project-meta h3 em{font-family:var(--serif);font-weight:400}.project-meta .micro{font-size:9px;color:#5c7261}.project.featured{grid-row:span 2}.project.featured .project-img{min-height:560px}.project-archive .project-img{background:#203d33}.project-archive .project-img:after{background:linear-gradient(0deg,#001b1577,transparent 45%)}.project-archive .project-action{background:var(--paper2)}.archive-note{display:flex;gap:20px;align-items:center;margin:54px 0 0;font-size:11px;line-height:1.65;color:#6a7b6c}.archive-note:before{content:'';width:46px;height:1px;background:var(--forest);flex:none}
/* About dark/editorial */
.about{background:var(--forest);color:var(--text);padding:135px 0 155px;position:relative;overflow:hidden}.about:before{content:'AR';position:absolute;font-family:var(--serif);font-style:italic;top:8%;right:-2%;font-size:clamp(250px,42vw,700px);line-height:1;letter-spacing:-.14em;color:#ffffff06;pointer-events:none}.about-inner{display:grid;grid-template-columns:27% 1fr;gap:5%;position:relative;z-index:1}.about .section-tag{color:var(--acid)}.about-title{font-size:clamp(55px,6.5vw,109px);line-height:.98;letter-spacing:-.072em;margin:-13px 0 46px;font-weight:760}.about-title em{color:var(--acid)}.about-detail{border-top:1px solid #ffffff55;display:grid;grid-template-columns:1fr 1fr;gap:40px;padding-top:27px}.about-detail p{font-family:var(--serif);font-size:clamp(19px,2vw,27px);line-height:1.48;margin:0;color:#d4e0d6}.about-detail aside{display:flex;flex-direction:column;align-items:flex-start;gap:26px;font-size:10px;line-height:1.8;letter-spacing:.12em;color:#b2c8b5}.inline-link{display:inline-flex;align-items:center;gap:22px;border-bottom:1px solid var(--acid);padding-bottom:10px;font-size:10px;letter-spacing:.13em;font-weight:750;color:var(--acid)}.inline-link:hover .arrow{transform:translate(2px,-2px)}.inline-link .arrow{transition:transform .2s}
/* Contact yellow ending */
.callout{background:var(--acid);padding:100px 0 105px}.callout h2{font-size:clamp(64px,11vw,169px);line-height:.86;letter-spacing:-.085em;margin:35px 0 43px;font-weight:800}.callout-bottom{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;padding-top:20px;border-top:1px solid #142c24aa}.callout-bottom p{font-family:var(--serif);font-style:italic;font-size:clamp(20px,2vw,28px);margin:0}.callout-bottom a{font-size:11px;font-weight:750;letter-spacing:.12em;display:inline-flex;align-items:center;gap:18px}.callout-bottom a:hover{text-decoration:underline}.callout small{display:block;font-size:10px;opacity:.65;margin-top:36px}.footer{background:var(--deep);color:#d7e1d7;padding:25px 0}.footer-inner{display:flex;gap:20px;justify-content:space-between;align-items:center;font-size:9px;letter-spacing:.17em;font-weight:750}.footer a:hover{color:var(--acid)}
/* Case study */
.case-hero{position:relative;isolation:isolate;background:var(--deep);min-height:760px;height:min(960px,100svh);color:#fff;overflow:hidden}.case-hero-bg{position:absolute;inset:0;z-index:-1}.case-hero-bg img{height:100%;width:100%;object-fit:cover;object-position:center 45%;filter:saturate(.8) contrast(1.13)}.case-hero-bg:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#071e19,transparent 70%),linear-gradient(90deg,#041c19de 0%,#041c198a 51%,#041c1933),linear-gradient(180deg,#071c185b,transparent 30%)}.case-wrap{height:100%;padding-top:145px;padding-bottom:29px;display:flex;flex-direction:column;justify-content:space-between}.case-back{display:inline-flex;align-items:center;gap:13px;font-size:10px;letter-spacing:.16em;font-weight:750;width:fit-content}.case-back:hover{color:var(--acid)}.case-main-title{font-size:clamp(88px,11vw,177px);line-height:.82;letter-spacing:-.08em;font-weight:780;margin:27px 0 26px}.case-main-title em{color:var(--acid)}.case-sub{font-family:var(--serif);font-style:italic;font-size:clamp(24px,3vw,42px);margin:0}.case-foot{border-top:1px solid #ffffff6a;padding-top:22px;display:flex;justify-content:space-between;gap:15px;letter-spacing:.15em;font-size:10px;color:#e2e8dd}.story{padding:115px 0;background:var(--paper)}.story-grid{display:grid;grid-template-columns:45% 55%;gap:0}.story-title{font-size:clamp(53px,6vw,93px);line-height:.9;letter-spacing:-.075em;font-weight:760;margin:28px 0 0}.story-right{padding-left:13%;border-left:1px solid #bcc4b7}.role-row{display:flex;gap:24px;justify-content:space-between;font-size:10px;letter-spacing:.15em;padding-bottom:22px;border-bottom:1px solid #bcc4b7}.role-row b{font-weight:780}.story-right p{font-family:var(--serif);font-size:clamp(21px,2.2vw,31px);line-height:1.47;color:#3d5144;margin:38px 0 0}.watch{padding:95px 0 125px;background:#e0e6da}.watch-head{display:flex;justify-content:space-between;align-items:center;padding-bottom:22px;gap:20px}.watch-poster{width:100%;height:min(62vw,660px);min-height:380px;position:relative;background:#061c19;overflow:hidden}.watch-poster img{width:100%;height:100%;object-fit:cover;filter:saturate(.95) brightness(.7)}.watch-poster:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#031711b0,transparent 50%);pointer-events:none}.watch-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:2;flex-direction:column;gap:24px;color:white}.watch-button{width:95px;height:95px;border:1px solid white;background:#092b22d9;color:#fff;display:grid;place-items:center;border-radius:50%;transition:background .3s,transform .3s}.watch-button:hover{background:var(--acid);color:var(--deep);transform:scale(1.08)}.watch-button .arrow{width:26px;height:26px;fill:currentColor;stroke:currentColor}.watch-title{font-family:var(--serif);font-size:clamp(31px,5vw,67px);letter-spacing:-.055em;text-align:center}.watch-caption{text-align:center;display:block;margin-top:18px;font-size:10px;letter-spacing:.14em;color:#697667}.video-note{color:white;text-align:center;background:#173e2f;padding:16px 25px;font-size:12px;line-height:1.5;position:absolute;bottom:22px;max-width:min(90%,440px)}.video-note[hidden]{display:none}
.approach{background:var(--forest);color:var(--text);padding:130px 0}.approach-grid{display:grid;grid-template-columns:31% 1fr;gap:35px}.approach-grid .section-tag{color:var(--acid)}.approach h2{font-size:clamp(63px,8vw,124px);line-height:.93;letter-spacing:-.078em;font-weight:760;margin:-10px 0 44px}.approach h2 em{color:var(--acid);font-family:var(--serif);font-weight:400}.approach p{font-family:var(--serif);font-size:clamp(22px,2.4vw,33px);line-height:1.5;max-width:840px;color:#d1dfd2;margin:0}.approach-stamps{font-size:10px;letter-spacing:.16em;margin-top:70px;color:#a6bfb0}.gallery{padding:110px 0 145px}.gallery-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px;margin-top:49px}.gallery-grid .shot{margin:0;aspect-ratio:1.23;background:#133d31;overflow:hidden}.gallery-grid .shot:nth-child(1){grid-column:span 2;aspect-ratio:2.4}.gallery-grid .shot:nth-child(4){grid-column:span 2;aspect-ratio:2.4}.gallery-grid img{width:100%;height:100%;object-fit:cover;filter:saturate(.92);transition:transform .7s}.gallery-grid .shot:hover img{transform:scale(1.05)}.gallery-note{font-size:11px;color:#748177;margin:19px 0 0;line-height:1.5}.return-work{background:var(--acid);padding:83px 0}.return-work a{display:flex;align-items:end;justify-content:space-between;gap:15px;font-size:clamp(54px,8vw,123px);font-weight:780;letter-spacing:-.073em;line-height:1;border-bottom:1px solid var(--deep);padding-bottom:24px;margin-top:35px}.return-work a:hover .arrow{transform:translate(5px,-5px)}.return-work a .arrow{transition:transform .2s}
/* An editorial transition, no excessive scroll tricks */
.site-enter{animation:site-appear .58s ease both}@keyframes site-appear{from{opacity:.6;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}.leaving{animation:site-leave .22s ease both}@keyframes site-leave{to{opacity:.65;filter:brightness(.85)}}
@media(max-width:1050px){.hero h1{font-size:clamp(88px,11.7vw,130px)}.hero-frame{margin-left:0}.about-detail{grid-template-columns:1fr}.project.featured .project-img{min-height:490px}}
@media(max-width:720px){.container{width:calc(100% - 40px)}.header{height:76px;padding-inline:20px}.brand img{width:51px;height:44px}.brand-title{font-size:10px}.brand-title small{font-size:7px}.main-nav{display:none}.menu{display:flex}.hero{height:auto;min-height:810px;max-height:none}.hero-layout{padding-top:110px;padding-bottom:22px;display:flex;flex-direction:column;height:auto;min-height:810px}.hero-left{display:contents}.eyebrow{font-size:9px;order:0;line-height:1.6}.hero-main{padding-top:54px;padding-bottom:0;order:1}.hero-kicker{font-size:9px}.hero h1{font-size:clamp(74px,19vw,132px);letter-spacing:-.095em}.hero-signature{font-size:26px;margin-top:17px}.hero-link-row{margin-top:24px}.circle-link{width:50px;height:50px}.circle-caption{font-size:9px}.hero-frame{order:2;height:285px;margin-top:25px}.hero-photo{inset:0 0 17px 0}.hero-bottomline{order:3;font-size:8px}.hero-bottomline span:nth-child(2){display:none}.hero-vertical{display:none}.hero-word{font-size:260px;bottom:20%}.frame-stamp strong{font-size:18px}.frame-stamp small,.frame-badge{font-size:8px}.frame-stamp{left:17px;bottom:15px}.thesis{padding:72px 0}.thesis-row{display:block}.thesis h2{font-size:clamp(38px,10.5vw,72px);margin:28px 0 0}.work{padding:80px 0 95px}.section-heading{display:block;margin-bottom:32px}.section-title{font-size:clamp(61px,13vw,95px);margin-top:25px}.section-intro{font-size:17px;margin:18px 0 0}.projects{display:block}.project{margin:0 0 36px}.project.featured .project-img{min-height:0;aspect-ratio:1.22}.project:not(.featured) .project-img{aspect-ratio:1.4}.project-meta h3{font-size:31px}.project-meta .micro{font-size:8px}.archive-note{font-size:10px;align-items:start}.archive-note:before{width:22px;margin-top:8px}.about{padding:95px 0 103px}.about-inner{display:block}.about-title{font-size:clamp(46px,12vw,74px);margin:35px 0}.about-detail{padding-top:24px;gap:24px}.about-detail p{font-size:21px}.about-detail aside{gap:24px}.callout{padding:77px 0}.callout h2{font-size:clamp(65px,14vw,108px)}.callout-bottom{display:block}.callout-bottom p{margin:0 0 28px}.footer-inner{font-size:8px;flex-wrap:wrap}.footer-inner span:nth-child(2){display:none}.case-hero{height:780px;min-height:740px}.case-wrap{padding-top:122px}.case-main-title{font-size:clamp(63px,14.5vw,103px)}.case-sub{font-size:24px}.case-foot{font-size:8px}.story{padding:77px 0}.story-grid{display:block}.story-title{font-size:clamp(52px,11.5vw,80px);margin:29px 0 43px}.story-right{padding-left:0;border-left:0}.story-right p{font-size:22px;margin-top:28px}.watch{padding:67px 0 77px}.watch-head{font-size:9px}.watch-poster{min-height:340px;height:380px}.watch-button{height:75px;width:75px}.watch-title{font-size:31px}.watch-caption{font-size:9px;line-height:1.5}.approach{padding:93px 0 105px}.approach-grid{display:block}.approach h2{font-size:clamp(61px,13vw,89px);margin:31px 0 30px}.approach p{font-size:23px}.approach-stamps{font-size:9px;line-height:2;margin-top:38px}.gallery{padding:80px 0 95px}.gallery-grid{grid-template-columns:1fr 1fr;gap:7px;margin-top:30px}.gallery-grid .shot{grid-column:auto!important;aspect-ratio:1.05!important}.gallery-grid .shot:nth-child(1){grid-column:span 2!important;aspect-ratio:1.5!important}.return-work{padding:61px 0}.return-work a{font-size:clamp(45px,11vw,74px)}}
@media(max-width:375px){.hero h1{font-size:72px}.hero{min-height:780px}.hero-layout{min-height:780px}.hero-frame{height:263px}.brand-title small{display:none}.case-main-title{font-size:61px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none}*,*::before,*::after{transition:none!important;animation:none!important}}


/* PROTOTYPE 03 — motion layer on top of Prototype 02. Structure, typography and palette retained. */
html{background:var(--deep)}body{background:var(--paper)}.site-enter{animation:none}
.hero-video{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;filter:saturate(.89) contrast(1.05);transform:scale(1.02);transition:transform 1.4s cubic-bezier(.2,.65,.3,1),filter .4s}
.hero:hover .hero-video{transform:scale(1.055)}.hero-photo:after{background:linear-gradient(180deg,#061a1655,transparent 40%,#061b19de),linear-gradient(90deg,#07241d4d,transparent 34%);pointer-events:none}
.hero-frame{will-change:transform}.hero-main{will-change:transform}.hero-word{will-change:transform}.hero-frame .frame-stamp{bottom:50px}.hero-progress{bottom:3%;height:2px;background:#ffffff47}.hero-progress:after{display:none}.hero-progress>span{display:block;height:2px;background:var(--acid);width:0;will-change:width}.video-toggle{position:absolute;z-index:6;left:16px;bottom:6.5%;display:flex;align-items:center;gap:8px;color:var(--text);background:#072a23e7;border:1px solid #ffffff6b;padding:8px 10px;font-weight:800;font-size:8px;letter-spacing:.12em}.video-toggle svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}.video-toggle .play-icon{display:none}.video-toggle[aria-pressed=true] .pause-icon{display:none}.video-toggle[aria-pressed=true] .play-icon{display:block}.hero-film-link{position:absolute;z-index:7;right:10px;bottom:6.5%;font-size:9px;letter-spacing:.14em;display:flex;align-items:center;gap:7px;color:var(--text);padding:9px 10px;border:1px solid #ffffff6b;background:#072a23e7;font-weight:800;transition:background .2s,color .2s}.hero-film-link:hover{background:var(--acid);color:var(--deep)}.hero-film-link .arrow{width:14px;height:14px}.frame-badge{background:#05251eb8;padding:7px 9px}
.motion-rail{height:66px;background:#143e30;color:var(--text);overflow:hidden;display:flex;align-items:center;white-space:nowrap;border-top:1px solid #ffffff1e;border-bottom:1px solid #ffffff1e}.motion-rail-track{font-family:var(--serif);font-style:italic;font-size:clamp(24px,3vw,43px);letter-spacing:-.04em;word-spacing:.2em;display:block;flex:none;width:max-content;animation:railflow 45s linear infinite}.motion-rail i{font-family:var(--sans);font-style:normal;font-size:.7em;color:var(--acid);padding:0 25px}@keyframes railflow{to{transform:translateX(-50%)}}
.thesis h2{will-change:transform}.project .project-img{isolation:isolate}.project a:hover .project-img{box-shadow:0 18px 48px #093f2d18}
.watch-player{width:100%;aspect-ratio:16 / 9;overflow:hidden;background:#061d19;position:relative}.watch-player video{width:100%;height:100%;object-fit:contain;display:block;background:#061d19}.film-subtitle{display:flex;justify-content:space-between;gap:15px;margin-top:16px;font-weight:800;letter-spacing:.16em;font-size:9px;color:#3c5543}.watch-caption{max-width:780px;margin:20px auto 0;line-height:1.65;letter-spacing:.06em}
.page-wipe{position:fixed;inset:0;z-index:200;pointer-events:none;display:grid;place-items:center;background:var(--forest);transform:translateY(100%);will-change:transform}.page-wipe .wipe-mark{opacity:0;transform:scale(.85);transition:opacity .22s ease .10s,transform .24s ease .10s}.page-wipe img{width:110px;height:85px;object-fit:contain}.page-wipe.active{transform:translateY(0);transition:transform .43s cubic-bezier(.76,0,.24,1);pointer-events:auto}.page-wipe.active .wipe-mark{opacity:1;transform:scale(1)}.page-wipe.out{transform:translateY(-100%);transition:transform .48s cubic-bezier(.76,0,.24,1)}.page-wipe.out .wipe-mark{opacity:0}
.hero-vertical,.hero-bottomline{transition:opacity .3s}
@media(max-width:720px){.hero-frame{min-height:285px}.hero-photo:after{background:linear-gradient(180deg,#061a1647,transparent 43%,#061b19e0)}.frame-stamp{bottom:51px!important}.video-toggle{left:10px;bottom:9%;font-size:7px;padding:7px 8px}.hero-film-link{right:10px;bottom:9%;font-size:7px;padding:8px}.motion-rail{height:51px}.motion-rail i{padding:0 16px}.film-subtitle{font-size:8px;line-height:1.6;flex-direction:column;gap:4px}.watch-player{aspect-ratio:16/9}.watch-caption{font-size:10px}}
@media(prefers-reduced-motion:reduce){.motion-rail-track{animation:none}.hero-frame,.hero-main,.hero-word,.thesis h2{transform:none!important}.page-wipe,.page-wipe.active,.page-wipe.out{transition:none!important}.hero-video{transition:none!important}}

/* Touch comfort and clear separation of captions */
@media(max-width:720px){.hero-frame .frame-stamp{bottom:84px!important}.video-toggle,.hero-film-link{min-height:40px}}


/* PROTOTYPE 04 — cinematographic responsive frame and scroll/cursor interactions. */
:root{--scene-p:0;--scene-reveal:0%;--scene-expand:0.82}
/* Keep P02 typography and layout; only change media framing. */
@media(min-width:721px){
 .hero-frame{height:clamp(345px,35vw,490px);width:95%;margin-left:5%;align-self:center}
 .hero-photo{inset:0 0 42px 0}
 .hero-progress{bottom:36px}
 .video-toggle,.hero-film-link{bottom:0}
 .hero-frame .frame-stamp{bottom:25px}
}
@media(max-width:720px){
 .hero-frame{width:100%;height:clamp(278px,73vw,335px);margin-top:24px}
 .hero-photo{inset:0 0 49px 0}
 .hero-progress{bottom:43px}
 .video-toggle,.hero-film-link{bottom:0}
 .hero-frame .frame-stamp{bottom:18px!important}
 .frame-stamp strong{font-size:18px}
}
@media(max-width:375px){.hero-frame{height:272px}}
/* Never apply an emoji font to arrows: keep existing SVG paths. */
.brand-mark{display:grid;place-items:center;position:relative;isolation:isolate;width:63px;height:54px}
.brand-mark::after{content:'';position:absolute;bottom:-5px;left:18%;width:64%;height:1px;background:var(--acid);transform:scaleX(0);transform-origin:center;transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.brand-mark img{max-width:100%;transition:transform .32s ease,filter .32s ease;transform:perspective(360px) rotateY(var(--logo-y,0deg)) rotateX(var(--logo-x,0deg)) scale(var(--logo-scale,1));will-change:transform}
.brand:hover .brand-mark img,.brand:focus-visible .brand-mark img{filter:drop-shadow(0 0 10px #f3c42672);--logo-scale:1.06}
.brand:hover .brand-mark::after,.brand:focus-visible .brand-mark::after{transform:scaleX(1)}
.brand{outline-offset:6px}
@media(max-width:720px){.brand-mark{height:45px;width:51px}}
/* Reactive video frame moves only a few px, separate from scroll-based outer frame transform. */
@media(hover:hover) and (pointer:fine){
 .hero-frame .hero-photo{transform:translate3d(var(--film-x,0px),var(--film-y,0px),0);transition:transform .23s ease-out,box-shadow .4s ease}
 .hero-frame:hover .hero-photo{box-shadow:0 32px 85px #0008}
 .hero-frame .hero-video{transform:scale(1.04) translate3d(calc(var(--film-x,0px) * -.25),calc(var(--film-y,0px) * -.25),0)}
 .hero-frame:hover .hero-video{transform:scale(1.085) translate3d(calc(var(--film-x,0px) * -.25),calc(var(--film-y,0px) * -.25),0)}
 .project.featured .project-img{cursor:crosshair}
 .project.featured .project-img .project-alt{display:block;position:absolute;inset:0;z-index:1;object-fit:cover;object-position:center;width:100%;height:100%;opacity:0;transform:scale(1.02);filter:saturate(1.04);clip-path:circle(120px at var(--spot-x,50%) var(--spot-y,50%));-webkit-clip-path:circle(120px at var(--spot-x,50%) var(--spot-y,50%));transition:opacity .25s ease}
 .project.featured a:hover .project-alt{opacity:1}
 .project.featured .cursor-spot{display:block;position:absolute;left:var(--spot-x,50%);top:var(--spot-y,50%);z-index:5;transform:translate(-50%,calc(-50% + 97px));pointer-events:none;color:#fff;text-shadow:0 1px 3px #000;font-size:9px;letter-spacing:.12em;font-weight:750;white-space:nowrap;opacity:0;transition:opacity .2s}
 .project.featured a:hover .cursor-spot{opacity:1}
}
.project.featured .project-alt,.cursor-spot{display:none}
/* This becomes a scroll-directed transition between the thesis and work. */
.scroll-cinema{height:185svh;min-height:1100px;position:relative;background:var(--deep);color:var(--text)}
.scroll-cinema-sticky{height:100svh;min-height:620px;position:sticky;top:0;display:flex;flex-direction:column;justify-content:center;overflow:hidden;isolation:isolate}
.scroll-cinema-sticky::before{content:'';position:absolute;inset:0;background:var(--paper);opacity:calc(var(--scene-p)*.98);z-index:-1;pointer-events:none}
.scroll-scene-top,.scroll-scene-foot{position:relative;z-index:4;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:0 max(5vw,24px);font-size:10px;letter-spacing:.18em;font-weight:750;mix-blend-mode:difference;color:white}
.scroll-scene-top{margin-top:auto;padding-bottom:25px}
.scroll-scene-top b{color:var(--acid)}
.scroll-scene-top .arrow{width:15px;height:15px;vertical-align:middle}
.scroll-cinema-picture{position:relative;z-index:1;width:min(88vw,1120px);height:clamp(320px,55vh,600px);align-self:center;overflow:hidden;transform:translate3d(0,calc((.5 - var(--scene-p)) * 20px),0) scale(var(--scene-expand));transform-origin:50% 50%;box-shadow:0 28px 90px #0005;will-change:transform}
.scroll-cinema-picture>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;filter:saturate(.87) contrast(1.04)}
.scroll-image-b{clip-path:inset(0 calc(100% - var(--scene-reveal)) 0 0);-webkit-clip-path:inset(0 calc(100% - var(--scene-reveal)) 0 0)}
.scroll-image-shade{position:absolute;inset:0;background:linear-gradient(0deg,#001c17ae,transparent 56%),linear-gradient(90deg,#081b1655,transparent 50%);pointer-events:none}
.scroll-frame-index{position:absolute;left:24px;top:22px;color:white;font-size:9px;letter-spacing:.19em;font-weight:700}
.scroll-cinema-copy{position:absolute;z-index:5;left:7vw;right:7vw;top:48%;transform:translate3d(0,calc(45px - var(--scene-p)*95px),0);pointer-events:none;text-align:center;color:white;text-shadow:0 3px 35px #0009}
.scroll-cinema-copy h2{font-weight:790;line-height:.86;letter-spacing:-.09em;font-size:clamp(68px,9.2vw,160px);margin:14px 0 9px;white-space:nowrap}
.scroll-cinema-copy h2 em{font-family:var(--serif);font-weight:400}
.scroll-caption-one,.scroll-caption-two{font-size:10px;letter-spacing:.22em;font-weight:750;display:block}
.scroll-caption-one{opacity:calc(1 - var(--scene-p)*2.2)}
.scroll-caption-two{opacity:clamp(0,calc((var(--scene-p) - .48)*3),1)}
.scroll-scene-foot{padding-top:25px;margin-bottom:auto}
.scroll-scene-bar{width:18vw;max-width:220px;height:2px;background:#ffffff55}
.scroll-scene-bar i{display:block;height:100%;width:calc(var(--scene-p)*100%);background:var(--acid)}
@media(max-width:720px){
 .scroll-cinema{height:130svh;min-height:800px}
 .scroll-cinema-sticky{height:92svh;min-height:600px;top:4svh}
 .scroll-cinema-picture{width:calc(100% - 30px);height:clamp(275px,75vw,450px)}
 .scroll-cinema-copy{left:18px;right:18px;top:49%}
 .scroll-cinema-copy h2{font-size:clamp(37px,9.1vw,68px);white-space:normal;letter-spacing:-.068em}
 .scroll-caption-one,.scroll-caption-two{font-size:8px;letter-spacing:.1em}
 .scroll-scene-top,.scroll-scene-foot{font-size:8px;letter-spacing:.09em;padding-left:20px;padding-right:20px}
 .scroll-frame-index{font-size:8px;left:15px;top:15px}
 .scroll-scene-foot>span:first-child{max-width:50%}
}
@media(prefers-reduced-motion:reduce){
 .scroll-cinema{height:auto;min-height:550px}
 .scroll-cinema-sticky{height:auto;min-height:550px;position:relative;top:auto;padding-top:35px;padding-bottom:35px}
 .scroll-cinema-sticky::before{opacity:0}
 .scroll-cinema-picture{transform:none}
 .scroll-cinema-copy{transform:none}
 .scroll-caption-two{opacity:1}
 .scroll-caption-one{opacity:1}
 .scroll-image-b{clip-path:inset(0 100% 0 0)}
 .brand-mark img{transform:none!important}
}

/* P04 visual review refinements: a true 16:10-ish hero; legible scroll labels. */
@media(min-width:721px){.hero-frame{height:clamp(360px,29vw,420px)}}
.scroll-cinema-sticky::before{opacity:clamp(0,calc((var(--scene-p) - .78)*4.55),.98)}
.scroll-scene-top,.scroll-scene-foot{mix-blend-mode:normal;color:var(--scene-label,#dbe5dd)}
.scroll-cinema-copy h2{font-size:clamp(62px,7.3vw,115px)}
@media(max-width:720px){.scroll-cinema-copy h2{font-size:clamp(42px,11vw,70px);max-width:94%;margin-left:auto;margin-right:auto;text-wrap:balance}}

/* AR Portfolio — Prototype 05: The Amr Uniform. Built over Prototype 04. */
.kit-preface{background:var(--paper);border-top:1px solid #c9cec2;padding:clamp(70px,8vw,132px) 0;color:var(--ink)}
.kit-preface-inner{display:grid;grid-template-columns:minmax(0,1fr) 250px;align-items:end;gap:40px}
.kit-preface h2{font-size:clamp(55px,7.7vw,124px);line-height:.9;letter-spacing:-.082em;font-weight:800;margin:32px 0 0}
.kit-preface h2 em{font-family:var(--serif);font-weight:400;color:#577965}
.kit-preface p{font-family:var(--serif);font-size:clamp(17px,2vw,24px);line-height:1.4;font-style:italic;color:#4b6253;margin:0 0 6px}
.kit-story{position:relative;background:#051b16;color:#f6f4e9;height:340svh;min-height:2300px;isolation:isolate}
.kit-sticky{height:100svh;min-height:690px;position:sticky;top:0;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;background:radial-gradient(ellipse 55% 70% at 56% 40%,#174a3296,transparent 90%),#061d18}
.kit-sticky::before{content:'';position:absolute;inset:0;background:linear-gradient(transparent 49%,#061e19c5),repeating-linear-gradient(0deg,#ffffff05 0px,#ffffff05 1px,transparent 1px,transparent 8px);pointer-events:none;opacity:.3;z-index:0}
.kit-topline,.kit-bottomline{position:relative;z-index:5;display:flex;gap:20px;align-items:center;justify-content:space-between;font-size:9px;letter-spacing:.21em;font-weight:700;color:#ceddd1}
.kit-topline{padding-top:35px;padding-bottom:14px;border-bottom:1px solid #ffffff28}.kit-topline>span:first-child{color:var(--acid)}.kit-toprule{display:inline-block;width:55px;height:1px;background:#ceb448;vertical-align:middle;margin-left:20px}
.kit-bottomline{padding-top:20px;padding-bottom:27px;border-top:1px solid #ffffff2c}.kit-bottomline>span:last-child{color:var(--acid)}
.kit-layout{position:relative;z-index:2;display:grid;grid-template-columns: 29% 42% 29%;align-items:center;flex:1;min-height:0;gap:0}
.kit-intro{position:relative;z-index:4;align-self:center;padding-right:10px}
.kit-eyebrow{display:block;color:var(--acid);font-size:9px;letter-spacing:.16em;font-weight:700;margin-bottom:24px}
.kit-intro h2{font-size:clamp(45px,5.1vw,82px);font-weight:350;letter-spacing:-.07em;line-height:.94;margin:0 0 30px;font-family:var(--serif);color:#efcb7c}
.kit-intro h2 em{font-style:italic;font-weight:400}
.kit-intro>p{font-size:clamp(13px,1.03vw,17px);line-height:1.65;max-width:300px;margin:0 0 39px;color:#d0d8ce}
.kit-selectors{display:grid;max-width:265px;gap:0}.kit-selectors button{width:100%;display:flex;align-items:center;gap:17px;background:transparent;border:0;border-left:1px solid #ffffff34;padding:11px 10px;color:#afc1b3;font-size:10px;font-weight:750;letter-spacing:.11em;text-align:left;transition:color .2s,border .2s,background .2s}
.kit-selectors button span{color:#adbcaf;font-family:var(--serif);font-size:14px;font-weight:400;letter-spacing:0}
.kit-selectors button.is-current,.kit-selectors button:hover{color:var(--acid);border-left-color:var(--acid);background:#f3c4260d}.kit-selectors button.is-current span{color:var(--acid)}
.kit-stage{height:min(65vh,650px);min-height:390px;position:relative;display:grid;place-items:center;perspective:1000px;cursor:grab;isolation:isolate;outline-offset:5px}
.kit-stage:active{cursor:grabbing}
.kit-halo{position:absolute;inset:10% 4%;border-radius:50%;background:radial-gradient(ellipse at center,#2f65415c,transparent 63%);filter:blur(13px)}
.kit-orbit{position:absolute;z-index:1;bottom:11%;left:6%;width:88%;height:15%;border:1px solid #c79e4285;border-radius:50%;transform:perspective(550px) rotateX(66deg)}
.kit-art{z-index:2;position:relative;width:93%;height:83%;max-width:620px;transform:perspective(950px) rotateY(var(--kit-y,0deg)) rotateX(var(--kit-x,0deg)) translateY(var(--kit-float,0px));transition:transform .3s ease,opacity .22s ease;filter:drop-shadow(0px 24px 32px #0007);will-change:transform}
.kit-art img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;mix-blend-mode:screen;filter:contrast(1.04) saturate(.91);border-radius:4px}
.kit-art.is-switching{opacity:0;transform:translateY(14px) scale(.96)}
.kit-stage-edge{position:absolute;width:22px;height:22px;z-index:3;pointer-events:none;border-color:#e4b7598a;border-style:solid}.kit-stage-edge-tl{top:15%;left:5%;border-width:1px 0 0 1px}.kit-stage-edge-br{bottom:14%;right:5%;border-width:0 1px 1px 0}
.kit-stage-caption{position:absolute;top:7%;left:7%;font-size:9px;letter-spacing:.17em;color:#d5b45d}.kit-gesture{position:absolute;bottom:6%;left:50%;transform:translateX(-50%);font-size:9px;font-weight:700;letter-spacing:.17em;color:#ded3a7;white-space:nowrap}.kit-gesture .arrow{margin-left:6px}
.kit-info{position:relative;z-index:3;align-self:center;padding-left:clamp(20px,3vw,65px)}.kit-count{font-size:10px;letter-spacing:.22em;color:var(--acid);font-weight:750}.kit-info h3{font-family:var(--serif);font-size:clamp(30px,3.35vw,53px);font-weight:400;letter-spacing:-.035em;line-height:1.04;margin:20px 0 17px;color:#f3d18b}.kit-info>p{color:#d4dfd4;line-height:1.65;font-size:clamp(12px,1.08vw,16px);min-height:84px;margin:0;max-width:290px}.kit-dots{display:flex;gap:10px;margin-top:25px}.kit-dots button{width:24px;height:18px;border:0;background:transparent;padding:7px 0;position:relative}.kit-dots button:after{content:'';display:block;height:2px;background:#ffffff40;transition:background .2s}.kit-dots button.is-current:after{background:var(--acid)}
.kit-reality{margin-top:clamp(15px,4vh,48px);padding-top:18px;border-top:1px solid #ffffff40}.kit-reality>span{font-size:9px;letter-spacing:.18em;color:#d9c690;font-weight:750}.kit-reality-photos{display:flex;gap:10px;margin:14px 0}.kit-reality-photos img{width:73px;height:93px;object-fit:cover;object-position:center 32%;filter:saturate(.72);border:1px solid #ffffff33}.kit-reality small{font-size:10px;line-height:1.4;color:#8fa698;display:block;max-width:270px}
.kit-progress{height:2px;background:#ffffff3b;flex:1;max-width:370px}.kit-progress i{display:block;background:var(--acid);width:var(--kit-progress,0%);height:100%;transition:width .16s linear}
@media(max-width:1100px){.kit-layout{grid-template-columns:30% 43% 27%}.kit-intro h2{font-size:clamp(43px,5.5vw,70px)}.kit-info{padding-left:18px}.kit-info h3{font-size:clamp(28px,3.6vw,42px)}.kit-reality-photos img{height:71px;width:60px}}
@media(max-width:720px){
 .kit-preface{padding:70px 0 75px}.kit-preface-inner{grid-template-columns:1fr;gap:17px}.kit-preface h2{font-size:clamp(44px,11.8vw,82px);margin-top:23px}.kit-preface p{max-width:310px;font-size:19px}
 .kit-story{height:290svh;min-height:1750px}.kit-sticky{height:100svh;min-height:620px}
 .kit-topline,.kit-bottomline{font-size:8px;letter-spacing:.08em}.kit-topline{padding-top:17px;padding-bottom:12px}.kit-topline>span:last-child{font-size:7px;white-space:nowrap}.kit-toprule{width:16px;margin-left:6px}.kit-bottomline{padding-top:11px;padding-bottom:13px}.kit-bottomline>span:first-child{max-width:44%}.kit-progress{max-width:85px}
 .kit-layout{display:flex;flex-direction:column;justify-content:center;gap:0;min-height:0}
 .kit-intro{width:100%;padding:9px 0 0;align-self:stretch}.kit-eyebrow{font-size:8px;margin-bottom:7px}.kit-intro h2{font-size:clamp(35px,9.4vw,49px);line-height:.89;margin:0 0 8px}.kit-intro h2 br{display:none}.kit-intro>p{font-size:11px;line-height:1.34;margin:0 0 10px;max-width:100%}
 .kit-selectors{display:flex;overflow-x:auto;max-width:none;gap:7px;scrollbar-width:none}.kit-selectors::-webkit-scrollbar{display:none}.kit-selectors button{flex:0 0 auto;width:auto;padding:8px 7px;font-size:8px;letter-spacing:.04em;gap:6px}.kit-selectors button span{font-size:11px}
 .kit-stage{width:100%;flex:1;min-height:170px;height:auto;margin:2px 0 0;max-height:440px}.kit-art{width:94%;height:89%}.kit-orbit{bottom:7%}.kit-stage-caption{top:2%;left:5%;font-size:7px}.kit-gesture{bottom:0;font-size:7px}
 .kit-info{width:100%;padding:6px 0 9px;min-height:115px}.kit-count{font-size:8px}.kit-info h3{font-size:clamp(26px,7vw,34px);margin:5px 0 5px}.kit-info>p{font-size:11px;line-height:1.35;min-height:35px;max-width:none}.kit-dots{margin-top:8px;gap:7px}.kit-reality{display:none}
}
@media(max-width:375px){.kit-intro h2{font-size:32px}.kit-intro>p{font-size:10px}.kit-selectors button{font-size:7px}.kit-info>p{font-size:10px}}
@media(prefers-reduced-motion:reduce){.kit-story{height:auto;min-height:auto}.kit-sticky{height:auto;min-height:740px;position:relative}.kit-art{transform:none!important;transition:none}.kit-progress i{transition:none}.kit-intro>p{max-width:90%}}

@media(max-width:720px){.kit-intro h2 em::before{content:" ";white-space:pre}}

/* === AR 06 / Behind the Lens: interactive production disciplines === */
.lens-preface{background:var(--paper);padding:95px 0 93px;border-top:1px solid #ccd1c5}
.lens-preface-layout{display:grid;grid-template-columns:23% 51% 26%;align-items:start;gap:0}
.lens-preface h2{font-size:clamp(48px,5.5vw,88px);line-height:.95;letter-spacing:-.075em;margin:0;color:var(--ink)}
.lens-preface h2 em{font-family:var(--serif);font-weight:400;color:#68856c}
.lens-preface p{font-family:var(--serif);font-style:italic;font-size:clamp(17px,1.8vw,25px);line-height:1.3;color:#596b5e;max-width:250px;margin:5px 0 0}
.lens-story{position:relative;height:325svh;min-height:2260px;background:#051c16;color:#f8f4e7;isolation:isolate}
.lens-sticky{position:sticky;top:0;height:100svh;min-height:665px;display:flex;flex-direction:column;background:radial-gradient(ellipse 56% 70% at 53% 43%,#184a3180,transparent 82%),linear-gradient(120deg,#061c17,#08281f 53%,#031813);overflow:hidden}
.lens-sticky:before{content:'';position:absolute;inset:0;pointer-events:none;opacity:.13;background:repeating-linear-gradient(0deg,#ffffff15 0,#ffffff15 1px,transparent 1px,transparent 7px)}
.lens-overline,.lens-foot{position:relative;z-index:5;display:flex;justify-content:space-between;gap:16px;align-items:center;font-weight:700;font-size:9px;letter-spacing:.19em;color:#bbd1c1}
.lens-overline{padding-top:28px;padding-bottom:18px;border-bottom:1px solid #e7efdb26}.lens-overline>span:first-child{color:var(--acid)}.lens-overline b{color:var(--acid)}
.lens-foot{padding:14px 0 27px;border-top:1px solid #e7efdb26}.lens-foot>span:last-child{color:var(--acid)}.lens-bar{height:2px;background:#e5e9d52d;width:23%;max-width:300px}.lens-bar i{display:block;background:var(--acid);height:100%;width:0%;transition:width .1s linear}
.lens-grid{position:relative;z-index:2;flex:1;min-height:0;display:grid;grid-template-columns:30% 41% 29%;align-items:center}
.lens-intro{position:relative;z-index:4;padding-right:24px}.lens-kicker{font-size:9px;letter-spacing:.19em;color:var(--acid);font-weight:700}
.lens-intro h2{font-size:clamp(48px,5.2vw,85px);letter-spacing:-.08em;line-height:.89;margin:25px 0 20px;font-weight:700}.lens-intro h2 em{font-family:var(--serif);font-weight:400;color:#e4c879}
.lens-intro>p{font-size:clamp(12px,1vw,15px);line-height:1.65;color:#c7d5c8;max-width:260px;margin:0 0 33px}
.lens-categories{display:grid;max-width:290px}.lens-categories button{display:grid;grid-template-columns:25px 1fr 9px;align-items:center;gap:8px;width:100%;padding:15px 10px;text-align:left;border:0;border-left:1px solid #d4e4d333;background:none;color:#acc2b2;font-weight:750;font-size:11px;letter-spacing:.07em;transition:background .25s,color .25s,border .25s}
.lens-categories button.is-active,.lens-categories button:hover{background:#f3c42610;color:var(--acid);border-left-color:var(--acid)}.lens-categories button span.lens-index{color:#b8b39a;font-family:var(--serif);font-weight:400;font-size:15px}.lens-categories button.is-active .lens-index{color:var(--acid)}.lens-categories button small{display:block;font-size:9px;font-weight:400;letter-spacing:.02em;color:#aac1ad;margin-top:6px}.lens-check{color:#ead189;font-size:8px;opacity:0}.lens-categories button.is-active .lens-check{opacity:1}
.lens-stage{height:min(68vh,690px);min-height:370px;position:relative;display:grid;place-items:center;isolation:isolate;perspective:1100px;outline-offset:3px}.lens-aura{inset:12% 6%;position:absolute;background:radial-gradient(ellipse,#538d6545,transparent 68%);filter:blur(17px)}.lens-orbit{position:absolute;bottom:14%;width:85%;height:16%;border:1px solid #d4b15e6b;border-radius:50%;transform:perspective(550px) rotateX(66deg)}.lens-orbit:after{content:'';position:absolute;inset:24%;border:1px dashed #d4b15e66;border-radius:50%}
.lens-image-wrap{position:relative;z-index:2;width:100%;height:90%;display:grid;place-items:center;transform:perspective(1100px) rotateX(var(--lens-x,0deg)) rotateY(var(--lens-y,0deg)) translate3d(0,var(--lens-float,0px),0);transition:transform .35s cubic-bezier(.18,.62,.26,1),opacity .2s,filter .2s;will-change:transform;filter:drop-shadow(0 30px 27px #0008)}.lens-image-wrap img{width:min(100%,720px);height:100%;object-fit:contain}.lens-image-wrap.is-changing{opacity:.25;filter:blur(4px)}
.lens-stage-index{position:absolute;top:10%;left:7%;font-size:9px;letter-spacing:.16em;color:#d9c48f}.lens-stage-label{position:absolute;bottom:6%;z-index:3;font-size:11px;letter-spacing:.21em;font-weight:800;color:#e5cd8b}.lens-gesture{position:absolute;right:3%;top:52%;writing-mode:vertical-rl;font-size:8px;letter-spacing:.17em;color:#97b29f}.lens-crosshair{color:var(--acid);padding-top:12px}
.lens-info{padding-left:clamp(10px,3vw,65px);position:relative;z-index:3;min-width:0}.lens-category-number{font-size:10px;color:var(--acid);font-weight:700;letter-spacing:.17em}.lens-info h3{font-family:var(--serif);font-weight:400;font-size:clamp(35px,3.4vw,59px);line-height:1;letter-spacing:-.04em;color:#e7cb87;margin:24px 0 13px}.lens-hero-desc{font-family:var(--serif);font-style:italic;font-size:clamp(16px,1.35vw,22px);line-height:1.36;color:#e2e7d8;margin:0}.lens-body{font-size:12px;line-height:1.65;color:#aac1ae;max-width:280px;min-height:62px;margin:15px 0 22px}.lens-objects-head{display:flex;justify-content:space-between;gap:5px;border-top:1px solid #e1e8d02e;padding-top:15px;font-size:9px;letter-spacing:.12em;color:#d8c48b;font-weight:700}.lens-objects{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;margin-top:15px}.lens-objects button{padding:5px 4px 8px;background:#11382b;border:1px solid #aec5b31c;display:grid;justify-items:center;gap:2px;color:#b6cbb9;transition:background .2s,border-color .2s,color .2s;min-width:0}.lens-objects button:hover,.lens-objects button.is-selected{border-color:var(--acid);background:#174632;color:#ffda64}.lens-objects button img{width:100%;height:70px;object-fit:contain}.lens-objects button span{font-size:8px;letter-spacing:.035em;line-height:1.1;min-height:20px;display:flex;align-items:center;text-align:center}
.lens-project{margin-top:18px;padding-top:13px;border-top:1px solid #e1e8d02e;display:grid;gap:7px}.lens-project>span{font-size:9px;letter-spacing:.14em;color:#c7d5bf}.lens-project a{font-size:11px;font-weight:750;letter-spacing:.04em;color:var(--acid);width:max-content;max-width:100%;display:inline-flex;gap:9px;align-items:center}.lens-project a[hidden]{display:none}.lens-project small{color:#a0b7a7;font-size:9px;letter-spacing:.04em;line-height:1.3}
@media(max-width:1120px){.lens-grid{grid-template-columns:30% 38% 32%}.lens-intro h2{font-size:clamp(45px,5.5vw,72px)}.lens-info h3{font-size:clamp(31px,3.4vw,45px)}.lens-info{padding-left:16px}.lens-objects button img{height:50px}.lens-objects{gap:4px}}
@media(max-width:760px){
 .lens-preface{padding:70px 0}.lens-preface-layout{display:block}.lens-preface h2{margin:22px 0 18px;font-size:clamp(42px,9vw,65px)}.lens-preface p{max-width:330px}
 .lens-story{height:315svh;min-height:1900px}.lens-sticky{height:100svh;min-height:600px}.lens-overline{padding-top:12px;padding-bottom:11px;font-size:8px}.lens-foot{padding:12px 0 14px;font-size:7px;letter-spacing:.055em}.lens-foot span:first-child{max-width:53%}.lens-bar{width:22%}
 .lens-grid{display:flex;flex-direction:column;align-items:stretch;justify-content:center;gap:0}.lens-intro{padding:10px 0 0}.lens-kicker{font-size:8px}.lens-intro h2{font-size:clamp(38px,9.9vw,57px);line-height:.9;margin:8px 0 7px}.lens-intro h2 br{display:none}.lens-intro>p{font-size:11px;line-height:1.35;max-width:none;margin-bottom:9px}
 .lens-categories{display:flex;overflow-x:auto;gap:6px;max-width:none;scrollbar-width:none;padding-bottom:4px}.lens-categories::-webkit-scrollbar{display:none}.lens-categories button{flex:1 0 auto;width:auto;grid-template-columns:15px 1fr;padding:10px 10px;font-size:9px;letter-spacing:.03em;gap:5px;white-space:nowrap}.lens-categories button span.lens-index{font-size:11px}.lens-categories button small,.lens-check{display:none}
 .lens-stage{height:auto;min-height:0;flex:1;max-height:44svh}.lens-image-wrap{height:97%}.lens-orbit{bottom:7%;height:19%}.lens-stage-index{font-size:7px;top:3%;left:2%}.lens-stage-label{bottom:2%;font-size:9px}.lens-gesture{font-size:7px;right:1%}
 .lens-info{padding:0 0 6px;flex-shrink:0}.lens-category-number{font-size:8px}.lens-info h3{font-size:clamp(29px,7.3vw,38px);margin:6px 0}.lens-hero-desc{font-size:14px}.lens-body{display:none}.lens-objects-head{padding-top:8px;font-size:8px}.lens-objects{margin-top:6px;gap:6px}.lens-objects button{padding:2px 2px 3px}.lens-objects button img{height:48px}.lens-objects button span{font-size:8px;min-height:16px}.lens-project{display:none}
}
@media(max-width:380px){.lens-intro h2{font-size:35px}.lens-stage{max-height:40svh}.lens-objects button img{height:42px}.lens-intro>p{font-size:10px}}
@media(max-height:695px) and (max-width:760px){.lens-sticky{min-height:580px}.lens-stage{max-height:32svh}.lens-intro h2{font-size:36px}.lens-intro>p{margin-bottom:4px}.lens-overline{padding-block:9px}}
@media(prefers-reduced-motion:reduce){.lens-story{height:auto;min-height:auto}.lens-sticky{position:relative;height:auto;min-height:750px}.lens-grid{padding-block:35px}.lens-image-wrap{transform:none!important;transition:none}.lens-bar i{transition:none}}


/* AR PORTFOLIO 07 — refined object archive. Prototype 06 visual language stays the foundation. */
.lens-story{--world-a:#071f18;--world-b:#0b382a;height:355svh;min-height:2430px}
.lens-sticky{background:radial-gradient(ellipse 54% 69% at 49% 45%,color-mix(in srgb,var(--world-b) 78%,transparent),transparent 82%),linear-gradient(126deg,var(--world-a),var(--world-b) 56%,var(--world-a));transition:background .5s ease}
.lens-stage{overflow:visible;isolation:isolate}
.lens-aura{background:radial-gradient(ellipse,#b3be7260,transparent 68%);filter:blur(35px);opacity:.5}
.lens-backword{position:absolute;top:18%;left:49%;transform:translateX(-50%);font:700 clamp(70px,10vw,176px)/.9 var(--sans);letter-spacing:-.1em;color:#f4d6800e;white-space:nowrap;pointer-events:none;z-index:0;user-select:none}
.lens-axis{position:absolute;inset:17% 0 12%;pointer-events:none;opacity:.37}.lens-axis i:first-child{position:absolute;left:50%;height:100%;border-left:1px dashed #dfc57d5b}.lens-axis i:last-child{position:absolute;top:50%;width:100%;border-top:1px dashed #dfc57d37}
.lens-image-wrap{height:79%;width:91%;margin:auto;z-index:3;transform:perspective(1300px) rotateX(var(--lens-x,0deg)) rotateY(var(--lens-y,0deg)) translate3d(0,var(--lens-float,0px),10px) rotate(var(--obj-tilt,0deg));filter:drop-shadow(0 28px 38px #000a);transition:transform .65s cubic-bezier(.2,.76,.17,1),opacity .28s ease,filter .28s ease}
.lens-image-wrap img{width:100%;height:100%;object-fit:contain;user-select:none;pointer-events:none}
.lens-image-wrap.is-photographic{height:76%;width:90%}
.lens-image-wrap.is-changing{opacity:.06;filter:blur(14px)}
.lens-stage-index{top:6%;left:3%;font-size:9px}.lens-digit{color:#8da793}
.lens-orbit{width:82%;bottom:10%;z-index:1;opacity:.6;transform:perspective(700px) rotateX(71deg) rotateZ(calc(var(--chapter-local, 0)*40deg));transition:transform .2s linear}
.lens-stage-label{bottom:5%;left:50%;transform:translateX(-50%);padding:8px 16px;background:#031f19ce;z-index:6;border:1px solid #bbaa6850;white-space:nowrap}
.lens-constellation{position:absolute;inset:0;pointer-events:none;z-index:2;transform:translate3d(var(--support-x,0px),var(--support-y,0px),0);transition:transform .5s ease}
.lens-secondary{position:absolute;object-fit:contain;width:29%;height:28%;filter:drop-shadow(0 24px 20px #0009);opacity:.83;animation:ar-float 7s ease-in-out infinite}
.lens-secondary--one{left:-3%;top:28%;transform:rotate(-20deg);animation-delay:-1s}
.lens-secondary--two{right:-3%;bottom:23%;transform:rotate(14deg);animation-delay:-3.8s}
.lens-gesture{right:-2%;top:38%;color:#a6c7ac}
.lens-inspect{position:absolute;bottom:0%;right:1%;z-index:7;display:flex;align-items:center;gap:9px;border:1px solid #e7cd7d85;background:#07251ddb;color:#f1da95;padding:8px 12px;font-size:9px;font-weight:700;letter-spacing:.09em;transition:background .2s,transform .2s}
.lens-inspect:hover{background:#f3c426;color:#051c16;transform:translateY(-4px)}.lens-inspect-plus{font-size:20px;line-height:.8}
.lens-selection-tip{font-size:8px;letter-spacing:.09em;color:#83a597;margin:10px 0 0;line-height:1.5}
.lens-stage.chapter-in .lens-image-wrap{animation:ar-object-enter .7s cubic-bezier(.2,.75,.1,1) both}
.lens-stage.chapter-in .lens-constellation{animation:ar-support-enter .75s cubic-bezier(.2,.75,.1,1) both}
@keyframes ar-float{0%,100%{translate:0 0}50%{translate:0 -10px}}
@keyframes ar-object-enter{from{opacity:0;translate:0 38px;filter:blur(12px)}to{opacity:1;translate:0 0;filter:blur(0)}}
@keyframes ar-support-enter{from{opacity:0;translate:0 24px}to{opacity:1;translate:0 0}}
.lens-objects button{position:relative;overflow:hidden;border-color:#d6d6ac45;background:#1a4435}.lens-objects button:hover{transform:translateY(-3px)}.lens-objects button.is-selected{background:#294e3d;box-shadow:inset 0 0 0 1px #f3c42620}
.lens-objects button img{height:67px;filter:drop-shadow(0 7px 6px #0007)}
.lens-category-number{color:#f3c426}.lens-info h3{margin-top:15px}.lens-project{margin-top:20px}
.object-dialog{border:1px solid #b4a56b8a;background:#092b23;color:#f9eed9;padding:0;max-width:min(980px,calc(100vw - 34px));max-height:min(780px,calc(100dvh - 34px));width:100%;box-shadow:0 34px 100px #000b;overflow:auto}
.object-dialog::backdrop{background:#020d0be6;backdrop-filter:blur(9px)}
.object-close{position:absolute;top:18px;right:18px;z-index:10;border:1px solid #e7c9848c;background:#0b2f26;color:#f5d074;font-size:29px;width:42px;height:42px;line-height:1}
.object-dialog-content{display:grid;grid-template-columns:56% 44%;min-height:530px}
.object-dialog-visual{padding:30px;position:relative;display:flex;flex-direction:column;justify-content:space-between;align-items:center;gap:15px;background:radial-gradient(circle at 50% 45%,#214d39,#0b251d 74%);overflow:hidden}
.object-dialog-visual:after{content:'';position:absolute;bottom:17%;border:1px solid #d4ad5170;border-radius:50%;width:65%;height:11%;transform:perspective(380px) rotateX(65deg);pointer-events:none}
.object-dialog-visual img{height:min(56vh,470px);width:100%;object-fit:contain;filter:drop-shadow(0 32px 26px #0009);position:relative;z-index:1}
.object-dialog-visual>span{font-size:9px;letter-spacing:.19em;color:#dec985;width:100%}
.object-dialog-info{display:flex;flex-direction:column;justify-content:center;padding:clamp(35px,5vw,75px) clamp(25px,3vw,50px)}
.object-kicker{font-size:10px;letter-spacing:.19em;font-weight:800;color:#f4c426}
.object-dialog-info h2{font:400 clamp(37px,4vw,65px)/1 var(--serif);letter-spacing:-.045em;margin:27px 0 20px;color:#f3d283}
.object-dialog-info>p{font:italic clamp(18px,2vw,24px)/1.4 var(--serif);color:#e9e7d7}
.object-dialog-rule{border-top:1px solid #e5dcb63d;margin:32px 0 16px}
.object-dialog-info p.object-dialog-small{font:400 12px/1.8 var(--sans);color:#a9bcac}
.object-dialog-back{border:0;background:none;border-bottom:1px solid #dbc175;color:#f4c426;font-size:10px;font-weight:800;letter-spacing:.14em;display:flex;justify-content:space-between;align-items:center;padding:18px 0 10px;margin-top:28px}
.object-dialog-back .arrow{width:18px;height:18px}
@media(max-width:1050px){.lens-secondary{width:25%;height:24%}.lens-inspect{bottom:0}.lens-image-wrap{width:100%}}
@media(max-width:760px){.lens-story{height:315svh;min-height:1950px}.lens-sticky{min-height:600px}.lens-backword{font-size:18vw;top:28%}.lens-stage{max-height:39svh;min-height:150px}.lens-constellation{inset:4% 0}.lens-secondary{width:24%;height:30%;opacity:.8}.lens-secondary--one{left:0;top:24%}.lens-secondary--two{right:0;bottom:20%}.lens-image-wrap{height:85%;width:77%}.lens-image-wrap.is-photographic{height:86%;width:75%}.lens-stage-index{top:0;font-size:7px}.lens-orbit{bottom:7%}.lens-stage-label{bottom:0;left:50%;font-size:8px}.lens-inspect{right:1%;bottom:0;padding:5px 7px;font-size:7px}.lens-inspect-plus{font-size:16px}.lens-gesture{display:none}.lens-selection-tip{display:none}.lens-objects button img{height:43px}.object-dialog-content{grid-template-columns:1fr}.object-dialog-visual{height:48dvh;padding:15px}.object-dialog-visual img{height:37dvh}.object-dialog-info{padding:24px}.object-dialog-info h2{font-size:40px;margin:14px 0}.object-dialog-info p{font-size:17px;margin:0}}
@media(max-width:380px){.lens-stage{max-height:33svh}.lens-secondary{width:25%}.lens-inspect span:last-child{display:none}.lens-inspect{height:30px;width:30px;justify-content:center}.lens-info h3{font-size:25px}}
@media(prefers-reduced-motion:reduce){.lens-constellation,.lens-secondary,.lens-stage.chapter-in .lens-image-wrap,.lens-stage.chapter-in .lens-constellation{animation:none!important;transform:none}.lens-image-wrap{transform:none!important}.lens-story{height:auto;min-height:unset}}


/* AR / MOTION PASS 08 — film-first design, no equipment chapter */
:root{--transition-ink:#08281e}
body{overscroll-behavior-x:none}
.thesis-ink{position:relative;z-index:0;white-space:nowrap;background-image:linear-gradient(90deg,#d9b446 0,#d9b446 var(--ink-progress,0%),#557a62 var(--ink-progress,0%),#557a62 100%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;transition:background-position .15s}
.card-hover-hint{position:absolute;z-index:4;left:21px;bottom:20px;font-size:9px;letter-spacing:.16em;color:white;opacity:0;transition:opacity .3s}
.project.featured:hover .card-hover-hint{opacity:1}.project.featured:hover .cursor-spot{transform:scale(1.05)}
.project-archive .project-img{clip-path:inset(0 0 0 0);transition:clip-path .5s ease}.project-archive:hover .project-img{clip-path:inset(1.2% 1.2% 1.2% 1.2%)}
/* an authored scroll-chapter connecting the films to the filmmaker */
.interlude{height:290svh;min-height:1700px;background:var(--deep);color:var(--text);position:relative;--interlude-p:0;--scene-a:0;--scene-b:0}
.interlude-sticky{position:sticky;top:0;height:100svh;min-height:620px;overflow:hidden;background:radial-gradient(ellipse at 65% 51%,#235c3b7a,transparent 57%),linear-gradient(112deg,#061c18,#123729 65%,#051915)}
.interlude-sticky:before{content:'';position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,#ffffff07 0,#ffffff07 1px,transparent 1px,transparent 6px);opacity:.3}
.interlude-head,.interlude-foot{position:relative;z-index:3;display:flex;justify-content:space-between;gap:16px;color:#cbd8c8;letter-spacing:.19em;font-size:9px;font-weight:700}
.interlude-head{border-bottom:1px solid #e9ebd337;padding-top:31px;padding-bottom:20px}.interlude-head span:last-child{color:var(--acid)}
.interlude-foot{align-items:center;border-top:1px solid #e9ebd337;padding-top:20px;position:absolute;left:50%;transform:translateX(-50%);bottom:24px}
.interlude-progress{width:23%;height:2px;background:#8aa18f40}.interlude-progress i{display:block;width:calc(var(--interlude-p) * 100%);height:2px;background:var(--acid)}
.interlude-grid{height:calc(100% - 160px);display:grid;grid-template-columns:45% 55%;align-items:center;position:relative;z-index:2;gap:0}
.interlude-copy{position:relative;z-index:3;transform:translate3d(0,calc(var(--interlude-p)*-26px),0)}.interlude-kicker{font-size:10px;letter-spacing:.17em;color:var(--acid);margin:0 0 38px}
.interlude-copy h2{font-size:clamp(55px,7.3vw,118px);font-weight:780;letter-spacing:-.09em;line-height:.86;margin:0 0 45px;white-space:nowrap}.interlude-copy h2 em{font-family:var(--serif);font-weight:400;color:var(--acid)}
.interlude-copy [data-interlude-caption]{font-size:clamp(18px,2vw,29px);font-family:var(--serif);font-style:italic;color:#e2dabb;margin:0 0 14px}.interlude-line{font-size:9px;letter-spacing:.15em;color:#a5bcac}
.interlude-stage{height:min(66vh,690px);min-height:350px;position:relative;transform:perspective(1000px) rotateY(calc(9deg - var(--interlude-p)*9deg)) translate3d(0,0,0) scale(calc(.86 + var(--interlude-p)*.14));transform-origin:center;box-shadow:0 35px 90px #0005}
.interlude-image{position:absolute;inset:0;overflow:hidden;will-change:opacity}.interlude-image img{width:100%;height:100%;object-fit:cover;filter:saturate(.78) contrast(1.11);transform:scale(calc(1.14 - .11*var(--interlude-p))) translateX(calc(var(--interlude-p)*-8px))}.interlude-first{opacity:1}.interlude-second{opacity:var(--scene-a)}.interlude-third{opacity:var(--scene-b)}.interlude-third img{object-position:center 40%}
.interlude-stage:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#0018109a,transparent 50%);pointer-events:none}
.interlude-stamp{position:absolute;z-index:2;left:22px;bottom:20px;font-size:9px;letter-spacing:.16em;color:#f0e8d4}.interlude-crosshair{position:absolute;z-index:2;right:24px;top:24px;color:var(--acid);font-size:26px;font-weight:200}
/* About: a real personal portrait, with touch-accessible frame reveal */
.about-editorial{padding:110px 0 115px;overflow:hidden}.about-topline{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:48px;border-bottom:1px solid #ffffff35;padding-bottom:20px}.about-topline .micro{color:#d0ddce}
.about-editorial-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(300px,.77fr);gap:5vw;align-items:center}
.about-editorial .about-inner{display:block}.about-editorial .about-title{font-size:clamp(60px,7vw,114px);margin:0 0 45px}.about-editorial .about-detail{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}.about-editorial .about-detail aside{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap}
.about-portrait{min-width:0;transform:translateY(var(--about-shift,0px));will-change:transform}.about-portrait-frame{aspect-ratio:4/5.4;position:relative;overflow:hidden;background:#102e23;isolation:isolate;border:1px solid #ffffff33}
.about-portrait-frame>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 40%;filter:contrast(1.1) saturate(.86);transition:transform .7s ease}.about-portrait-frame>img:first-child{transform:scale(1.015)}
.about-portrait .about-portrait-alt{z-index:1;clip-path:circle(0% at var(--about-x,50%) var(--about-y,50%));transition:clip-path .25s ease;object-position:50% 45%}.about-portrait:hover .about-portrait-alt{clip-path:circle(25% at var(--about-x,50%) var(--about-y,50%))}.about-portrait.is-switched .about-portrait-alt{clip-path:circle(150% at 50% 50%)}
.about-portrait .about-lens-cursor{position:absolute;z-index:2;top:var(--about-y,50%);left:var(--about-x,50%);transform:translate(-50%,-50%);pointer-events:none;color:white;letter-spacing:.13em;font-size:9px;text-shadow:0 2px 8px #000;opacity:0}.about-portrait:hover .about-lens-cursor{opacity:1}.about-portrait.is-switched .about-lens-cursor{opacity:0}
.about-photo-caption{display:flex;align-items:center;justify-content:space-between;gap:14px;padding-top:17px;border-bottom:1px solid #d4e3cf4d;padding-bottom:17px;font-size:9px;letter-spacing:.15em;color:#bfcfc1}.about-photo-caption button{border:0;background:transparent;color:var(--acid);font-size:9px;letter-spacing:.13em;font-weight:700;display:inline-flex;align-items:center;gap:8px}
/* Project detail polish: the stills are real interactive views */
.case-hero-bg img{will-change:transform}.watch-player{transform:scale(var(--watch-scale,.96));transform-origin:center;transition:transform .16s linear;box-shadow:0 22px 90px #0003}
.gallery-interactive .shot{cursor:zoom-in;overflow:hidden;position:relative}.gallery-interactive .shot:after{content:'VIEW FRAME  +';position:absolute;bottom:16px;right:16px;background:#092f26e8;color:#f3c426;font-size:10px;letter-spacing:.14em;padding:12px 15px;opacity:0;transform:translateY(7px);transition:opacity .2s,transform .2s}.gallery-interactive .shot:hover:after,.gallery-interactive .shot:focus-visible:after{opacity:1;transform:none}.gallery-interactive .shot img{transition:transform .7s cubic-bezier(.23,.7,.23,1),filter .5s}.gallery-interactive .shot:hover img{transform:scale(1.055);filter:saturate(1.12)}
.film-lightbox{width:min(90vw,1080px);max-height:95vh;border:1px solid #d6bc6b;background:#061b16;color:#f0f1e8;padding:12px;box-shadow:0 30px 100px #0008}.film-lightbox::backdrop{background:#020d0bdc;backdrop-filter:blur(12px)}.film-lightbox-inner{position:relative;display:grid;gap:10px}.film-lightbox-inner>img{width:100%;height:min(72vh,700px);object-fit:contain}.film-lightbox-close,.film-lightbox-bottom button{border:1px solid #e3dbaa80;background:#061b16;color:#f7e7aa;padding:12px 18px;font-size:10px;letter-spacing:.15em}.film-lightbox-close{justify-self:end}.film-lightbox-bottom{display:flex;justify-content:space-between;align-items:center;gap:20px;color:#f7e7aa;font-size:10px;letter-spacing:.14em}.film-lightbox-bottom div{display:flex;gap:8px}
/* motion reveal eases remain within viewport */
@media(max-width:900px){.interlude-grid{grid-template-columns:48% 52%}.interlude-copy h2{font-size:clamp(52px,7.2vw,85px)}.about-editorial-grid{grid-template-columns:minmax(0,1fr) minmax(290px,.8fr);gap:4vw}.about-editorial .about-title{font-size:clamp(51px,6vw,83px)}}
@media(max-width:760px){.interlude{height:220svh;min-height:1450px}.interlude-sticky{min-height:560px}.interlude-grid{height:calc(100% - 140px);display:flex;flex-direction:column;align-items:stretch;justify-content:center;gap:20px}.interlude-copy{flex-shrink:0}.interlude-kicker{margin:0 0 14px;font-size:8px}.interlude-copy h2{font-size:clamp(54px,13vw,77px);line-height:.88;margin:0 0 18px}.interlude-copy [data-interlude-caption]{font-size:17px;margin:0 0 6px}.interlude-line{font-size:8px}.interlude-stage{height:42vh;min-height:220px;flex-shrink:1;transform:scale(calc(.89 + var(--interlude-p)*.11))}.interlude-head{padding-top:15px;padding-bottom:14px;font-size:8px}.interlude-foot{bottom:16px;font-size:7px;letter-spacing:.08em}.interlude-foot>span:first-child{max-width:42%}.interlude-foot>span:last-child{max-width:35%;text-align:right}.interlude-progress{width:18%}.about-editorial{padding:75px 0}.about-editorial-grid{display:flex;flex-direction:column;gap:35px}.about-editorial .about-title{font-size:clamp(58px,12vw,94px);margin-bottom:28px}.about-topline{margin-bottom:30px}.about-topline .micro{display:none}.about-portrait{width:100%}.about-portrait-frame{aspect-ratio:4/4.5}.card-hover-hint{display:none}.gallery-interactive .shot:after{opacity:1;transform:none;font-size:8px}}
@media(max-width:390px){.interlude-copy h2{font-size:52px}.interlude-stage{height:37vh}.about-editorial .about-title{font-size:54px}}
@media(prefers-reduced-motion:reduce){.interlude{height:auto;min-height:0}.interlude-sticky{position:relative;height:auto;min-height:0;padding-bottom:50px}.interlude-grid{height:auto;padding-block:60px}.interlude-stage{transform:none!important}.interlude-second,.interlude-third{opacity:0}.interlude-copy{transform:none}.interlude-foot{position:relative;bottom:auto}.about-portrait{transform:none!important}.watch-player{transform:none!important}.about-portrait .about-portrait-alt{transition:none}}

/* AR × ESA — understated archive portal, not another homepage section */
.esa-doorway{background:var(--paper);padding:0 0 100px;color:var(--ink)}.esa-doorway-inner{display:grid;grid-template-columns:minmax(180px,.75fr) minmax(0,1.65fr);gap:5.3vw;align-items:center;border-top:1px solid #c3cbbf;padding-top:38px}.esa-doorway-heading{align-self:start}.esa-doorway-label{font-size:10px;letter-spacing:.19em;font-weight:750}.esa-doorway-label .tiny-rule{display:inline-block;width:26px;height:1px;background:#769282;margin:0 11px 4px}.esa-doorway-heading p{font-family:var(--serif);font-style:italic;font-size:clamp(20px,2.15vw,31px);line-height:1.2;letter-spacing:-.04em;color:#596f60;margin:16px 0 0;max-width:230px}.esa-doorway-card{height:166px;background:var(--forest);display:grid;grid-template-columns:190px 1fr 76px;align-items:stretch;position:relative;overflow:hidden;color:#f3f4e9;border:1px solid #355e46;isolation:isolate;transition:border-color .3s,transform .5s cubic-bezier(.15,.7,.22,1)}.esa-doorway-card:hover{border-color:var(--acid);transform:translateY(-2px)}.esa-doorway-mark{position:relative;display:grid;place-items:center;background:#124233;overflow:hidden;isolation:isolate}.esa-doorway-mark img{width:76%;position:relative;z-index:2;filter:drop-shadow(0 1px 9px #03140d44);transition:transform .6s cubic-bezier(.15,.7,.25,1);transform:translate(var(--esa-tx,0px),var(--esa-ty,0px)) scale(1)}.esa-doorway-card:hover .esa-doorway-mark img{transform:translate(var(--esa-tx,0px),var(--esa-ty,0px)) scale(1.06)}.esa-contour{position:absolute;width:240px;height:240px;border:1px solid #e2d78c38;border-radius:43% 57% 65% 35% / 45% 35% 65% 55%;left:50%;top:50%;transform:translate(calc(-50% + var(--esa-tx,0px)),calc(-50% + var(--esa-ty,0px))) rotate(-15deg);transition:transform .55s}.esa-contour-two{width:195px;height:195px;border-color:#e2d78c40;transform:translate(calc(-50% - var(--esa-tx,0px)),calc(-50% - var(--esa-ty,0px))) rotate(22deg)}.esa-contour-three{width:139px;height:139px;border-color:#e2d78c37;transform:translate(-50%,-50%) rotate(40deg)}.esa-doorway-copy{padding:29px 19px 25px 29px;display:flex;flex-direction:column;justify-content:center;min-width:0}.esa-doorway-overline{color:var(--acid);font-size:8px;letter-spacing:.16em;font-weight:750}.esa-doorway-copy strong{font-size:clamp(28px,3.2vw,48px);letter-spacing:-.05em;margin:5px 0 1px;line-height:1}.esa-doorway-copy strong em{font-family:var(--serif);font-weight:400}.esa-doorway-copy>span:last-child{color:#c7d8c9;line-height:1.5;font-size:12px}.esa-doorway-arrow{display:flex;align-items:end;justify-content:end;padding:0 23px 23px 0}.esa-doorway-arrow .arrow{height:36px;width:36px;border:1px solid #c9d6c3;border-radius:50%;padding:9px;transition:background .25s,color .25s,transform .3s}.esa-doorway-card:hover .esa-doorway-arrow .arrow{background:var(--acid);color:var(--deep);transform:rotate(45deg)}
@media(max-width:900px){.esa-doorway-inner{grid-template-columns:1fr;gap:22px}.esa-doorway-heading{display:flex;justify-content:space-between;gap:20px;align-items:baseline}.esa-doorway-heading p{margin:0;text-align:right}.esa-doorway-card{max-width:100%}}
@media(max-width:540px){.esa-doorway{padding-bottom:74px}.esa-doorway-heading p{font-size:17px;max-width:150px}.esa-doorway-label{font-size:9px}.esa-doorway-card{height:134px;grid-template-columns:120px minmax(0,1fr) 43px}.esa-doorway-mark img{width:88%}.esa-doorway-copy{padding:19px 4px 19px 15px}.esa-doorway-overline{font-size:7px}.esa-doorway-copy strong{font-size:31px}.esa-doorway-copy>span:last-child{font-size:10px}.esa-doorway-arrow{padding:0 7px 14px 0}.esa-doorway-arrow .arrow{width:27px;height:27px;padding:6px}}
@media(prefers-reduced-motion:reduce){.esa-contour,.esa-doorway-mark img,.esa-doorway-card{transition:none}}


/* Contact chapter — Revision 11. Preserves the original yellow ending. */
.contact-chapter{color:#113b2e;padding:clamp(76px,9vw,124px) 0 58px;}
.contact-chapter .contact-headline-grid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(220px,.7fr);gap:25px;align-items:end;margin-bottom:clamp(36px,5vw,70px)}
.contact-chapter h2{margin:33px 0 0;max-width:1060px}
.contact-intro{font-family:var(--serif);font-style:italic;font-size:clamp(20px,2.5vw,31px);line-height:1.24;max-width:330px;margin:0 0 6px}
.contact-actions{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:12px}
.contact-method{min-height:194px;text-decoration:none;color:#143a2c;border:1px solid #3f522e75;border-radius:3px;padding:24px 22px 20px;display:flex;flex-direction:column;justify-content:space-between;gap:30px;position:relative;isolation:isolate;overflow:hidden;transition:transform .32s cubic-bezier(.2,.7,.1,1),background .3s,border-color .3s,box-shadow .3s}
.contact-method:hover,.contact-method:focus-visible{transform:translateY(-5px);outline-offset:4px}
.contact-primary{background:#093b2d;color:#fff;border-color:#093b2d}
.contact-primary:hover,.contact-primary:focus-visible{background:#082f24;box-shadow:0 18px 30px #12402a30}
.contact-secondary:hover,.contact-secondary:focus-visible{background:#ffdd5e;border-color:#123c2e}
.contact-method-top,.contact-method-bottom{display:flex;align-items:center;justify-content:space-between;gap:12px}
.contact-method-top{align-items:flex-start}
.contact-icon{width:37px;height:37px;display:grid;place-items:center;border:1px solid currentColor;border-radius:50%;opacity:.92;flex-shrink:0}
.contact-icon svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linejoin:round;stroke-linecap:round}
.contact-number{font-size:9px;letter-spacing:.12em;line-height:1.3;text-align:right;font-weight:800;opacity:.78}
.contact-method-bottom strong{display:block;font-size:clamp(18px,2vw,25px);letter-spacing:-.045em;line-height:1.08}
.contact-method-bottom small{display:block;font-size:clamp(10px,1vw,12px);margin-top:9px;opacity:.78;white-space:normal;overflow-wrap:anywhere;letter-spacing:.01em}
.contact-arrow{width:36px;height:36px;border:1px solid currentColor;border-radius:50%;display:grid;place-items:center;flex-shrink:0;transition:transform .25s}
.contact-arrow .arrow{width:17px;height:17px}
.contact-method:hover .contact-arrow{transform:translate(2px,-2px)}
.contact-bottom-note{display:flex;justify-content:space-between;gap:16px;border-top:1px solid #113b2e66;margin-top:28px;padding-top:17px;font-size:9px;font-weight:800;letter-spacing:.14em;line-height:1.8}
.case-contact-invite{font-family:var(--serif);font-size:clamp(18px,2vw,26px);margin:18px 0 8px}
.case-contact-inline{font-family:var(--sans);display:inline-flex;align-items:center;gap:4px;font-size:12px;font-weight:750;letter-spacing:.1em;text-decoration:underline;text-underline-offset:4px}
.case-contact-inline .arrow{width:16px;height:16px}
@media(max-width:950px){.contact-chapter .contact-headline-grid{grid-template-columns:1fr;gap:15px}.contact-intro{max-width:560px}.contact-actions{grid-template-columns:1fr 1fr}.contact-primary{grid-column:span 2;min-height:175px}.contact-method{min-height:180px}}
@media(max-width:720px){.contact-chapter{padding:77px 0 55px}.contact-chapter h2{font-size:clamp(62px,14vw,106px);margin-top:25px}.contact-intro{font-size:24px;line-height:1.35}.contact-actions{grid-template-columns:1fr;gap:10px}.contact-primary{grid-column:auto}.contact-method{min-height:142px;padding:17px 18px 18px;gap:18px}.contact-primary{min-height:156px}.contact-method-bottom strong{font-size:23px}.contact-method-bottom small{font-size:12px}.contact-bottom-note{display:block;font-size:8px;line-height:1.8}.contact-bottom-note span{display:block}.contact-bottom-note span+span{margin-top:7px}}
@media(prefers-reduced-motion:reduce){.contact-method,.contact-arrow{transition:none}.contact-method:hover{transform:none}}
/* R22: a direct entry to the new full Work collection while preserving the homepage. */
.ar-cinema-cta{margin:18px 0 32px;padding:22px 28px;display:flex;align-items:center;justify-content:space-between;gap:20px;border:1px solid #728a78;background:linear-gradient(110deg,#0b3025,#234637)}.ar-cinema-cta>div{display:grid;gap:7px}.ar-cinema-cta>div span{color:#edcd75;letter-spacing:.1em;font-size:10px}.ar-cinema-cta strong{font-size:clamp(16px,2vw,25px);letter-spacing:-.02em;color:#faf5e5}.ar-cinema-cta>a{border:1px solid #ddca90;padding:15px 20px;color:#f8eac2;font-size:11px;letter-spacing:.06em;font-weight:800;white-space:nowrap}.ar-cinema-cta>a span{margin-left:12px}.ar-cinema-cta>a:hover{background:#e7c46a;color:#11241b}@media(max-width:720px){.ar-cinema-cta{flex-direction:column;align-items:flex-start;padding:20px}.ar-cinema-cta>a{font-size:10px}}
