:root{--bg:#080909;--surface:#101315;--text:#f1f0ed;--muted:#a4afb4;--dim:#88959d;--line:#ffffff24;--pad:clamp(22px,4.6vw,88px);--ease:cubic-bezier(.22,1,.36,1);--duration:850ms}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px;background:var(--bg)}body{margin:0;background:var(--bg);color:var(--text);font:15px/1.65 'Helvetica Neue',Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}button,input,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer;color:inherit}a{color:inherit;text-decoration:none}button{border:0;background:none}img,video,canvas{display:block;max-width:100%}button:disabled{cursor:default;opacity:.4}[hidden]{display:none!important}::selection{background:#bcced6;color:#080909}:focus-visible{outline:2px solid #d9edf6;outline-offset:6px}.skip{position:fixed;top:-70px;left:20px;z-index:999;background:white;color:black;padding:12px}.skip:focus{top:12px}.site-header{height:78px;position:fixed;inset:0 0 auto;z-index:60;display:flex;align-items:center;gap:42px;padding:0 var(--pad);transition:background .35s,border-color .35s;border-bottom:1px solid transparent;background:linear-gradient(#0005,transparent)}.site-header.scrolled{background:#080909ed;border-bottom-color:#ffffff0a;backdrop-filter:blur(14px)}.brand{display:block;margin-right:auto;flex-shrink:0}.brand img{width:60px;height:35px;object-fit:contain}.site-header nav{display:flex;gap:46px;font-size:10px;letter-spacing:.14em;text-transform:uppercase;font-weight:600}.site-header nav a{position:relative;padding:12px 0}.site-header nav a:after{content:'';position:absolute;height:1px;background:var(--text);inset:auto 0 3px;transform:scaleX(0);transform-origin:left;transition:transform .45s var(--ease)}.site-header nav a:hover:after,.site-header nav a.active:after{transform:scaleX(1)}.header-dash{height:1px;width:32px;background:#a3aaad}.micro,.section-no{font-size:10px;font-weight:500;letter-spacing:.13em;text-transform:uppercase;color:var(--muted)}
.hero{height:178vh;position:relative;background:#020303}.hero-sticky{position:sticky;top:0;height:100svh;min-height:600px;overflow:hidden}.hero-poster,.hero-video,#heroCanvas{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.6) contrast(1.07);transform:scale(1.03)}#heroCanvas{opacity:0;transition:opacity .28s ease}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,#020507ba,transparent 83%),linear-gradient(0deg,#05080999,transparent 52%)}.hero-copy{position:absolute;left:var(--pad);top:50%;transform:translateY(-48%);z-index:2;max-width:650px}.hero-copy h1{font-size:clamp(64px,8vw,126px);font-weight:600;line-height:.95;letter-spacing:-.065em;margin:30px 0 30px}.hero-copy h1 span{color:var(--text)}.role{font-size:11px;letter-spacing:.07em;color:#c5cccf}.film-trigger{display:flex;align-items:center;gap:16px;margin-top:40px;padding:5px 0;text-align:left;font-size:10px;letter-spacing:.12em;text-transform:uppercase}.film-trigger small{display:block;font-size:9px;letter-spacing:.02em;color:var(--muted);margin-top:3px;text-transform:none}.play-circle{width:46px;height:46px;border:1px solid #ffffff66;border-radius:50%;display:grid;place-items:center;font-size:10px;transition:background .4s,transform .5s var(--ease)}.film-trigger:hover .play-circle{background:#fff;color:#070809;transform:scale(1.07)}.scroll-cue{position:absolute;right:var(--pad);bottom:8vh;display:flex;gap:28px;align-items:center;font-size:10px;letter-spacing:.1em;text-transform:uppercase}.scroll-cue span{display:block;transition:transform .5s var(--ease)}.scroll-cue:hover span{transform:translateY(7px)}.hero-pause{position:absolute;left:var(--pad);bottom:8vh;font-size:12px;padding:8px 12px;border:1px solid #ffffff38;z-index:3;min-width:38px}.hero-progress{position:absolute;bottom:0;height:1px;background:#ffffff20;width:100%}.hero-progress span{display:block;width:100%;height:1px;transform:scaleX(0);transform-origin:left;background:#d0dfe6}
.section-pad{padding:96px var(--pad) 90px}.section-heading{display:flex;justify-content:space-between;gap:24px;align-items:center;margin-bottom:46px}.section-heading>div:first-child{display:flex;gap:28px;align-items:baseline}.section-heading h2{font-size:clamp(44px,5vw,76px);line-height:1.1;font-weight:600;letter-spacing:-.06em;margin:0}.section-heading h2 span{color:#829199}.rail-controls{display:flex;align-items:center;gap:10px;flex-shrink:0}.rail-controls>span{font-size:10px;color:var(--muted);margin-right:16px;font-variant-numeric:tabular-nums}.arrow{width:44px;height:44px;border:1px solid var(--line);font-size:20px;transition:background .3s,color .3s,border-color .3s}.arrow:not(:disabled):hover{background:var(--text);color:var(--bg);border-color:var(--text)}.showcase-rail{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 50px)/6);gap:10px;list-style:none;margin:0;padding:8px 0 14px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain}.showcase-rail::-webkit-scrollbar{display:none}.showcase-rail>li{min-width:0;scroll-snap-align:start}.project-card{position:relative;display:block;width:100%;height:clamp(400px,36.4vw,630px);padding:0;text-align:left;border:1px solid #ffffff14;overflow:hidden;background:#030404}.card-visual{position:absolute;inset:0;overflow:hidden;transform:perspective(1100px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .7s var(--ease)}.project-card img{position:absolute;inset:-4%;width:108%;height:108%;max-width:none;object-fit:cover;transform:translate3d(var(--mx,0px),var(--my,0px),0) scale(1);filter:brightness(.8) saturate(.95);transition:transform .9s var(--ease),filter .6s}.card-overlay{position:absolute;inset:0;background:linear-gradient(180deg,#0002,transparent 30%,#0004 65%,#000e);pointer-events:none}.card-light{position:absolute;inset:0;opacity:0;background:radial-gradient(260px circle at var(--hx,50%) var(--hy,50%),#fff2,transparent 70%);mix-blend-mode:screen;transition:opacity .65s;pointer-events:none}.card-no{position:absolute;top:14px;left:16px;z-index:1;font-size:clamp(34px,3.7vw,55px);letter-spacing:-.06em;line-height:1.25;font-weight:300;color:#eee9}.card-meta{position:absolute;left:17px;right:14px;bottom:61px;display:flex;flex-direction:column;gap:6px;z-index:1}.card-meta strong{font-size:clamp(13px,1.14vw,18px);letter-spacing:-.02em;line-height:1.25;font-weight:600}.card-meta em{font-size:9px;color:#b3bcc1;font-style:normal;line-height:1.45}.card-view{position:absolute;inset:auto 17px 24px;display:flex;align-items:center;justify-content:space-between;font-size:8px;text-transform:uppercase;letter-spacing:.06em;z-index:1;color:#d4dce0}.card-view span{font-size:19px;line-height:1;transition:transform .5s var(--ease)}.project-card:hover .card-light{opacity:1}.project-card:hover img,.project-card:focus-visible img{filter:brightness(.97) saturate(1);transform:translate3d(var(--mx,0px),var(--my,0px),0) scale(1.055)}.project-card:hover .card-view span{transform:translate(3px,-3px)}.project-card[aria-expanded=true]{border-color:#bec9cf}.project-card[aria-expanded=true]:after{content:'';position:absolute;bottom:0;left:0;width:100%;height:2px;background:#e3ebed}.rail-foot{display:flex;justify-content:space-between;color:var(--dim);font-size:10px;margin-top:9px}.js .reveal{opacity:0;transform:translateY(30px);transition:transform var(--duration) var(--ease) var(--delay,0ms),opacity var(--duration) ease var(--delay,0ms)}.js .reveal.is-visible{transform:none;opacity:1}
.project-stage{margin-top:66px;padding-top:24px;border-top:1px solid var(--line);scroll-margin-top:100px}.stage-toolbar{display:flex;justify-content:space-between;align-items:center;padding-bottom:18px;font-size:10px;color:var(--muted)}.plain-button{font-size:10px;color:var(--muted);border-bottom:1px solid transparent;padding:5px 0}.plain-button:hover{color:white;border-bottom-color:#ffffff80}.case-hero{position:relative;height:min(70vh,800px);min-height:520px;overflow:hidden;background:#030505}.case-poster,.case-film{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.case-film{z-index:1}.case-hero:after{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(90deg,#030506ec 0%,#03050694 31%,#03050615 74%),linear-gradient(0deg,#02030455,transparent 60%)}.case-copy{position:absolute;left:38px;bottom:44px;width:43%;max-width:540px;z-index:3}.case-copy h3{font-size:clamp(42px,4.8vw,74px);line-height:.98;font-weight:500;letter-spacing:-.055em;margin:24px 0 14px}.case-meta{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:#c8d1d5}.case-copy>p:not(.micro){font-size:15px;line-height:1.65;color:#c0c9ce;max-width:375px;margin-top:22px}.case-copy .film-trigger{margin-top:28px}.media-pending{display:inline-block;font-size:10px;color:#9eaab0;border-top:1px solid #ffffff35;padding-top:15px;margin-top:12px}.case-hero.is-opening{animation:openCurtain .95s var(--ease) both}.case-hero.is-opening .case-copy{animation:copyEntrance 1s var(--ease) .12s both}@keyframes openCurtain{from{clip-path:inset(0 0 18% 0);opacity:0;transform:translateY(18px)}to{clip-path:inset(0);opacity:1;transform:none}}@keyframes copyEntrance{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
.case-stills{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:12px}.case-stills figure{margin:0;min-width:0}.image-open{display:block;position:relative;width:100%;height:255px;padding:0;background:#101113;overflow:hidden}.image-open img{width:100%;height:100%;object-fit:cover;transform:translateY(var(--py,0px)) scale(1.07);transition:transform .7s var(--ease)}.image-open:hover img{transform:translateY(var(--py,0px)) scale(1.11)}.image-open span{position:absolute;bottom:14px;right:14px;font-size:16px;line-height:32px;text-align:center;width:32px;height:32px;background:#0004;border:1px solid #ffffff4a;border-radius:50%;transition:background .4s}.image-open:hover span{background:#e6ecec;color:#080909}.case-stills figcaption{font-size:10px;color:var(--dim);margin-top:12px}.project-story{display:grid;grid-template-columns:1fr 1fr;gap:7vw;padding:80px 0 50px;margin-top:62px;border-top:1px solid var(--line)}.story-title{align-self:start;position:sticky;top:132px}.story-title .micro{font-size:9px}.story-title h4{font-size:clamp(40px,4.3vw,65px);line-height:1.06;letter-spacing:-.055em;font-weight:400;margin:30px 0}.story-title>p:last-child{font-size:10px;color:var(--dim)}.story-content{color:var(--muted);font-size:15px;line-height:1.85}.story-content h5{font-size:10px;letter-spacing:.09em;text-transform:uppercase;font-weight:500;color:#bfc9ce;margin:0 0 12px}.story-content p{margin:0 0 27px}.credits{display:grid;grid-template-columns:1fr 1fr;gap:26px 35px;margin:36px 0 0;padding-top:25px;border-top:1px solid var(--line)}.credits div{min-width:0}.credits dt{font-size:9px;letter-spacing:.09em;color:var(--dim);text-transform:uppercase}.credits dd{font-size:12px;margin:5px 0 0;color:#d1d9dd}.provisional{font-size:11px;line-height:1.6;margin:25px 0 0;padding:12px 0;border-top:1px solid var(--line);color:#aeb6ba}.case-footer{display:flex;justify-content:space-between;align-items:center;gap:25px;padding:28px 0;border-top:1px solid var(--line)}.behance{font-size:11px;display:inline-flex;gap:20px;align-items:center;border-bottom:1px solid #ffffff40}.behance-pending{font-size:10px;color:var(--dim)}
.about{border-top:1px solid var(--line);background:#090b0b}.about-grid{display:grid;grid-template-columns:1fr .9fr;align-items:center;gap:7vw}.about-copy{max-width:590px}.about-copy h3{font-size:clamp(42px,4.5vw,72px);line-height:1.04;letter-spacing:-.05em;font-weight:500;margin:28px 0 24px}.about-copy>p:not(.micro):not(.role){font-size:15px;color:var(--muted);line-height:1.8}.about-copy .role{font-size:10px;line-height:1.7;margin-bottom:30px}.clients{border-top:1px solid var(--line);margin-top:37px;padding-top:20px}.clients>p:last-child{font-size:11px;font-weight:500}.clients span{margin:0 10px;color:#5b6972}.portrait{margin:0;position:relative;height:640px;overflow:hidden}.portrait img{width:100%;height:100%;object-fit:cover;object-position:50% 20%;filter:grayscale(1) brightness(.45) contrast(1.18)}.portrait:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#090b0b,transparent 40%),linear-gradient(0deg,#090b0b,transparent 40%)}
.contact{border-top:1px solid var(--line);padding-bottom:34px;background:radial-gradient(ellipse at 90% 90%,#16222970,transparent 55%)}.contact-grid{display:grid;grid-template-columns:1fr 1.15fr;gap:8vw}.contact-copy h3{font-weight:500;letter-spacing:-.055em;font-size:clamp(40px,4.3vw,65px);line-height:1.05;margin:0 0 35px}.contact-copy h3 span{font-weight:300;font-size:.7em;color:#85969f;margin-left:16px}.contact-copy p{font-size:14px;color:var(--muted);line-height:1.8}.contact-copy .prototype-note{font-size:11px;color:var(--dim);margin-top:32px;max-width:300px}.contact-form{display:grid;grid-template-columns:1fr 1fr;gap:24px}.contact-form label{font-size:12px;line-height:1.3;display:flex;flex-wrap:wrap;gap:8px;color:#b9c2c6}.contact-form label span{color:var(--dim)}input,textarea{width:100%;color:var(--text);background:transparent;border:0;border-bottom:1px solid #ffffff4a;border-radius:0;outline:none;padding:10px 0;min-height:42px;transition:border-color .25s}input:focus,textarea:focus{border-color:#e7f2f5}textarea{border:1px solid #ffffff4a;resize:vertical;padding:14px;min-height:140px}label.message{grid-column:1/-1}.form-privacy{grid-column:1/-1;color:var(--dim);font-size:10px;margin:0}.send{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);font-size:11px;letter-spacing:.04em;text-transform:uppercase;padding:16px 0;transition:padding .4s var(--ease),color .4s}.send span:last-child{font-size:23px}.send:hover{padding-left:10px;padding-right:10px;color:#daeaf1}.form-status{font-size:12px;grid-column:1/-1;margin:0;color:#c5d0d6;min-height:22px}.honeypot{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}footer{display:flex;justify-content:space-between;align-items:center;gap:25px;margin-top:90px;padding-top:28px;border-top:1px solid var(--line);font-size:9px;letter-spacing:.04em;color:var(--dim)}#socialLinks{display:flex;gap:25px}.motion-control{position:fixed;z-index:70;bottom:16px;left:16px;font-size:10px;max-width:calc(100vw - 32px)}.motion-toggle{display:flex;align-items:center;gap:12px;border:1px solid #ffffff30;background:#101619ed;backdrop-filter:blur(14px);padding:14px;font-size:10px}.status-dot{width:5px;height:5px;border-radius:50%;background:#ccdde3}#motionLabel{color:#a9bdc8}.motion-panel{position:absolute;bottom:55px;left:0;width:290px;background:#11171af7;border:1px solid var(--line);padding:19px}.motion-panel p{margin:0 0 12px}.motion-panel small{display:block;color:#93a4ae;font-size:10px;line-height:1.65;margin-top:16px}.motion-panel>div{display:flex;gap:5px}.motion-panel button{border:1px solid var(--line);padding:8px;font-size:10px}.motion-panel button[aria-pressed=true]{background:#dce4e8;color:#05090b}.media-dialog,.image-dialog{padding:0;border:1px solid #ffffff27;background:#07090b;color:var(--text);width:min(1240px,94vw);max-height:92vh;overflow:auto}.media-dialog::backdrop,.image-dialog::backdrop{background:#000e;backdrop-filter:blur(10px)}.dialog-close{position:absolute;right:12px;top:10px;width:42px;height:42px;z-index:5;font-size:26px;background:#050708bf;border:1px solid #ffffff44;border-radius:50%}.media-dialog>p{font-size:11px;margin:22px 70px 22px 24px;color:var(--muted)}.media-dialog video{width:100%;max-height:76vh}.image-dialog img{max-height:80vh;width:100%;object-fit:contain}.image-dialog>p{font-size:12px;margin:14px 24px;color:var(--muted)}body.modal-open{overflow:hidden}
body[data-motion=soft]{--duration:600ms}body[data-motion=soft] .hero{height:135vh}body[data-motion=soft] .card-visual,body[data-motion=soft] .project-card img{transform:none!important}body[data-motion=soft] .card-light{display:none}body[data-motion=off] .hero{height:100svh;min-height:600px}body[data-motion=off] .hero-sticky{position:relative}body[data-motion=off] *{animation:none!important;transition:none!important;scroll-behavior:auto!important}body[data-motion=off] .reveal{opacity:1!important;transform:none!important}body[data-motion=off] .card-visual,body[data-motion=off] .project-card img,body[data-motion=off] .image-open img{transform:none!important}body[data-motion=off] .card-light{display:none}body[data-motion=off] #heroCanvas{opacity:0!important}body[data-motion=off] .story-title{position:static}
@media(min-width:1800px){.projects,.about,.contact{max-width:2000px;margin:auto}.project-card{height:640px}.image-open{height:330px}}
@media(max-width:1100px){.showcase-rail{grid-auto-columns:calc((100% - 20px)/3)}.project-card{height:500px}.case-copy{width:50%}.case-copy h3{font-size:50px}.image-open{height:210px}.about-grid{gap:4vw}.portrait{height:580px}.contact-grid{gap:5vw}.clients>p:last-child{line-height:2}.site-header nav{gap:28px}}
@media(max-width:700px){html{scroll-padding-top:84px}.site-header{height:68px;gap:12px}.brand img{width:47px;height:28px}.site-header nav{gap:17px;font-size:9px;letter-spacing:.06em}.header-dash{display:none}.hero{height:145svh}.hero-sticky{height:100svh;min-height:580px}.hero-copy{left:var(--pad);top:48%;max-width:80%}.hero-copy h1{font-size:clamp(64px,16vw,88px);line-height:.96;margin:22px 0 25px}.hero-copy .micro{font-size:9px}.hero-copy .role{font-size:9px}.hero-shade{background:linear-gradient(90deg,#03070bae,#03070b30),linear-gradient(0deg,#03070b9a,transparent 65%)}.scroll-cue{font-size:8px;bottom:11vh;gap:16px}.hero-pause{bottom:11vh}.film-trigger{margin-top:30px}.section-pad{padding-top:64px;padding-bottom:64px}.section-heading{gap:12px;flex-wrap:wrap;margin-bottom:30px}.section-heading>div:first-child{gap:14px}.section-heading h2{font-size:44px}.section-no{font-size:9px}.rail-controls{margin-left:auto;gap:6px}.rail-controls>span{font-size:9px;margin-right:6px}.arrow{width:38px;height:38px}.showcase-rail{grid-auto-columns:78%;gap:10px}.project-card{height:465px}.card-no{font-size:45px}.card-meta strong{font-size:20px}.card-meta em{font-size:10px}.card-view{font-size:9px}.card-meta{bottom:65px}.rail-foot{font-size:9px;gap:20px}.project-stage{margin-top:44px;scroll-margin-top:82px}.case-hero{height:620px;min-height:0}.case-copy{left:22px;right:22px;bottom:30px;width:auto;max-width:none}.case-copy h3{font-size:47px;margin-top:15px}.case-copy>p:not(.micro){font-size:14px;max-width:90%;margin-top:16px}.case-meta{font-size:9px}.case-poster,.case-film{object-position:65% center}.case-hero:after{background:linear-gradient(0deg,#020405fc 0%,#020405c0 25%,#02040515 86%)}.case-copy .film-trigger{margin-top:18px}.case-stills{grid-template-columns:1fr;gap:22px}.image-open{height:240px}.case-stills figcaption{margin-top:8px}.project-story{grid-template-columns:1fr;gap:28px;padding-top:40px;margin-top:42px}.story-title{position:static}.story-title h4{font-size:44px;line-height:1.05;margin:18px 0}.story-content{font-size:14px;line-height:1.85}.story-content h5{font-size:10px}.credits{gap:23px;grid-template-columns:1fr 1fr}.credits dd{font-size:12px}.case-footer{align-items:flex-start;flex-direction:column;gap:18px}.about-grid,.contact-grid{grid-template-columns:1fr;gap:30px}.about-copy h3{font-size:47px}.portrait{height:450px;margin-top:20px}.contact-copy h3{font-size:45px}.contact-form{gap:22px 16px}.contact-form label{font-size:11px}footer{flex-direction:column;align-items:flex-start;margin-top:65px;margin-bottom:36px;gap:14px}.motion-control{bottom:10px;left:10px}.motion-toggle{padding:10px 12px;font-size:9px}.motion-panel{bottom:46px}.stage-toolbar{font-size:9px}.media-dialog{width:96vw}.media-dialog>p{font-size:10px;margin-left:15px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}.reveal{opacity:1!important;transform:none!important}.hero{height:100svh!important}.story-title{position:static}}

/* ── V3.3.1 : controlled motion / blue-lens interaction / inline project player ── */
:root{--accent:#4c87ff;--accent-light:#b0d4ff}
.filter-definitions{position:absolute;overflow:hidden;pointer-events:none}
.site-header{transition:transform .42s var(--ease),background .35s,border-color .35s;will-change:transform}
.site-header.is-hidden{transform:translateY(-112%);pointer-events:none}
.site-header:focus-within{transform:none!important;pointer-events:auto}
.showcase-rail{padding-top:8px;padding-bottom:20px;overflow-anchor:none}
.showcase-cell{min-width:0;perspective:1000px}
.js .showcase-cell>.project-card{opacity:0;transform:translate3d(-48px,76px,0) rotate(.9deg);transform-origin:50% 100%;transition:transform 1050ms var(--ease) var(--entry-delay,0ms),opacity 800ms ease var(--entry-delay,0ms),border-color .25s,box-shadow .4s}
.js .showcase-cell.is-placed>.project-card{opacity:1;transform:translate3d(0,0,0) rotate(0deg)}
.project-card{isolation:isolate;border-color:#ffffff25}
.card-visual{transform:none!important}
.project-card img{transition:transform 950ms var(--ease),filter .45s,opacity .5s;transform:translate3d(var(--mx,0px),calc(var(--my,0px) + var(--scroll-parallax,0px)),0) scale(1.025)}
/* V3.3.1: original colours stay visible; only the hovered/focused image is tinted. */
.project-card .card-visual .card-image{filter:none}
.project-card .card-tone{filter:var(--tritone-filter) brightness(1.03) contrast(1.06);opacity:0}
.card-overlay{z-index:1;background:linear-gradient(180deg,#0002 0%,transparent 30%,#0003 55%,#000f 100%)}
.card-light{z-index:2;background:radial-gradient(230px circle at var(--hx,50%) var(--hy,50%),#c1e4ff66,transparent 75%);transition:opacity .35s}
.card-no,.card-meta,.card-view{z-index:3}
.card-no{font-weight:400;transition:color .4s,transform .7s var(--ease)}
.card-meta{transition:transform .7s var(--ease)}
.card-view{font-weight:500;letter-spacing:.065em}
.card-view .card-plus{font-size:25px;font-weight:300;transform:none;transition:transform .8s var(--ease)}
.project-card:is(.is-pointed,:focus-visible,[aria-expanded=true]){border-color:var(--accent);box-shadow:inset 0 0 0 1px #4c87ff55,0 0 24px #1359cf24}
.project-card:is(.is-pointed,:focus-visible) .card-tone{opacity:.97}
.project-card:is(.is-pointed,:focus-visible) img{transform:translate3d(var(--mx,0px),calc(var(--my,0px) + var(--scroll-parallax,0px)),0) scale(1.09)}
.project-card:is(.is-pointed,:focus-visible) .card-light{opacity:.9}
.project-card:is(.is-pointed,:focus-visible) .card-no{color:white;transform:translateY(-2px)}
.project-card:is(.is-pointed,:focus-visible) .card-meta{transform:translateY(-4px)}
.project-card:is(.is-pointed,:focus-visible) .card-plus{transform:rotate(180deg)}
.project-card[aria-expanded=true]:after{background:var(--accent);z-index:4}
/* Neighbouring cards retain their original colours and brightness. */
/* A native pointer remains available unless this fine-pointer enhancement is active. */
.project-cursor{position:fixed;left:0;top:0;width:0;height:0;z-index:200;pointer-events:none;opacity:0;transition:opacity .18s;will-change:transform;mix-blend-mode:normal}
.project-cursor.is-visible{opacity:1}
.cursor-cross{position:absolute;inset:-12px;width:24px;height:24px;filter:drop-shadow(0 0 9px #5e9aff);animation:plusOrbit 7s linear infinite;animation-play-state:paused}
.project-cursor.is-visible .cursor-cross{animation-play-state:running}
.cursor-cross:before,.cursor-cross:after{content:'';position:absolute;background:#f1f8ff;border-radius:1px}
.cursor-cross:before{width:24px;height:1.5px;left:0;top:11px}
.cursor-cross:after{width:1.5px;height:24px;left:11px;top:0}
.cursor-orbit{position:absolute;inset:-24px;width:48px;height:48px;border:1px solid #b9d9ff50;border-radius:50%;background:#06193618;transition:transform .4s var(--ease);transform:scale(.6)}
.project-cursor.is-visible .cursor-orbit{transform:scale(1)}
.custom-cursor-active .project-card,.custom-cursor-active .project-card *{cursor:none}
@keyframes plusOrbit{to{transform:rotate(360deg)}}
.project-stage{overflow-anchor:none;scroll-margin-top:100px}
.project-stage.is-open .case-hero{animation:stageAppear .6s var(--ease) both}
.project-stage.is-open .case-copy{animation:stageCopy .65s var(--ease) .1s both}
@keyframes stageAppear{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes stageCopy{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.case-copy h3{font-weight:600}
.case-hero .case-film{display:none;z-index:5;object-fit:contain;background:#030507;outline-offset:-4px}
.case-hero.is-playing .case-film{display:block}
.case-hero.is-playing .case-copy{visibility:hidden;pointer-events:none}
.case-hero.is-playing:after{opacity:0}
.case-play .play-circle{width:60px;height:60px;border-color:#d8ebffaa;background:#0017382b}
.case-play:hover .play-circle{color:#061425;background:var(--accent-light);border-color:var(--accent-light)}
.player-status{display:flex;align-items:center;justify-content:space-between;gap:22px;padding:14px 0;border-bottom:1px solid var(--line);color:var(--muted);font-size:11px}
.player-status p{margin:0}
.back-scroll-hint{display:flex;align-items:center;justify-content:space-between;font-size:10px;color:#8c9ca5;padding:0 0 6px;margin:14px 0}
.case-stills{margin-top:12px}
.behance-wrap{display:flex;flex-direction:column;gap:7px;align-items:flex-start}
.behance{padding:0 0 7px;font-weight:500;border-bottom-color:#587caa;transition:color .3s,border-color .3s;font-size:11px}
.behance:hover{color:var(--accent-light);border-bottom-color:var(--accent)}
.behance span{display:inline-block;transition:transform .4s var(--ease)}
.behance:hover span{transform:translate(3px,-3px)}
.behance-wrap small{color:var(--dim);font-size:9px}
.image-nav{display:flex;justify-content:center;align-items:center;gap:28px;padding:6px 20px 18px}
.image-nav button{border:1px solid var(--line);width:42px;height:36px;font-size:19px}
.image-nav span{font-size:11px;color:var(--muted)}
.about{background:var(--bg)}
.portrait{background:var(--bg)}
.portrait img{object-fit:contain;object-position:50% 100%;filter:grayscale(1) brightness(.78) contrast(1.02);mask-image:linear-gradient(0deg,transparent,#000 16%,#000 94%,transparent);-webkit-mask-image:linear-gradient(0deg,transparent,#000 16%,#000 94%,transparent)}
.portrait:after{background:linear-gradient(90deg,var(--bg),transparent 12%,transparent 89%,var(--bg)),linear-gradient(0deg,var(--bg),transparent 19%);pointer-events:none}
.replay-reveal{display:block!important;width:100%;margin-top:12px;border:1px solid #6b8bbb77!important;padding:9px!important;text-align:left;color:#d1e4ff}
.site-toast{position:fixed;bottom:80px;left:50%;transform:translate(-50%,12px);z-index:150;max-width:min(90vw,540px);padding:15px 20px;border:1px solid #5d7f9e60;background:#0d141ded;backdrop-filter:blur(14px);box-shadow:0 12px 50px #0007;font-size:12px;line-height:1.6;color:#d1e0ee;opacity:0;pointer-events:none;transition:opacity .25s,transform .25s var(--ease)}
.site-toast.is-visible{opacity:1;transform:translate(-50%,0)}
.footer-behance{padding:0;font:inherit;color:inherit}.footer-behance:hover{color:var(--accent-light)}
.motion-paused *{animation-play-state:paused!important}
body[data-motion=soft] .showcase-cell>.project-card{transition-duration:650ms,500ms,.25s,.4s;transform:translate3d(-20px,34px,0)}
body[data-motion=soft] .showcase-cell.is-placed>.project-card{transform:none}
body[data-motion=soft] .card-light{display:block}
body[data-motion=off] .showcase-cell>.project-card{opacity:1!important;transform:none!important}
body[data-motion=off] .project-cursor{display:none}
@media(hover:none),(pointer:coarse){
 .project-cursor{display:none!important}.custom-cursor-active .project-card,.custom-cursor-active .project-card *{cursor:pointer}
 /* Touch: retain the original colours as well. */
 .project-card:hover .card-light{opacity:0}.project-card:hover .card-view span{transform:none}
 /* The open project is marked by its outline, without a persistent blue tint. */
}
@media(max-width:680px){
 .js .showcase-cell>.project-card{transform:translate3d(-28px,54px,0)}
 .js .showcase-cell.is-placed>.project-card{transform:none}
 .case-hero.is-playing{height:auto;min-height:0;aspect-ratio:16/9}
 .case-play .play-circle{width:52px;height:52px}.player-status{align-items:flex-start;flex-direction:column;gap:8px}
 .back-scroll-hint{line-height:1.6;gap:18px}.portrait{height:470px}.portrait img{object-position:50% 100%}
 .site-toast{bottom:76px;width:calc(100vw - 38px)}
 .case-footer{gap:25px}
}
@media(prefers-reduced-motion:reduce){
 .js .showcase-cell>.project-card{opacity:1!important;transform:none!important}
 .project-cursor{display:none!important}.custom-cursor-active .project-card,.custom-cursor-active .project-card *{cursor:pointer}
}

/* Align below the header without adding two independent header offsets. */
.project-stage{scroll-margin-top:22px}
@media(max-width:680px){
 .project-stage{scroll-margin-top:12px}
 .motion-control{left:auto;right:10px}
 .motion-panel{left:auto;right:0}
 .motion-toggle{gap:8px;padding:9px 11px}
}
/* Explicit specificity keeps the legacy hover filter from overriding the tint. */
.project-card .card-visual .card-tone{filter:var(--tritone-filter) brightness(1.03) contrast(1.06)}
/* Match the portrait's darkest pixels to the page, removing the rectangular edge. */
.portrait{isolation:isolate}.portrait img{mix-blend-mode:lighten}