:root{color-scheme:light;--bg:#fff;--surface:#f3f7ff;--ink:#101828;--muted:#667085;--line:#dbe4f0;--blue:#175cff;--cyan:#00b8d9;--orange:#ff6b4a;--green:#00a777;--display:"Arial Narrow","PingFang SC","Microsoft YaHei",sans-serif;--body:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC",sans-serif;--gutter:clamp(22px,5vw,78px);--max:1480px}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;color:var(--ink);background:var(--bg);font-family:var(--body);transition:color .3s,background-color .3s}body.dark{color-scheme:dark;--bg:#151614;--surface:#20211e;--ink:#f1efe8;--muted:#a7a59c;--line:#393a35}body.motion-paused *,body.motion-paused *::before,body.motion-paused *::after{animation-play-state:paused!important}button,a{font:inherit}a{color:inherit;text-decoration:none}button{color:inherit}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:fixed;left:20px;top:-100px;z-index:100;padding:10px 16px;background:var(--ink);color:var(--bg)}.skip-link:focus{top:20px}
.site-header{width:100%;max-width:var(--max);height:92px;margin:0 auto;padding:0 var(--gutter);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;position:sticky;top:0;z-index:20;transition:height .25s,background-color .25s,backdrop-filter .25s,border-color .25s}.site-header.scrolled{height:72px;background:color-mix(in srgb,var(--bg) 82%,transparent);backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%);border-bottom:1px solid color-mix(in srgb,var(--line) 72%,transparent)}.brand{width:auto;display:inline-flex;align-items:center;gap:12px;font-size:10px;font-weight:700;letter-spacing:.18em;white-space:nowrap}.brand svg{width:52px;flex:none;fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:square;stroke-linejoin:bevel}.brand-logo{display:block;width:clamp(118px,10vw,146px);height:auto;flex:none;border-radius:3px}.site-nav{display:flex;gap:clamp(24px,3.2vw,52px);font-size:14px}.site-nav a{position:relative;padding:10px 0}.site-nav a::after{content:"";position:absolute;left:0;right:100%;bottom:4px;height:1px;background:currentColor;transition:right .25s}.site-nav a:hover::after,.site-nav a:focus-visible::after,.site-nav a[aria-current="true"]::after{right:0}.site-nav a[aria-current="true"]{color:var(--blue)}.theme-toggle{justify-self:end;width:42px;height:42px;border:1px solid var(--line);border-radius:50%;background:transparent;display:grid;place-items:center;cursor:pointer}.theme-toggle svg{width:18px;fill:none;stroke:currentColor;stroke-width:1.5}.theme-toggle:hover{background:var(--ink);color:var(--bg)}.menu-toggle{display:none}
.hero{max-width:var(--max);min-height:calc(100vh - 92px);margin:0 auto;padding:clamp(56px,10vh,120px) var(--gutter) 48px;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(380px,.95fr);align-items:center;gap:5vw;position:relative}.hero-copy{position:relative;z-index:2}.hero h1{margin:0;max-width:850px;font-family:var(--display);font-size:clamp(56px,7.7vw,126px);font-weight:800;letter-spacing:-.07em;line-height:.93}.hero h1 span{color:var(--blue)}.hero-copy>p{max-width:660px;margin:38px 0 0;color:var(--muted);font-size:clamp(17px,1.4vw,21px);line-height:1.85}.hero-actions{display:flex;align-items:center;gap:34px;margin-top:44px}.button{min-height:52px;padding:0 24px;border:0;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .2s,background .2s}.button:hover{transform:translateY(-3px)}.button:disabled{cursor:default;opacity:.82;transform:none}.button-primary{background:var(--ink);color:var(--bg)}.text-link{border-bottom:1px solid var(--line);padding:14px 0}.text-link span{color:var(--blue);margin-left:7px}.hero-art{position:relative;width:min(42vw,580px);aspect-ratio:1;justify-self:end}.hero-art>*{transition:transform .16s ease-out}.core{position:absolute;inset:24%;border-radius:50%;background:var(--blue);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 30px 80px rgba(49,87,255,.28);animation:float 6s ease-in-out infinite;overflow:hidden}.core small{margin-top:6px;font-size:8px;letter-spacing:.16em}.orbit{position:absolute;inset:8%;border:1px solid var(--line);border-radius:50%}.orbit::before{content:"";position:absolute;width:12px;height:12px;background:var(--orange);border-radius:50%;top:18%;left:8%}.orbit-two{inset:0;border-style:dashed;animation:spin 30s linear infinite}.orbit-two::before{width:8px;height:8px;left:auto;right:8%;top:69%;background:var(--green)}.coordinate{position:absolute;color:var(--muted);font:10px/1 monospace;letter-spacing:.12em}.coordinate-a{top:4%;left:18%}.coordinate-b{right:3%;bottom:18%}.signal{position:absolute;width:3px;height:3px;background:var(--ink);border-radius:50%;box-shadow:8px 0 var(--ink),16px 0 var(--ink)}.signal-a{right:2%;top:31%}.signal-b{left:1%;bottom:31%;transform:rotate(90deg)}.scroll-note{position:absolute;left:var(--gutter);bottom:32px;color:var(--muted);font-size:11px;letter-spacing:.18em;writing-mode:vertical-rl;display:flex;align-items:center;gap:12px}.scroll-note span{display:block;width:1px;height:42px;background:var(--line)}
.statement{padding:clamp(100px,14vw,220px) var(--gutter);background:var(--ink);color:var(--bg)}.statement p{max-width:1140px;margin:0 auto;text-align:center;font-family:var(--display);font-size:clamp(38px,5.7vw,88px);font-weight:700;letter-spacing:-.05em;line-height:1.28}.statement span{color:#8fa4ff}.section{max-width:var(--max);margin:0 auto;padding:clamp(100px,12vw,190px) var(--gutter)}.section-index{color:var(--muted);font:11px/1 var(--body);letter-spacing:.18em;text-transform:uppercase}.about-grid{margin-top:72px;display:grid;grid-template-columns:minmax(360px,1.05fr) minmax(250px,.62fr) minmax(330px,.9fr);align-items:center;gap:clamp(28px,4vw,64px)}.about h2,.section-head h2,.notes h2,.music h2{margin:0;font-family:var(--display);font-size:clamp(42px,5vw,78px);line-height:1.13;letter-spacing:-.055em}.about h2{font-size:clamp(38px,3.4vw,54px)}.about-portrait{width:min(100%,280px);margin:0;justify-self:center;aspect-ratio:3/4;overflow:hidden;border:1px solid var(--line);border-radius:8px;background:var(--surface)}.about-portrait img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 31%;transform:scale(1.28);transform-origin:50% 29%}.about-copy{max-width:590px}.about-copy p{margin:0 0 28px;color:var(--muted);font-size:18px;line-height:1.9}.principles{margin-top:50px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap}.principles span{padding:18px 20px 18px 0;margin-right:20px;font-size:13px}.principles span::before{content:"●";color:var(--blue);margin-right:9px;font-size:8px}
.work{max-width:none;background:var(--surface)}.work>*{max-width:calc(var(--max) - 2 * var(--gutter));margin-left:auto;margin-right:auto}.section-head{display:grid;grid-template-columns:.5fr 1.3fr .8fr;gap:40px;align-items:end;margin-bottom:80px}.section-head p{color:var(--muted);line-height:1.8;margin:0}.work-list{border-top:1px solid var(--line)}.work-item{min-height:210px;display:grid;grid-template-columns:80px 1.5fr .7fr 36px;gap:30px;align-items:center;border-bottom:1px solid var(--line);position:relative;transition:padding .3s}.work-item::before{content:"";position:absolute;inset:0;transform:scaleY(0);transform-origin:bottom;background:var(--ink);transition:transform .3s}.work-item:hover{color:var(--bg);padding:0 22px}.work-item:hover::before{transform:scaleY(1)}.work-item>*{position:relative;z-index:1}.work-number{align-self:start;padding-top:48px;color:var(--muted);font:11px/1 monospace}.work-main h3{margin:0 0 18px;font-family:var(--display);font-size:clamp(28px,3vw,45px);letter-spacing:-.04em}.work-main p{max-width:640px;margin:0;color:var(--muted);line-height:1.75}.work-meta{display:flex;flex-direction:column;gap:18px;color:var(--muted);font-size:10px;letter-spacing:.1em}.work-item svg{width:28px;fill:none;stroke:currentColor;stroke-width:1.4}.work-item:hover.accent-blue h3{color:#8fa4ff}.work-item:hover.accent-orange h3{color:#ff927a}.work-item:hover.accent-green h3{color:#65d9b7}
.notes{display:grid;grid-template-columns:.72fr 1.28fr;gap:8vw}.notes-intro h2{margin-top:50px}.notes-intro p{margin-top:28px;max-width:360px;color:var(--muted);line-height:1.8}.featured-note{background:var(--ink);color:var(--bg)}.note-visual{min-height:340px;position:relative;overflow:hidden;display:grid;place-items:center;background:var(--blue)}.note-glyph{position:relative;z-index:2;font-family:serif;font-size:clamp(100px,13vw,190px);color:#fff}.wave{position:absolute;width:120%;aspect-ratio:1;border:1px solid rgba(255,255,255,.45);border-radius:48% 52% 46% 54%;animation:spin 18s linear infinite}.wave-b{width:88%;animation-direction:reverse;animation-duration:13s}.note-content{padding:clamp(30px,5vw,68px)}.note-date{color:#aaa89e;font-size:10px;letter-spacing:.15em}.note-content h3{margin:26px 0;font-family:var(--display);font-size:clamp(30px,3vw,48px);line-height:1.25;letter-spacing:-.04em}.note-content>p,.note-extra p{color:#aaa89e;line-height:1.8}.note-button{margin-top:18px;padding:14px 0;border:0;border-bottom:1px solid #55554f;background:transparent;cursor:pointer}.note-button span{color:#8fa4ff;margin-left:10px}.note-extra{border-left:2px solid var(--blue);margin-top:22px;padding-left:20px}.micro-notes{display:grid;grid-template-columns:1fr 1fr;gap:1px;margin-top:1px;background:var(--line)}.micro-notes p{margin:0;min-height:150px;padding:30px;display:flex;align-items:flex-end;background:var(--bg);line-height:1.6}
.music{border-top:1px solid var(--line)}.music-grid{margin-top:70px;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:8vw}.music-grid>div:first-child p{color:var(--muted);margin-top:30px}.now-playing{display:flex;align-items:center;gap:40px}.record{width:min(230px,24vw);aspect-ratio:1;border-radius:50%;flex:none;display:grid;place-items:center;color:#fff;background:repeating-radial-gradient(circle,#1b1b19 0 3px,#252522 4px 6px);animation:spin 12s linear infinite;box-shadow:0 20px 45px rgba(0,0,0,.15)}.record::before{content:"";position:absolute;width:78px;aspect-ratio:1;border-radius:50%;background:#050505}.record-brand-mark{position:relative;z-index:1;width:62%;height:62%;object-fit:contain;border-radius:20%}.track-copy>span{color:var(--muted);font-size:9px;letter-spacing:.15em}.track-copy strong{max-width:220px;display:block;margin-top:18px;font-size:18px;line-height:1.5}.equalizer{height:35px;margin-top:28px;display:flex;align-items:end;gap:4px}.equalizer i{width:3px;height:40%;background:var(--blue);animation:equalize .9s ease-in-out infinite alternate}.equalizer i:nth-child(2){animation-delay:-.2s}.equalizer i:nth-child(3){animation-delay:-.5s}.equalizer i:nth-child(4){animation-delay:-.7s}.equalizer i:nth-child(5){animation-delay:-.3s}.equalizer i:nth-child(6){animation-delay:-.8s}
.contact{min-height:640px;padding:120px var(--gutter);background:var(--blue);color:#fff;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;position:relative}.contact>*:not(.contact-orbit){position:relative;z-index:1}.contact>p:first-of-type{font-size:13px;letter-spacing:.12em}.contact h2{max-width:1000px;margin:30px 0 48px;font-family:var(--display);font-size:clamp(48px,7vw,106px);line-height:1;letter-spacing:-.06em}.button-light{background:#fff;color:#171713}.contact-orbit{position:absolute;width:min(1000px,80vw);aspect-ratio:1;border:1px solid rgba(255,255,255,.18);border-radius:50%;animation:spin 50s linear infinite}.contact-orbit::before,.contact-orbit::after{content:"";position:absolute;inset:12%;border:1px solid rgba(255,255,255,.14);border-radius:50%}.contact-orbit::after{inset:27%}.contact-response{min-height:24px;margin:20px 0 0;font-size:13px}footer{max-width:var(--max);min-height:160px;margin:0 auto;padding:40px var(--gutter);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;color:var(--muted);font-size:11px;letter-spacing:.08em}.footer-brand{color:var(--ink)}.back-top{justify-self:end}
.js [data-reveal]{opacity:0;transform:translateY(24px);transition:opacity .7s cubic-bezier(.22,1,.36,1),transform .7s cubic-bezier(.22,1,.36,1)}.js [data-reveal][data-delay]{transition-delay:.12s}.js [data-reveal].revealed{opacity:1;transform:translateY(0)}
@keyframes spin{to{transform:rotate(360deg)}}@keyframes float{50%{transform:translateY(-14px)}}@keyframes equalize{to{height:100%}}
@media(max-width:900px){.site-header{height:76px;grid-template-columns:1fr auto auto;gap:12px}.menu-toggle{display:flex;flex-direction:column;justify-content:center;gap:6px;width:42px;height:42px;border:0;background:transparent;cursor:pointer}.menu-toggle i{display:block;width:22px;height:1px;background:currentColor;transition:transform .2s}.menu-toggle[aria-expanded="true"] i:first-child{transform:translateY(3.5px) rotate(45deg)}.menu-toggle[aria-expanded="true"] i:nth-child(2){transform:translateY(-3.5px) rotate(-45deg)}.site-nav{position:absolute;left:0;right:0;top:76px;padding:30px var(--gutter);background:var(--bg);border-bottom:1px solid var(--line);flex-direction:column;gap:14px;transform:translateY(-130%);opacity:0;pointer-events:none;transition:.25s}.site-header.scrolled .site-nav{top:72px}.site-nav.open{transform:translateY(0);opacity:1;pointer-events:auto}.hero{min-height:auto;grid-template-columns:1fr;padding-top:74px;padding-bottom:110px;overflow:hidden}.hero-art{width:min(560px,90vw);justify-self:center;margin-top:40px}.scroll-note{display:none}.about-grid,.music-grid{grid-template-columns:1fr;gap:54px}.section-head{grid-template-columns:1fr;gap:24px}.work-item{grid-template-columns:45px 1fr 28px;padding:38px 0}.work-number{padding-top:5px}.work-meta{grid-column:2;flex-direction:row}.work-item svg{grid-column:3;grid-row:1/3}.work-item:hover{padding:38px 14px}.notes{grid-template-columns:1fr}.notes-intro{margin-bottom:50px}footer{grid-template-columns:1fr auto}.footer-brand{display:none}}
@media(max-width:560px){.brand span{display:none}.hero h1{font-size:clamp(49px,15.2vw,74px)}.hero-copy>p{margin-top:28px;font-size:16px}.hero-actions{align-items:flex-start;flex-direction:column;gap:16px;margin-top:32px}.hero-art{width:104vw;margin-right:-5vw}.core{inset:23%}.core span{font-size:76px}.statement{padding-top:110px;padding-bottom:110px}.statement p{text-align:left}.about-grid{margin-top:48px}.about-copy p{font-size:16px}.section-head{margin-bottom:48px}.work-item{grid-template-columns:30px 1fr 24px;gap:14px}.work-main p{font-size:14px}.work-meta{flex-direction:column;gap:8px}.note-visual{min-height:250px}.micro-notes{grid-template-columns:1fr}.now-playing{gap:24px}.record{width:42vw}.record::before{width:54px}.contact{min-height:560px}.contact h2{margin-top:22px}footer{grid-template-columns:1fr;gap:18px;text-align:center}.back-top{justify-self:center}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.js [data-reveal]{opacity:1;transform:none}}
a:focus-visible,button:focus-visible{outline:2px solid var(--blue);outline-offset:4px}
.record{position:relative}
html{scroll-padding-top:72px}
@media(min-width:901px){.hero{grid-template-columns:minmax(0,1.25fr) minmax(360px,.75fr)}.hero h1{font-size:clamp(56px,6.3vw,88px)}.hero-art{width:min(32vw,480px)}}
@media(min-width:901px){.about h2{font-size:clamp(36px,3vw,48px)}}
@media(min-width:901px) and (max-height:800px){.scroll-note{display:none}}
.solid-logo .logo-main{fill:currentColor;stroke:none}.solid-logo .logo-accent{fill:none;stroke:var(--logo-accent,var(--blue));stroke-width:5}.brand svg.solid-logo{width:58px;fill:currentColor;stroke:none}.core-logo{width:62%;height:62%;color:#fff;--logo-accent:#171713}.core .core-logo+small{margin-top:6px}.record-logo{position:relative;z-index:1;width:58%;height:58%;color:#fff;--logo-accent:#3157ff}

/* Bright visual system — v4 */
html,body{max-width:100%;overflow-x:clip}body{background:#fff}body.dark{color-scheme:light;--bg:#fff;--surface:#f3f7ff;--ink:#101828;--muted:#667085;--line:#dbe4f0}.site-header.scrolled{background:rgba(255,255,255,.88);border-bottom-color:rgba(219,228,240,.86)}
.header-cta{justify-self:end;display:inline-flex;align-items:center;gap:9px;padding:12px 0;border-bottom:1px solid var(--line);font-size:13px}.header-cta span{color:var(--blue)}
.hero{isolation:isolate;overflow:hidden}.hero::before{content:"";position:absolute;z-index:-1;width:52vw;aspect-ratio:1;right:-20vw;top:-18vw;border-radius:50%;background:radial-gradient(circle,rgba(0,184,217,.12),rgba(23,92,255,.035) 48%,transparent 72%);pointer-events:none}.core{background:linear-gradient(145deg,#175cff,#287cff 58%,#00a9d7);box-shadow:0 34px 90px rgba(23,92,255,.23)}
.statement{background:linear-gradient(135deg,#eef6ff 0%,#f8fbff 52%,#eafbff 100%);color:var(--ink);border-block:1px solid #e5eef9}.statement span{color:var(--blue)}
.work{background:linear-gradient(180deg,#f5f8ff 0%,#eef5ff 46%,#fff 100%)}.work-item::before{background:#fff;box-shadow:0 18px 60px rgba(23,92,255,.08)}.work-item:hover{color:var(--ink)}.work-item:hover.accent-blue h3{color:var(--blue)}.work-item:hover.accent-orange h3{color:var(--orange)}.work-item:hover.accent-green h3{color:var(--green)}
.featured-note{background:#fff;color:var(--ink);border:1px solid var(--line);box-shadow:0 28px 80px rgba(29,78,216,.08)}.note-date,.note-content>p,.note-extra p{color:var(--muted)}.note-button{border-bottom-color:var(--line)}.note-button span{color:var(--blue)}
.record{background:repeating-radial-gradient(circle,#d8e9ff 0 3px,#f0f7ff 4px 7px);border:1px solid #ccdef4;box-shadow:0 20px 45px rgba(23,92,255,.14)}.record::before{background:#fff;box-shadow:inset 0 0 0 1px var(--line)}
.contact{background:linear-gradient(135deg,#175cff 0%,#287cff 58%,#00a9d7 100%)}

.gallery-head{padding-top:clamp(110px,12vw,180px);display:grid;grid-template-columns:1.15fr .55fr;gap:7vw;align-items:end}.gallery-head span{display:block;margin-bottom:24px;color:var(--blue);font-size:10px;letter-spacing:.17em}.gallery-head h3{max-width:820px;margin:0;font-family:var(--display);font-size:clamp(42px,5vw,76px);line-height:1.08;letter-spacing:-.055em}.gallery-head p{max-width:420px;margin:0;color:var(--muted);font-size:16px;line-height:1.9}
.gallery-grid{padding:clamp(70px,8vw,120px) 0 70px;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(22px,3.2vw,50px);row-gap:clamp(52px,7vw,105px);align-items:start}.gallery-card{appearance:none;display:block;width:100%;padding:0;border:0;background:transparent;text-align:left;cursor:zoom-in}.gallery-card-wide{grid-column:span 8}.gallery-card-narrow{grid-column:span 4}.gallery-card-medium{grid-column:span 5}.gallery-card-large{grid-column:span 7}.gallery-card-shift{margin-top:clamp(44px,6vw,92px)}.gallery-media{position:relative;display:block;aspect-ratio:var(--gallery-ratio,4/3);overflow:hidden;background:#e8f0fb;box-shadow:0 24px 70px rgba(31,64,124,.12)}.gallery-card-portrait{--gallery-ratio:3/4}.gallery-media::after{content:"查看大图 ↗";position:absolute;right:18px;bottom:18px;padding:10px 13px;background:rgba(255,255,255,.88);backdrop-filter:blur(12px);color:var(--ink);font-size:11px;letter-spacing:.06em;opacity:0;transform:translateY(8px);transition:.28s}.gallery-media picture,.gallery-media img{display:block;width:100%;height:100%}.gallery-media img{object-fit:cover;transition:transform .7s cubic-bezier(.22,1,.36,1),filter .35s}.gallery-card:hover .gallery-media img,.gallery-card:focus-visible .gallery-media img{transform:scale(1.025)}.gallery-card:hover .gallery-media::after,.gallery-card:focus-visible .gallery-media::after{opacity:1;transform:none}.gallery-meta{display:flex;justify-content:space-between;align-items:baseline;gap:20px;padding-top:19px}.gallery-meta strong{font-family:var(--display);font-size:clamp(22px,2vw,31px);letter-spacing:-.035em}.gallery-meta small{color:var(--muted);font-size:10px;letter-spacing:.13em;text-transform:uppercase}
.lightbox{width:100vw;max-width:none;height:100vh;max-height:none;margin:0;padding:0;border:0;background:rgba(245,249,255,.94);color:var(--ink);overflow:hidden}.lightbox[open]{display:grid;place-items:center}.lightbox::backdrop{background:rgba(235,243,255,.72);backdrop-filter:blur(18px)}.lightbox-shell{position:relative;width:100%;height:100%;display:grid;grid-template-columns:80px minmax(0,1fr) 80px;align-items:center}.lightbox figure{margin:0;height:92vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px}.lightbox figure img{display:block;width:auto;height:auto;max-width:min(78vw,1200px);max-height:84vh;object-fit:contain;box-shadow:0 28px 90px rgba(23,66,142,.16);background:#fff}.lightbox figcaption{font-size:12px;letter-spacing:.09em;color:var(--muted)}.lightbox-close,.lightbox-nav{border:0;background:transparent;cursor:pointer}.lightbox-close{position:absolute;right:26px;top:22px;z-index:2;width:48px;height:48px;border:1px solid var(--line);border-radius:50%;font-size:27px;font-weight:300}.lightbox-nav{width:52px;height:52px;justify-self:center;border-radius:50%;background:#fff;box-shadow:0 12px 35px rgba(23,66,142,.1);font-size:20px}.lightbox-close:hover,.lightbox-nav:hover{background:var(--blue);color:#fff}
.pointer-halo{position:fixed;z-index:9999;left:0;top:0;width:22px;height:22px;border:1px solid rgba(23,92,255,.5);border-radius:50%;pointer-events:none;opacity:0;transform:translate3d(-50%,-50%,0);transition:width .2s,height .2s,opacity .2s,background .2s;will-change:transform}.pointer-halo.is-visible{opacity:1}.pointer-halo.is-active{width:48px;height:48px;background:rgba(23,92,255,.08)}
.scroll-progress{position:fixed;z-index:120;left:0;right:0;top:0;height:2px;pointer-events:none}.scroll-progress i{display:block;width:100%;height:100%;background:linear-gradient(90deg,var(--blue),var(--cyan));transform:scaleX(0);transform-origin:left;will-change:transform}.ai-particles{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}.fluid-light{position:absolute;z-index:-1;border-radius:50%;filter:blur(28px);pointer-events:none;opacity:.5}.fluid-light-a{width:260px;height:260px;right:25%;top:15%;background:rgba(42,126,255,.12)}.fluid-light-b{width:200px;height:200px;right:7%;bottom:13%;background:rgba(0,184,217,.1)}
.visual{max-width:none;background:#fff}.visual>*{max-width:calc(var(--max) - 2 * var(--gutter));margin-left:auto;margin-right:auto}.visual .gallery-head{padding-top:0}.gradient-text{font-style:normal;color:var(--blue);background:linear-gradient(100deg,var(--blue),var(--cyan));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.future{max-width:none;background:linear-gradient(180deg,#f4f8ff,#fff);border-top:1px solid #e5edf8}.future>*{max-width:calc(var(--max) - 2 * var(--gutter));margin-left:auto;margin-right:auto}.future-head{display:grid;grid-template-columns:.45fr 1.55fr;gap:40px;align-items:start}.future h2{max-width:940px;margin:0;font-family:var(--display);font-size:clamp(42px,5vw,78px);line-height:1.08;letter-spacing:-.055em}.future-grid{margin-top:80px;display:grid;grid-template-columns:repeat(3,1fr);border-block:1px solid var(--line)}.future-grid article{min-height:260px;padding:38px clamp(24px,3vw,48px);border-right:1px solid var(--line)}.future-grid article:last-child{border-right:0}.future-grid article>span{color:var(--blue);font:11px/1 monospace;letter-spacing:.12em}.future-grid h3{margin:52px 0 14px;font-family:var(--display);font-size:clamp(24px,2vw,34px);letter-spacing:-.035em}.future-grid p{max-width:280px;color:var(--muted);line-height:1.75}.future-grid small{display:block;margin-top:28px;color:var(--muted);font-size:10px;letter-spacing:.12em}

@media(max-width:900px){.gallery-head,.future-head{grid-template-columns:1fr;gap:28px}.gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:52px 28px}.gallery-card-wide,.gallery-card-narrow,.gallery-card-medium,.gallery-card-large{grid-column:span 1}.gallery-card-shift{margin-top:64px}.future-grid{grid-template-columns:1fr}.future-grid article{min-height:auto;border-right:0;border-bottom:1px solid var(--line)}.future-grid article:last-child{border-bottom:0}.lightbox-shell{grid-template-columns:56px minmax(0,1fr) 56px}.lightbox figure img{max-width:76vw;max-height:78vh}}
@media(max-width:560px){.header-cta{display:none}.hero h1{max-width:100%;font-size:min(13.8vw,54px)!important}.gallery-grid{grid-template-columns:1fr;gap:44px;padding-top:52px}.gallery-card-wide,.gallery-card-narrow,.gallery-card-medium,.gallery-card-large{grid-column:1}.gallery-card-shift{margin-top:0}.gallery-meta{padding-top:14px}.gallery-media::after{opacity:1;transform:none}.future-grid{margin-top:50px}.future-grid h3{margin-top:32px}.lightbox-shell{grid-template-columns:44px minmax(0,1fr) 44px}.lightbox-nav{width:38px;height:38px;font-size:16px}.lightbox-close{right:14px;top:14px}.lightbox figure img{max-width:78vw;max-height:72vh}.pointer-halo{display:none}}
@media(pointer:coarse){.pointer-halo{display:none}}
@media(max-width:900px){.hero{grid-template-columns:minmax(0,1fr)}.hero-copy{min-width:0}}

/* Motion system — v6 */
.page-transition{position:fixed;top:0;left:0;right:0;height:calc(100% + clamp(90px,14vh,160px));z-index:10000;display:grid;place-items:center;overflow:hidden;background-color:#132238;background-image:linear-gradient(rgba(4,13,22,.3),rgba(4,13,22,.3)),url("./assets/intro-curtain-cape-town-desktop-v2.jpg");background-position:center;background-size:cover;background-repeat:no-repeat;color:#fff;border-radius:0 0 50% 50% / 0 0 12% 12%;box-shadow:0 34px 70px rgba(4,13,22,.16);transform:translate3d(0,-125%,0);transition:transform .72s cubic-bezier(.76,0,.24,1);pointer-events:none;will-change:transform}.page-transition::after{display:none}.intro-greeting{position:absolute;z-index:1;left:50%;top:50vh;display:flex;align-items:center;justify-content:center;gap:clamp(10px,1.2vw,17px);font-family:"Helvetica Neue","PingFang SC","Hiragino Sans GB","Noto Sans",Arial,sans-serif;font-size:clamp(34px,4.4vw,64px);font-weight:400;letter-spacing:-.025em;line-height:1;white-space:nowrap;transform:translate(-50%,-50%);text-shadow:0 2px 18px rgba(0,0,0,.32)}.intro-dot{flex:none;width:clamp(7px,.65vw,10px);height:clamp(7px,.65vw,10px);border-radius:50%;background:#fff;box-shadow:0 2px 12px rgba(0,0,0,.28)}.intro-word{display:inline-block;will-change:transform,opacity,filter}.js.is-entering .page-transition,.js.is-leaving .page-transition{transform:translate3d(0,0,0);pointer-events:auto}.js.is-entering .site-header,.js.is-entering main,.js.is-entering footer{transform:translate3d(0,24vh,0);will-change:transform}.js.is-entering body,.js.is-leaving body{overflow:hidden}.js.is-leaving body{pointer-events:none}.js.is-section-scrolling .scroll-progress{height:4px;box-shadow:0 4px 18px rgba(23,92,255,.22)}
.pointer-halo{width:34px;height:34px;border-color:rgba(23,92,255,.42);opacity:0;transition:width .24s cubic-bezier(.22,1,.36,1),height .24s cubic-bezier(.22,1,.36,1),opacity .2s,background .2s,border-color .2s;mix-blend-mode:multiply}.pointer-halo::before{content:"";position:absolute;left:50%;top:50%;width:5px;height:5px;border-radius:50%;background:var(--blue);transform:translate(-50%,-50%);box-shadow:0 0 16px rgba(23,92,255,.45)}.pointer-halo::after{content:"";position:absolute;inset:-14px;border-radius:50%;background:radial-gradient(circle,rgba(23,92,255,.1),transparent 68%);opacity:.65}.pointer-halo.is-active{width:58px;height:58px;border-color:rgba(23,92,255,.2);background:rgba(23,92,255,.065)}.pointer-halo.is-pressed{width:24px;height:24px;background:rgba(23,92,255,.12)}
.gallery-card{position:relative;transform-style:preserve-3d;transform-origin:50% 50%;will-change:transform;transition:filter .35s cubic-bezier(.22,1,.36,1)}.gallery-card.is-tilting{z-index:2;filter:drop-shadow(0 34px 42px rgba(31,64,124,.14))}.gallery-card .gallery-media{transform:translateZ(0);transition:box-shadow .42s cubic-bezier(.22,1,.36,1)}.gallery-card.is-tilting .gallery-media{box-shadow:0 36px 90px rgba(31,64,124,.2)}.gallery-media::before{content:"";position:absolute;z-index:2;inset:0;background:radial-gradient(circle at var(--glare-x,50%) var(--glare-y,50%),rgba(255,255,255,.34),transparent 34%);opacity:0;mix-blend-mode:screen;pointer-events:none;transition:opacity .25s}.gallery-card.is-tilting .gallery-media::before{opacity:1}.gallery-card .gallery-meta{transform:translateZ(20px)}
.hero-art{transform-style:preserve-3d;will-change:transform}.fluid-light{will-change:transform;transition:transform .18s ease-out}
@media(prefers-reduced-motion:reduce){.page-transition{display:none}.pointer-halo{display:none}.gallery-card,.hero-art,.fluid-light{transform:none!important;transition:none!important}.gallery-media::before{display:none}}
.js{scroll-behavior:auto}

/* Scroll-directed hero handoff */
.hero-scroll-stage{position:relative;height:150vh;min-height:980px;--hero-scroll:0}
.hero-scroll-stage .hero{position:sticky;top:72px;height:calc(100vh - 72px);min-height:680px;padding-top:clamp(38px,7vh,82px);padding-bottom:70px;overflow:clip}
.hero-scroll-stage .hero-copy{will-change:transform,opacity;transform:translate3d(0,calc(var(--hero-scroll) * -42px),0);opacity:calc(1 - var(--hero-scroll) * .72)}
.hero-scroll-stage .hero-art{z-index:3;--pointer-x:0px;--pointer-y:0px;--pointer-rx:0deg;--pointer-ry:0deg;--hero-scroll-x:0vw;--hero-scroll-y:0px;--hero-scroll-scale:1;--hero-art-opacity:1;transform:translate3d(var(--hero-scroll-x),var(--hero-scroll-y),0) translate3d(var(--pointer-x),var(--pointer-y),0) scale(var(--hero-scroll-scale)) rotateX(var(--pointer-rx)) rotateY(var(--pointer-ry));transform-origin:50% 58%;will-change:transform,opacity;opacity:var(--hero-art-opacity)}
.js .hero-scroll-stage .hero-copy.revealed{transform:translate3d(0,calc(var(--hero-scroll) * -42px),0);opacity:calc(1 - var(--hero-scroll) * .72)}
.js .hero-scroll-stage .hero-art.revealed{transform:translate3d(var(--hero-scroll-x),var(--hero-scroll-y),0) translate3d(var(--pointer-x),var(--pointer-y),0) scale(var(--hero-scroll-scale)) rotateX(var(--pointer-rx)) rotateY(var(--pointer-ry));opacity:var(--hero-art-opacity)}
.js .hero-scroll-stage .hero-copy.revealed,.js .hero-scroll-stage .hero-art.revealed{transition:none}
.hero-motion-title{position:absolute;z-index:1;left:0;right:0;bottom:clamp(26px,3.8vh,44px);overflow:hidden;white-space:nowrap;pointer-events:none;color:rgba(23,92,255,.18);font-family:"Syne",var(--display);font-size:clamp(112px,13.5vw,220px);font-weight:700;letter-spacing:-.025em;line-height:.94;padding:.08em 0 .1em;opacity:calc(.76 + var(--hero-scroll) * .24)}
.hero-motion-title-track{display:flex;align-items:center;width:max-content;transform:translate3d(0,0,0);will-change:transform}
.hero-motion-title-copy{display:block;flex:none}
.hero-scroll-stage .scroll-note{opacity:calc(1 - var(--hero-scroll) * 2);transform:translateY(calc(var(--hero-scroll) * 26px));will-change:transform,opacity}
.hero-scroll-stage + .statement{position:relative;z-index:5;margin-top:-42px;border-radius:42px 42px 0 0;box-shadow:0 -24px 70px rgba(16,24,40,.09)}

@media(max-width:900px){.hero-scroll-stage{height:auto;min-height:0}.hero-scroll-stage .hero{position:relative;top:auto;height:auto;min-height:auto;padding-top:74px;padding-bottom:190px}.hero-scroll-stage .hero-copy,.hero-scroll-stage .hero-art{transform:none;opacity:1}.hero-motion-title{display:block;bottom:28px;font-size:clamp(76px,22vw,118px);color:rgba(23,92,255,.17)}.hero-scroll-stage .scroll-note{transform:none;opacity:1}.hero-scroll-stage + .statement{margin-top:0;border-radius:28px 28px 0 0}}
@media(prefers-reduced-motion:reduce){.hero-scroll-stage{height:auto;min-height:0}.hero-scroll-stage .hero{position:relative;top:auto;height:auto;min-height:calc(100vh - 92px)}.hero-motion-title{display:none}.hero-scroll-stage .hero-copy,.hero-scroll-stage .hero-art,.hero-scroll-stage .scroll-note{transform:none!important;opacity:1!important}}

/* Dual-brand lockups */
.brand-zx{gap:9px;color:var(--ink)}
.brand-zx span{font-size:10px;font-weight:750;letter-spacing:.2em}
.header-logos,.footer-logos{display:flex;align-items:center;gap:18px;justify-self:start}
.header-brand,.footer-logos .footer-brand{flex:none}
.header-brand svg.solid-logo{width:48px}
.footer-logos .footer-brand{flex:none}
.footer-logos .footer-brand svg.solid-logo{width:48px}
.header-enci,.footer-enci{display:inline-flex;align-items:center;padding-left:18px;border-left:1px solid var(--line)}
.header-enci img,.footer-enci img{display:block;width:112px;height:auto;border-radius:3px}

@media(max-width:900px){.footer-brand{display:inline-flex}.header-logos,.footer-logos{gap:14px}.header-enci,.footer-enci{padding-left:14px}.header-enci img,.footer-enci img{width:104px}}
@media(max-width:560px){.footer-logos{justify-self:center}.header-logos .brand span,.footer-logos .brand span{display:none}.header-brand svg.solid-logo,.footer-logos .footer-brand svg.solid-logo{width:52px}.header-enci img{width:88px}}

/* Portrait blend and custom hover cursor */
.about-portrait{position:relative;border:0;background:transparent;cursor:none;isolation:isolate}
.about-portrait::after{content:"";position:absolute;z-index:2;inset:-1px;pointer-events:none;background:linear-gradient(90deg,var(--bg),transparent 14%,transparent 86%,var(--bg)),linear-gradient(180deg,var(--bg),transparent 13%,transparent 87%,var(--bg))}
.about-portrait img{-webkit-mask-image:radial-gradient(ellipse 82% 90% at 50% 47%,#000 61%,rgba(0,0,0,.96) 75%,transparent 100%);mask-image:radial-gradient(ellipse 82% 90% at 50% 47%,#000 61%,rgba(0,0,0,.96) 75%,transparent 100%);transition:transform .55s cubic-bezier(.22,1,.36,1),filter .4s}
.about-portrait:hover img{transform:scale(1.32);filter:saturate(.96) contrast(.99)}
.portrait-cursor{position:fixed;z-index:10001;left:0;top:0;width:68px;height:auto;pointer-events:none;opacity:0;transform:translate3d(-200px,-200px,0) translate(-50%,-50%);transition:opacity .14s ease;width .2s ease;will-change:transform;filter:drop-shadow(0 7px 10px rgba(16,24,40,.18))}
.portrait-cursor.is-visible{opacity:1}
.pointer-halo.is-portrait{opacity:0!important}
@media(pointer:coarse){.about-portrait{cursor:auto}.portrait-cursor{display:none}}
@media(prefers-reduced-motion:reduce){.about-portrait{cursor:auto}.portrait-cursor{display:none}.about-portrait img{transition:none}}

/* Larger portrait with gradient applied only to an extended outer layer */
.about-grid{grid-template-columns:minmax(360px,1.05fr) minmax(330px,.85fr) minmax(330px,.9fr);gap:clamp(24px,3vw,44px)}
.about-portrait{width:min(100%,360px);overflow:visible;background:transparent}
.about-portrait::before{content:"";position:absolute;z-index:0;inset:-20px;pointer-events:none;border-radius:22px;background:linear-gradient(90deg,var(--bg),transparent 24%,transparent 76%,var(--bg)),linear-gradient(180deg,var(--bg),transparent 22%,transparent 78%,var(--bg)),url("./assets/zx-portrait-editorial.png") center 31%/cover no-repeat;filter:blur(10px);opacity:.34}
.about-portrait::after{display:none}
.about-portrait img{position:relative;z-index:1;border-radius:8px;-webkit-mask-image:none;mask-image:none;object-position:50% 31%;transform:none;filter:none;box-shadow:0 18px 48px rgba(16,24,40,.055)}
.about-portrait:hover img{transform:scale(1.01);filter:none}

/* Section handoffs and interaction transitions — v7 */
.note-button span{
  display:inline-block;
  transform-origin:50% 50%;
  transition:transform .32s cubic-bezier(.22,1,.36,1);
}
.note-button[aria-expanded="true"] span{transform:rotate(180deg)}
.note-extra{
  overflow:clip;
  transform-origin:top;
  will-change:height,opacity,transform;
}

.lightbox{
  opacity:0;
  transition:opacity .34s cubic-bezier(.22,1,.36,1);
}
.lightbox.is-visible{opacity:1}
.lightbox figure img{
  opacity:1;
  transition:opacity .2s ease;
}
.lightbox.is-shared-transition figure img{opacity:0}
.lightbox figcaption{
  opacity:0;
  transform:translateY(10px);
  transition:opacity .32s .16s ease,transform .42s .12s cubic-bezier(.22,1,.36,1);
}
.lightbox.is-visible figcaption{opacity:1;transform:none}
.shared-gallery-clone{
  position:fixed;
  z-index:10002;
  display:block;
  margin:0;
  object-fit:cover;
  pointer-events:none;
  box-shadow:0 28px 90px rgba(23,66,142,.2);
  will-change:top,left,width,height,border-radius;
}

.visual{
  position:relative;
  --visual-origin-x:72%;
  --visual-radius:190vmax;
  --visual-ring-scale:1.8;
  --visual-ring-opacity:0;
  --last-gallery-saturation:1;
  clip-path:circle(var(--visual-radius) at var(--visual-origin-x) 0);
  will-change:clip-path;
}
.visual::before{
  content:"";
  position:absolute;
  z-index:3;
  left:var(--visual-origin-x);
  top:0;
  width:clamp(120px,18vw,270px);
  aspect-ratio:1;
  border:1px solid rgba(23,92,255,.26);
  border-radius:50%;
  transform:translate(-50%,-50%) scale(var(--visual-ring-scale));
  opacity:var(--visual-ring-opacity);
  pointer-events:none;
  will-change:transform,opacity;
}
.visual.is-fully-revealed{clip-path:none;will-change:auto}

.notes{
  position:relative;
  isolation:isolate;
  --notes-line-scale:0;
  --notes-line-opacity:.18;
  --notes-glyph-opacity:0;
  --notes-glyph-y:48px;
  --notes-glyph-rotation:6deg;
}
.notes::before{
  content:"";
  position:absolute;
  z-index:0;
  left:var(--gutter);
  right:var(--gutter);
  top:clamp(50px,6vw,88px);
  height:1px;
  background:linear-gradient(90deg,var(--blue),var(--cyan),transparent 78%);
  transform:scaleX(var(--notes-line-scale));
  transform-origin:left;
  opacity:var(--notes-line-opacity);
  pointer-events:none;
}
.notes::after{
  content:"思";
  position:absolute;
  z-index:0;
  right:var(--gutter);
  top:clamp(8px,2vw,32px);
  color:var(--blue);
  font-family:serif;
  font-size:clamp(72px,10vw,150px);
  line-height:1;
  opacity:var(--notes-glyph-opacity);
  transform:translate3d(0,var(--notes-glyph-y),0) rotate(var(--notes-glyph-rotation));
  pointer-events:none;
  will-change:transform,opacity;
}
.visual .gallery-card:last-child img{
  filter:saturate(var(--last-gallery-saturation));
}
.notes>*{position:relative;z-index:1}

@media(max-width:560px){
  .about h2{font-size:clamp(24px,8.6vw,36px);white-space:nowrap}
  .visual{--visual-origin-x:50%}
  .notes::before{top:34px}
  .notes::after{top:4px;font-size:70px}
}

@media(prefers-reduced-motion:reduce){
  .note-button span{transition:none}
  .lightbox{opacity:1;transition:none}
  .lightbox figure img,.lightbox figcaption{opacity:1;transform:none;transition:none}
  .shared-gallery-clone{display:none}
  .visual,.visual.is-fully-revealed{clip-path:none;will-change:auto}
  .visual::before,.notes::before,.notes::after{display:none}
  .visual .gallery-card:last-child img{filter:none}
}
@media(max-width:900px){.about-portrait{width:min(100%,380px);justify-self:start}.about-grid{grid-template-columns:1fr}}
.record-link{cursor:pointer;transition:box-shadow .3s,filter .3s}.record-link:hover{box-shadow:0 26px 58px rgba(23,92,255,.22);filter:saturate(1.08)}

/* Photo curtain mobile crop and stable viewport sizing */
@media(max-width:560px){
  .page-transition{
    height:calc(100% + 84px);
    background-image:linear-gradient(rgba(4,13,22,.34),rgba(4,13,22,.34)),url("./assets/intro-curtain-cape-town-mobile.jpg");
    background-position:51% center;
    border-radius:0 0 50% 50% / 0 0 8% 8%;
  }
  .intro-greeting{
    top:50svh;
    max-width:calc(100vw - 40px);
    gap:10px;
    font-size:clamp(32px,8.8vw,38px);
  }
  .intro-dot{width:7px;height:7px}
}