/* Four projects, one restrained typographic and interaction system. */
:root{--ref-ink:#080a0d;--ref-paper:#e8e9e9;--ref-muted:#a4a8b0;--ref-line:rgba(220,230,240,.15);--ref-ease:cubic-bezier(.22,1,.36,1);--ref-gutter:clamp(22px,4.5vw,80px);--system-ink:var(--ref-ink);--system-paper:var(--ref-paper);--system-muted:var(--ref-muted);--system-line:var(--ref-line)}
html{scroll-padding-top:145px}body{font-family:"Avenir Next","Helvetica Neue","PingFang SC","Microsoft YaHei",sans-serif;-webkit-font-smoothing:antialiased}::selection{background:#c8d9ef;color:#080a0d}a,button{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,summary:focus-visible,[data-zoom]:focus-visible{outline:2px solid #b8cee6;outline-offset:6px}p{text-wrap:pretty}h1,h2,h3{text-wrap:balance}
.site-header,.project-header{padding-inline:var(--ref-gutter);transition:background .35s,border-color .35s;border-bottom:1px solid transparent}.site-header.is-scrolled,.project-header.is-scrolled{background:rgba(8,10,13,.91);backdrop-filter:blur(18px);border-color:var(--ref-line)}
.brand-logo,.project-brand img{width:86px}.project-nav{gap:26px;font-size:13px}.project-nav a{min-height:44px;display:flex;align-items:center}.contact-nav{color:var(--ref-paper)}.project-item strong{font-weight:500}.project-item span{line-height:1.65}.project-popover{border-color:var(--ref-line);background:rgba(8,10,13,.97)}
.hero-min{animation:quiet-enter 1.1s var(--ref-ease) .15s both}.hero-min h1{font-weight:450;letter-spacing:.035em}.hero-sub{letter-spacing:.2em}.unfold-toggle{transition:transform .5s var(--ref-ease),background .3s}.unfold-toggle:hover{background:rgba(255,255,255,.09)}.hero-scroll{position:absolute;bottom:42px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:12px;font-size:11px;letter-spacing:.08em;color:#b7b9c4;z-index:3;padding:12px}.hero-scroll i{width:1px;height:30px;background:rgba(255,255,255,.2);overflow:hidden;position:relative}.hero-scroll i:after{content:"";position:absolute;inset:0;background:#d4dce9;animation:scroll-tick 2.4s ease-in-out infinite}.method{grid-template-columns:repeat(4,minmax(0,1fr))}
.system-thesis h2,.system-section-head h2,.system-cta h2,.rexlink-case-content h2,.band-body h2,.evidence-head h2,.index-intro h1{font-family:inherit;font-weight:450;letter-spacing:-.035em;line-height:1.3}.system-thesis h2{font-size:clamp(30px,3.6vw,52px);max-width:720px}.system-thesis{gap:60px;align-items:start;padding-bottom:65px}.system-thesis>p:last-child{font-size:15px;line-height:1.9;max-width:440px}.system-kicker,.folio-label,.band-label,.eyebrow{font:400 11px/1.6 "SF Mono",ui-monospace,monospace;letter-spacing:.09em;color:var(--ref-muted)}.project-system{padding:100px var(--ref-gutter);background:var(--ref-ink)}
.system-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:auto;gap:70px 32px}.system-card,.system-card-featured{grid-row:auto;min-height:0;padding:0 0 22px;border:0;border-bottom:1px solid var(--ref-line);border-radius:0;background:none;overflow:visible;display:grid;grid-template-columns:1fr auto;gap:0 16px}.system-card:after{display:none}.system-card> :not(.system-card-link){grid-column:1/-1}.system-card h3,.system-card:not(.system-card-featured) h3,.system-grid-directory .system-card h2,.system-grid-directory .system-card:not(.system-card-featured) h2{font-size:clamp(28px,3vw,44px);font-weight:450;letter-spacing:-.035em;margin:0;grid-column:1;line-height:1.2}.system-card-order{font-size:11px;letter-spacing:.06em;color:var(--ref-muted);margin:22px 0 12px}.system-card-summary{font-size:14px;line-height:1.9;max-width:480px;margin-top:15px;padding-right:16px}.system-card-link{grid-row:3;grid-column:2;align-self:center;margin:0;font-size:0;font-weight:400}.system-card-link span{font-size:23px;display:grid;place-items:center;border:1px solid var(--ref-line);border-radius:50%;width:46px;height:46px;transition:background .3s,transform .5s var(--ref-ease)}.system-card:hover,.system-card:focus-visible{transform:none}.system-card:hover .system-card-link span{background:#e8e9e9;color:#080a0d;transform:rotate(-35deg)}
.card-art{aspect-ratio:1.5;overflow:hidden;position:relative;background:#111923;display:flex;align-items:center;justify-content:center;border-radius:4px}.card-art img{display:block;width:89%;height:auto;box-shadow:0 18px 45px #0006;transition:transform .9s var(--ref-ease);border-radius:3px}.system-card:hover .card-art img{transform:scale(1.035)}.card-art-alfred{background:radial-gradient(ellipse at 50% 50%,#194b40,#0d1e1d 80%)}.card-art-alfred img{width:36%;transform:translateY(15%);border:4px solid #193831;border-radius:23px}.system-card:hover .card-art-alfred img{transform:translateY(12%) scale(1.025)}.card-art-graph-workbench{background:#263640}.card-art-rna{background:linear-gradient(145deg,#212c33,#10161b)}.card-art-rna .project-monogram{font:300 clamp(60px,9vw,150px)/1 "Avenir Next",sans-serif;letter-spacing:-.08em;color:#adbbc7}.card-art-rna:before,.card-art-rna:after{content:"";position:absolute;width:65%;height:45%;border:1px solid #8a9caa25;transform:rotate(-25deg) skewX(30deg)}.card-art-rna:after{transform:translateY(20px) rotate(-25deg) skewX(30deg)}
.system-section-head h2,.system-cta h2{font-size:clamp(28px,3.2vw,46px)}.progress-evidence{margin-top:120px}.evidence-strip{gap:30px}.evidence-strip strong{font-size:15px;line-height:1.9;font-weight:400}.system-cta{margin-top:120px;padding-block:70px}.system-button{font-size:14px;min-height:48px;border-radius:2px}.system-button-primary{background:#e5e8ed;color:#0a0d13;border-color:#e5e8ed}.system-directory-main{padding:170px var(--ref-gutter) 100px}.index-intro{max-width:1440px;gap:60px;margin-bottom:80px}.index-intro h1{font-size:clamp(40px,5.5vw,76px)}.index-intro>p{font-size:16px;line-height:1.9;max-width:460px}.site-footer{padding-inline:var(--ref-gutter);background:var(--ref-ink)}
.project-page{background:var(--ref-ink)}.project-page:before{opacity:.045}.refined-detail main{overflow:clip}.portfolio-hero{max-width:1600px;margin:auto;padding:180px var(--ref-gutter) 75px;display:grid;grid-template-columns:1.25fr 1fr;gap:80px;align-items:end}.portfolio-title h1{font-size:clamp(60px,8vw,124px);font-weight:450;letter-spacing:-.055em;line-height:.98;margin:30px 0 0;text-wrap:initial}.title-period{color:#a0b4c8}.portfolio-lede{padding-bottom:6px;max-width:440px}.project-discipline{font-size:12px;color:var(--ref-muted);margin:0 0 24px}.portfolio-lede>p:not(.project-discipline){font-size:clamp(22px,2.2vw,32px);font-weight:400;line-height:1.65;letter-spacing:-.02em;margin:0}.hero-actions{display:flex;flex-wrap:wrap;gap:24px;margin-top:35px}.text-action{font-size:13px;display:inline-flex;gap:20px;align-items:center;min-height:44px;border-bottom:1px solid #89929d66}.text-action span{transition:transform .4s}.text-action:hover span{transform:translateY(4px)}
.wide-shot{padding:0 var(--ref-gutter);max-width:1600px;margin:0 auto 70px}.product-figure{margin:0;min-width:0}.product-figure img{width:100%;height:auto;border:1px solid #cbd5e333;border-radius:4px;background:#f3f5f8}.product-figure figcaption{padding:15px 0;display:flex;justify-content:space-between;gap:20px;font-size:12px;line-height:1.7;color:var(--ref-muted)}.product-figure figcaption span{white-space:nowrap;color:#c4cbd5}[data-zoom]{cursor:zoom-in;transition:filter .3s}[data-zoom]:hover{filter:brightness(1.04)}
.case-chapters{position:sticky;top:91px;z-index:30;display:flex;justify-content:center;gap:36px;padding:0 var(--ref-gutter);background:rgba(8,10,13,.92);backdrop-filter:blur(16px);border-block:1px solid var(--ref-line)}.case-chapters a{font-size:12px;padding:22px 0;position:relative;color:var(--ref-muted);white-space:nowrap}.case-chapters a[aria-current="location"]{color:#fff}.case-chapters a:after{content:"";position:absolute;bottom:-1px;left:0;right:0;height:1px;background:#cad9e5;transform:scaleX(0);transition:transform .4s var(--ref-ease)}.case-chapters a[aria-current="location"]:after,.case-chapters a:hover:after{transform:scaleX(1)}
.editorial-content{max-width:1440px;margin:auto;padding:0 var(--ref-gutter)}.editorial-section{display:grid;grid-template-columns:1fr 2fr;gap:64px;padding:110px 0;border-bottom:1px solid var(--ref-line)}.editorial-section>div{max-width:810px}.editorial-content h2{font-size:clamp(28px,3vw,44px);font-weight:450;line-height:1.4;letter-spacing:-.035em;margin:0 0 28px}.editorial-content p{color:var(--ref-muted);font-size:16px;line-height:1.95}.editorial-content .body-large{font-size:20px;line-height:1.8;color:#d5d9df}.feature-lines{margin:45px 0 0}.feature-lines>div{display:grid;grid-template-columns:110px 1fr;gap:25px;border-top:1px solid var(--ref-line);padding:24px 0}.feature-lines dt{font-size:14px}.feature-lines dd{margin:0;color:var(--ref-muted);font-size:14px;line-height:1.9}.section-heading{padding:110px 0 55px}.screen-story{display:grid;grid-template-columns:.7fr 1.5fr;gap:60px;align-items:center;margin-bottom:90px}.screen-story h3{font-size:25px;line-height:1.5;font-weight:450;letter-spacing:-.03em;margin:18px 0}.screen-story p{font-size:15px}.screen-story .product-figure{min-width:0}.guide-section{border-bottom:0}.command-bar{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px 24px;margin:30px 0;border:1px solid #46515b;background:#11161c;border-radius:3px}.command-bar code{font:14px/1.7 "SF Mono",monospace;overflow-wrap:anywhere}.command-bar button{background:transparent;border:0;border-left:1px solid var(--ref-line);padding:8px 0 8px 22px;font-size:12px;white-space:nowrap;cursor:pointer;color:#dbe3ed;min-height:44px}.usage-steps{counter-reset:step;list-style:none;padding:0;margin:42px 0}.usage-steps li{counter-increment:step;position:relative;padding:0 0 24px 50px;margin-bottom:22px;border-bottom:1px solid var(--ref-line)}.usage-steps li:before{content:"0" counter(step);position:absolute;left:0;top:3px;font:12px "SF Mono",monospace;color:var(--ref-muted)}.usage-steps strong{font-weight:500;font-size:18px}.usage-steps p{font-size:15px;margin-bottom:0}.integration-details summary{cursor:pointer;padding:22px 0;display:flex;justify-content:space-between;border-bottom:1px solid var(--ref-line);font-size:15px;list-style:none}.integration-details summary::-webkit-details-marker{display:none}.integration-details[open] summary span{transform:rotate(45deg)}.integration-details summary span{transition:transform .3s;font-size:20px}.integration-details>div{padding:12px 0}.integration-details p{font-size:14px}.availability-note a{text-decoration:underline;text-underline-offset:5px}
.phone-stage{max-width:1440px;margin:0 auto 80px;padding:60px 14% 0;display:flex;justify-content:center;align-items:flex-start;gap:36px;height:670px;overflow:hidden;background:radial-gradient(ellipse at 50% 60%,#183c35,transparent 68%);mask-image:linear-gradient(#000 90%,transparent)}.phone-stage img{width:29%;height:auto;border-radius:28px;border:5px solid #273c37;box-shadow:0 40px 80px #0006;transform:translateY(60px)}.phone-stage img:nth-child(2){transform:none}.phone-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px}.phone-gallery figure{margin:0}.phone-well{padding:35px 28px;background:#101916;border:1px solid #d6f4ea12;border-radius:4px}.phone-well img{border-radius:22px;width:100%;height:auto;box-shadow:0 20px 50px #0005}.phone-gallery h3{font-size:20px;font-weight:450;line-height:1.6;margin:26px 0 8px}.phone-gallery figcaption p{font-size:14px;line-height:1.8;margin:0}
.rexlink-case-hero h1{font-weight:450;letter-spacing:-.04em}.rexlink-case-content h2{font-size:clamp(28px,3.4vw,46px)}.rexlink-case-content p{line-height:1.95}.project-footer{padding:60px var(--ref-gutter) 32px;border-top:1px solid var(--ref-line);background:var(--ref-ink)}.next-project{max-width:1440px;margin:auto;display:block}.next-project>span{font-size:11px;letter-spacing:.08em;color:var(--ref-muted)}.next-project strong{font-size:clamp(36px,6vw,86px);font-weight:400;letter-spacing:-.04em;display:flex;justify-content:space-between;align-items:center;margin:25px 0 60px}.next-project strong span{transition:transform .4s var(--ref-ease)}.next-project:hover strong span{transform:translate(8px,-8px)}.footer-meta{font-size:11px;color:var(--ref-muted)}
.reading-progress{position:fixed;top:0;left:0;z-index:70;width:100%;height:1px;background:#d2e4ed;transform:scaleX(0);transform-origin:left;pointer-events:none}.image-viewer{position:fixed;inset:0;max-width:100vw;max-height:100dvh;width:100vw;height:100dvh;border:0;margin:0;padding:74px 4vw 38px;background:#080a0dfa;color:#fff;overflow:auto}.image-viewer::backdrop{background:#080a0deb;backdrop-filter:blur(12px)}.image-viewer[open]{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;animation:quiet-enter .25s var(--ref-ease)}.image-viewer img{max-width:100%;max-height:calc(100dvh - 155px);width:auto;height:auto;object-fit:contain}.image-viewer p{font-size:13px;color:#bdc8d2;margin:0;text-align:center}.viewer-close{position:absolute;top:20px;right:4vw;border:1px solid #ffffff40;background:#111820;color:#eee;font:13px inherit;padding:12px 18px;min-height:44px;cursor:pointer;border-radius:2px}.copy-status{font-size:12px;color:#c8d8e8}
@keyframes quiet-enter{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}@keyframes scroll-tick{0%{transform:translateY(-100%)}60%,100%{transform:translateY(100%)}}
.unfold-toggle{left:auto;right:var(--ref-gutter);margin-left:0}.hero-min{left:var(--ref-gutter)}.hero:has(.unfold.is-open){overflow:visible;z-index:10}
@media(max-width:640px){.hero-min{bottom:88px;left:22px}.hero-min h1{font-size:20px}.hero-sub{font-size:9px;letter-spacing:.13em}.unfold-toggle{right:24px;bottom:25px;width:44px;height:44px}.hero-scroll{bottom:24px}.unfold .method{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.unfold .method strong{font-size:12px}}
@media(min-width:981px){.system-card:nth-child(even){margin-top:68px}.system-grid{align-items:start}}
@media(max-width:980px){.portfolio-hero{gap:35px;padding-top:145px;grid-template-columns:1fr 1fr}.portfolio-title h1{font-size:clamp(52px,8vw,84px)}.screen-story{grid-template-columns:1fr;gap:20px}.screen-story>div{max-width:580px}.editorial-section{grid-template-columns:1fr;gap:20px;padding-block:80px}.phone-stage{height:550px;padding:40px 9% 0;gap:20px}.phone-well{padding:20px 15px}.phone-gallery{gap:22px}.system-thesis{gap:30px}.method{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){html{scroll-padding-top:125px}.site-header,.project-header{padding-inline:22px}.project-header{height:76px}.project-brand img,.brand-logo{width:70px}.project-nav{gap:18px;font-size:12px}.project-nav .contact-nav{display:none}.hero-min h1{font-size:clamp(21px,5.6vw,30px);letter-spacing:0}.hero-scroll{left:22px;bottom:20px;transform:none;padding-left:0}.hero-scroll i{height:22px}.project-system{padding-block:70px}.system-thesis{display:block;padding-bottom:35px}.system-thesis>p:last-child{margin-top:25px;font-size:14px}.system-grid{grid-template-columns:1fr;gap:40px}.system-card h3,.system-card:not(.system-card-featured) h3,.system-grid-directory .system-card h2,.system-grid-directory .system-card:not(.system-card-featured) h2{font-size:32px}.system-card-summary{font-size:14px;padding-right:0}.card-art{aspect-ratio:1.45}.system-card-order{margin-top:18px}.progress-evidence{margin-top:75px}.evidence-strip{grid-template-columns:1fr 1fr;gap:26px 20px}.evidence-strip strong{font-size:14px}.system-cta{margin-top:75px;padding-block:40px}.system-cta-actions{gap:12px;flex-wrap:wrap}.system-directory-main{padding-top:135px}.index-intro{display:block;margin-bottom:45px}.index-intro>p{margin-top:24px;font-size:14px}.portfolio-hero{grid-template-columns:1fr;padding:135px 22px 45px;gap:32px}.portfolio-title h1{font-size:64px;margin-top:20px}.portfolio-lede{max-width:100%}.portfolio-lede>p:not(.project-discipline){font-size:23px}.project-discipline{margin-bottom:15px}.hero-actions{margin-top:18px;gap:20px}.wide-shot{padding-inline:16px;margin-bottom:45px}.product-figure figcaption{font-size:11px;gap:12px}.product-figure figcaption span{display:none}.case-chapters{top:75px;gap:25px}.case-chapters a{padding-block:18px}.editorial-section{padding-block:60px;gap:18px}.editorial-content p{font-size:15px}.editorial-content .body-large{font-size:18px}.editorial-content h2{font-size:29px;margin-bottom:22px}.feature-lines>div{grid-template-columns:1fr;gap:8px;padding:20px 0}.section-heading{padding:65px 0 25px}.screen-story{margin-bottom:55px;gap:18px}.screen-story h3{font-size:23px;margin:10px 0}.command-bar{padding:14px;gap:12px}.command-bar code{font-size:12px}.command-bar button{padding-left:12px;font-size:11px}.usage-steps{margin-top:30px}.phone-stage{height:370px;padding:20px 12px 0;margin-bottom:35px;gap:14px}.phone-stage img{width:33%;border-width:3px;border-radius:17px;transform:translateY(35px)}.phone-gallery{grid-template-columns:1fr;gap:42px}.phone-well{padding:30px 24%;}.phone-well img{border-radius:19px}.phone-gallery h3{font-size:22px;margin-top:22px}.phone-gallery figcaption p{font-size:15px}.next-project strong{font-size:38px;margin-bottom:50px}.project-footer{padding-top:40px}.image-viewer{padding-inline:12px}.image-viewer p{font-size:12px}.viewer-close{right:16px}.rexlink-case-hero{padding-top:125px}}
@media(max-width:640px){.unfold{position:fixed;bottom:95px;max-height:calc(100svh - 195px);overflow-y:auto;border-radius:12px;background:rgba(10,13,20,.96)}.unfold-toggle[aria-expanded="true"]{position:fixed;bottom:25px}.method{opacity:.8}}
@media(prefers-reduced-motion:no-preference){@view-transition{navigation:auto}::view-transition-old(root){animation-duration:150ms}::view-transition-new(root){animation-duration:250ms}.portfolio-title,.portfolio-lede{animation:quiet-enter .9s var(--ref-ease) both}.portfolio-lede{animation-delay:.12s}.wide-shot,.phone-stage{animation:quiet-enter 1s var(--ref-ease) .2s both}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.reveal-system,.reveal{opacity:1!important;transform:none!important}}
