:root{--blue:#4058ff;--paper:#f4f5f2;--night:#101215;--ink:#16191f}body{overflow-x:clip}header{position:relative;z-index:10;margin:0;padding:24px 5%;background:var(--night);color:#f5f5f2;border-color:#ffffff1c}header .brand{font-size:37px}header .brand:before{content:'✳';font-size:26px;color:#8899ff;margin-right:5px}nav{gap:26px}.nav-contact{border-color:#ffffff55}header #language{background:#202328;color:white;border-color:#ffffff40}header nav a:hover{color:#9aabff}.reading-progress{position:fixed;inset:0 auto auto 0;width:100%;height:3px;transform-origin:left;transform:scaleX(var(--read,0));background:#91a2ff;z-index:100;pointer-events:none}.hero{position:relative;isolation:isolate;background:var(--night);color:#f5f5f2;padding:42px 5% 65px;overflow:hidden;min-height:760px}.eyebrow{color:#aeb3bf;letter-spacing:1.6px}.hero h1{position:relative;z-index:2;font-size:clamp(60px,7.6vw,116px);max-width:1100px;margin:65px 0 50px;pointer-events:none}.title-line{display:block;line-height:1.12}.hero h1 em{color:#9daaff}.hero-bottom{position:relative;z-index:2;border-top:1px solid #ffffff24;padding-top:27px}.hero-bottom .small-note{color:#b5b8c2}.orbit-art{position:absolute;width:460px;height:460px;right:-35px;top:145px;perspective:900px;transform:translate3d(var(--ox,0px),var(--oy,0px),0);pointer-events:none;z-index:0;opacity:.6}.orbit-ring{position:absolute;inset:0;border:1px solid #7089ff;border-radius:50%;box-shadow:inset 0 0 35px #435bff10,0 0 30px #435bff18;transform:rotateX(60deg) rotateY(-20deg)}.ring-two{inset:22px;transform:rotateX(-25deg) rotateY(65deg);border-width:12px;border-color:#4058ff}.ring-three{inset:45px;transform:rotateX(55deg) rotateY(35deg);border-width:2px;border-color:#bac5ff}.orbit-letter{position:absolute;inset:0;display:grid;place-items:center;font:160px Manrope,sans-serif;letter-spacing:-16px;color:#7b8fff}.orbit-coordinate{position:absolute;bottom:0;right:45px;letter-spacing:3px;font-size:12px;color:#9daaff}.projects{position:relative;background:var(--paper);padding-top:100px;padding-bottom:110px;border-radius:30px 30px 0 0;margin-top:-24px;z-index:3}.section-heading h2{font-size:clamp(36px,4.4vw,68px)}.section-heading{margin-bottom:65px}.project-grid{display:flex;flex-direction:column;gap:55px;perspective:1500px}.project{position:relative;background:var(--paper);border-radius:18px;padding:12px;box-shadow:0 20px 60px #131a2910;transform-origin:center top}.preview{border-radius:12px;min-height:520px;padding:36px;transform:perspective(1200px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));transition:transform .35s,box-shadow .35s;transform-style:preserve-3d}.project:hover .preview{transform:perspective(1200px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));box-shadow:0 15px 35px #0002}.preview img{height:116%;top:-8%;transform:translateY(var(--image-y,0px)) scale(1.025);transition:filter .5s}.project:hover img{transform:translateY(var(--image-y,0px)) scale(1.025);filter:brightness(.75)}.mock-title{font-size:clamp(48px,6.2vw,86px);margin:120px 0 35px}.mock-nav{font-size:14px}.mock-nav span,.mock-tag{font-size:14px}.project-caption{padding:24px 15px 14px}.project-caption h3{font-size:28px}.project-caption .pill{font-size:13px}.artisan{min-height:430px;background:#233b31}.artisan .mock-title{font-size:clamp(44px,5.5vw,78px);margin:85px 0 50px}.artisan-detail{font-size:14px}.approach{background:var(--night);color:#f5f5f2;padding-top:110px;padding-bottom:110px;border-radius:28px}.approach .section-label{color:#a6b0ff}.approach .section-heading p,.approach .benefits p{color:#babdc6}.benefits article{border-color:#ffffff30;position:relative;padding:28px 0 15px}.number{font:60px Manrope,sans-serif;color:#8797ff;letter-spacing:-4px;margin-bottom:45px}.benefits article:before{content:'';position:absolute;top:-1px;left:0;right:0;height:2px;background:#8b9cff;transform:scaleX(0);transform-origin:left;transition:transform 1.1s cubic-bezier(.2,.7,.2,1)}.benefits article.is-visible:before{transform:scaleX(1)}.process{padding-top:120px;padding-bottom:120px;position:relative}.steps{position:relative}.steps:before{content:'';position:absolute;left:-22px;top:0;bottom:0;width:2px;background:#dfe2eb}.steps:after{content:'';position:absolute;left:-22px;top:0;bottom:0;width:2px;transform-origin:top;transform:scaleY(var(--step-progress,0));background:var(--blue)}.steps article{padding:32px 0}.about{padding:100px 7%;display:grid;grid-template-columns:.85fr 1fr;gap:10%;align-items:center;background:#e9ebf0;position:relative}.portrait-wrap{position:relative;max-width:530px}.portrait-frame{border-radius:180px 180px 16px 16px;overflow:hidden;aspect-ratio:4/5;background:#d4d6d8}.portrait-frame img{width:100%;height:110%;object-fit:cover;object-position:50% 40%;transform:translateY(var(--portrait-y,-2%));display:block}.portrait-caption{display:flex;justify-content:space-between;font-size:14px;margin-top:18px}.portrait-stamp{position:absolute;right:-35px;bottom:70px;width:115px;height:115px;border-radius:50%;background:var(--blue);color:#fff;display:grid;place-items:center;font:65px Manrope,sans-serif;box-shadow:0 15px 35px #263cc433;transform:rotate(-12deg)}.about-copy h2{font-size:clamp(40px,4.3vw,66px);margin:30px 0}.about-copy h2 em{font-family:Georgia,serif;font-weight:400;color:var(--blue)}.about-copy p{color:#535a68;font-size:17px;line-height:1.8;max-width:510px}.about-copy .about-intro{font-size:24px;color:var(--ink);font-weight:500;margin-bottom:12px}.about-copy .button{margin-top:20px}.contact{position:relative;isolation:isolate;overflow:hidden;background:#3249ed;padding:100px 5%}.contact:before{content:'';position:absolute;z-index:-1;inset:-50%;background:radial-gradient(ellipse at var(--glow-x,65%) var(--glow-y,40%),#7c8dff99,transparent 42%);pointer-events:none}.contact h2{font-size:clamp(40px,6vw,92px)}.contact .button{box-shadow:0 10px 40px #1113}footer{padding:38px 0}.button{transition:transform .35s,box-shadow .35s}.button:hover{box-shadow:0 12px 28px #4058ff44}.button-icon{transition:transform .45s}.button:hover .button-icon{transform:rotate(90deg)}dialog[open]{animation:dialog-enter .35s cubic-bezier(.2,.7,.2,1)}dialog{border-radius:20px;max-height:90dvh;overflow-y:auto}::selection{background:#8fa2ff;color:#111}.motion-toggle{position:fixed;bottom:18px;right:18px;z-index:20;background:#15181fee;border:1px solid #ffffff45;color:#fff;border-radius:30px;padding:10px 14px;font-size:13px;cursor:pointer;box-shadow:0 4px 18px #0002}.motion-toggle:focus-visible{outline:3px solid #a8b4ff;outline-offset:3px}.motion-ready .reveal{transition:opacity .85s cubic-bezier(.2,.7,.2,1),translate .85s cubic-bezier(.2,.7,.2,1);transition-delay:var(--delay,0ms)}.motion-ready .reveal:not(.is-visible){opacity:0;translate:0 35px}.motion-ready .reveal.is-visible{opacity:1;translate:0 0}.motion-ready .title-line{animation:title-enter 1.2s cubic-bezier(.16,1,.3,1) both}.motion-ready .title-line:nth-child(2){animation-delay:.14s}.motion-ready .title-line:nth-child(3){animation-delay:.28s}.motion-ready .ring-one{animation:orbit-one 22s linear infinite}.motion-ready .ring-two{animation:orbit-two 28s linear infinite}.motion-ready .ring-three{animation:orbit-three 34s linear infinite}.motion-paused *, .motion-paused *:before{animation-play-state:paused!important}.motion-paused .reveal{opacity:1!important;translate:0 0!important}.motion-paused .title-line{opacity:1;transform:none;clip-path:none;animation:none!important}.motion-paused html{scroll-behavior:auto}@keyframes title-enter{from{opacity:0;transform:translateY(60px);clip-path:inset(0 0 100% 0)}to{opacity:1;transform:translateY(0);clip-path:inset(0)}}@keyframes orbit-one{to{transform:rotateX(60deg) rotateY(340deg)}}@keyframes orbit-two{to{transform:rotateX(335deg) rotateY(65deg)}}@keyframes orbit-three{to{transform:rotateX(55deg) rotateY(395deg)}}@keyframes dialog-enter{from{opacity:0;transform:translateY(25px) scale(.96)}to{opacity:1;transform:none}}
@media(min-width:1000px) and (prefers-reduced-motion:no-preference){.motion-ready:not(.motion-paused) .project{position:sticky;top:25px}.motion-ready:not(.motion-paused) .project:nth-child(2){top:45px}.motion-ready:not(.motion-paused) .project:nth-child(3){top:65px}.process>div:first-child{align-self:start;position:sticky;top:50px}}
@media(max-width:1000px){nav{gap:16px}.hero{min-height:680px}.orbit-art{right:-140px;width:400px;height:400px;opacity:.35}.hero .small-note{display:none}.about{gap:7%;padding:80px 5%}.portrait-stamp{right:-12px;width:90px;height:90px;font-size:52px}.preview{min-height:460px}.mock-title{margin-top:100px}}
@media(max-width:700px){header{padding:20px 5%}.hero{padding-top:28px;padding-bottom:60px;min-height:600px}.hero h1{font-size:clamp(46px,10.3vw,72px);margin:55px 0 40px}.title-line{line-height:1.18}.orbit-art{top:80px;right:-160px;width:320px;height:320px;opacity:.22}.orbit-letter{font-size:100px}.hero-bottom{padding-top:18px}.hero-bottom p{font-size:17px}.hero .button{margin-top:18px}.projects{padding:60px 4%}.section-heading{margin-bottom:35px}.project-grid{gap:30px}.project{padding:7px;border-radius:16px}.preview{min-height:350px;padding:23px}.mock-title{font-size:47px;margin:85px 0 30px}.mock-nav span{display:none}.project-caption{padding:18px 8px 12px}.project-caption h3{font-size:23px}.project-caption .pill{font-size:12px}.artisan{min-height:315px}.artisan .mock-title{font-size:40px;margin:60px 0 30px}.approach{padding:60px 6%;border-radius:20px}.number{font-size:46px;margin-bottom:20px}.process{padding:65px 7%;gap:40px}.steps{margin-left:15px}.steps:before,.steps:after{left:-15px}.about{grid-template-columns:1fr;gap:50px;padding:65px 7%}.portrait-wrap{max-width:420px;margin:auto;width:100%}.portrait-frame{max-height:490px}.about-copy h2{font-size:45px}.about-copy p{font-size:16px}.contact{padding:65px 6% 80px}.contact h2{font-size:42px}.motion-toggle{font-size:12px;bottom:12px;right:12px}.section-label{font-size:12px}.eyebrow{font-size:10px}html[lang="ms"] .hero h1{font-size:clamp(39px,9vw,60px)}html[lang="zh-Hans"] .hero h1{font-size:clamp(45px,10vw,68px)}html[lang="zh-Hans"] .about-copy h2{line-height:1.4}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.reveal{opacity:1!important;translate:none!important}.project,.preview,.preview img,.portrait-frame img,.orbit-art{transform:none!important}.title-line{opacity:1!important;clip-path:none!important}.steps:after{transform:scaleY(1)}}
html.motion-paused{scroll-behavior:auto}.motion-paused .preview,.motion-paused .preview img,.motion-paused .orbit-art,.motion-paused .portrait-frame img{transform:none!important}

.demo-collection{position:relative;background:#f4f5f2;padding:90px 5%;border-radius:30px 30px 0 0;margin-top:-24px;z-index:3}.demo-filters{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:18px}.demo-filters button{font:inherit;font-size:14px;padding:11px 18px;border-radius:30px;background:transparent;border:1px solid #bfc2c9;color:#1a1e26;cursor:pointer}.demo-filters button[aria-pressed=true]{background:#181b23;color:white;border-color:#181b23}.demo-language-note{font-size:14px;color:#606673;line-height:1.6;margin-bottom:35px}.demo-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px 25px}.demo-tile{min-width:0;display:block}.demo-tile[hidden]{display:none}.demo-image{position:relative;overflow:hidden;aspect-ratio:1.6;border-radius:14px;background:#d3d6dd}.demo-image img{width:100%;height:100%;object-fit:cover;transition:transform .7s,filter .7s}.demo-tile:hover img{transform:scale(1.06);filter:brightness(.8)}.demo-index{position:absolute;left:18px;top:18px;background:#fff;padding:7px 12px;border-radius:20px;font-size:12px;color:#171a20}.demo-open{position:absolute;bottom:18px;right:18px;border-radius:30px;background:#4058ff;color:white;padding:12px 20px;font-size:14px;transition:transform .3s}.demo-tile:hover .demo-open{transform:translateY(-5px)}.demo-info{padding:20px 3px}.demo-info>span{font-size:12px;text-transform:uppercase;letter-spacing:1.4px;color:#636a79}.demo-info h3{font-size:32px;margin:9px 0}.demo-info p{font-size:15px;color:#626978;margin:0;line-height:1.5}@media(max-width:700px){.demo-collection{padding:60px 5%}.demo-grid{grid-template-columns:1fr;gap:22px}.demo-info h3{font-size:27px}.demo-filters button{padding:9px 13px;font-size:13px}.demo-open{font-size:13px}.demo-image{aspect-ratio:1.4}}

.demo-image img{object-position:top}.demo-index{left:12px;top:auto;bottom:18px}.demo-image{border:1px solid #d6d6d6}
