/* Original vector marks + a small, independently composited motion system. */
.hero { --px:0px; --py:0px; --bx:0px; --by:0px; }
.hero-content { position:static; z-index:auto; }
.hero-content>p,.hero-actions,.hero-note,.hero-bottom { position:relative; z-index:5; }
.hero-note { position:absolute; }
.hero h1 { position:relative; z-index:1; width:100%; margin-top:16px; line-height:0; }
.name-mark { display:block; width:100%; height:auto; overflow:visible; color:#efeee8; }
.mark-base { opacity:.48; }
.mark-trace { opacity:.8; }
.portrait-bg { z-index:0; transform:translate3d(var(--bx),var(--by),0); }
.hero-fog { z-index:0; pointer-events:none; }
.portrait-cutout { display:none; position:absolute; z-index:2; inset:40px 12% 0 28%; margin:0; pointer-events:none; transform:translate3d(var(--px),var(--py),0); }
.layered-ready .portrait-cutout { display:block; }
.portrait-cutout img { width:100%; height:100%; object-fit:contain; object-position:center top; mask:url('assets/brand/portrait-silhouette.svg') center top/contain no-repeat; }
.portrait-cutout::after { content:''; position:absolute; inset:0; background:linear-gradient(0deg,#191919 0%,transparent 34%); }
.hero-name-front { position:absolute; z-index:3; pointer-events:none; left:var(--mark-x,5%); top:var(--mark-y,70%); width:var(--mark-w,90%); visibility:hidden; clip-path:polygon(0 0,28% 0,28% 81%,86% 81%,86% 0,100% 0,100% 100%,0 100%); }
.layered-ready .hero-name-front { visibility:visible; }
.hero-name-front .mark-base { opacity:.7; }
.motion-enabled .mark-trace path { stroke-dasharray:100; animation:letter-draw 2.8s cubic-bezier(.3,.05,.2,1) both; }
.mark-trace path:nth-child(2n) { animation-delay:.15s; }
.mark-trace path:nth-child(3n) { animation-delay:.3s; }
@keyframes letter-draw { from { stroke-dashoffset:100; opacity:.08; } to { stroke-dashoffset:0; opacity:1; } }
.hero-light { position:absolute; inset:-10%; z-index:0; pointer-events:none; opacity:.34; }
.hero-light-cool { background:radial-gradient(ellipse at 25% 40%,#749dac45,transparent 40%); }
.hero-light-warm { background:radial-gradient(ellipse at 84% 32%,#bc794438,transparent 32%); }
.motion-enabled .hero.is-onstage .hero-light-cool { animation:cool-light 18s ease-in-out infinite alternate; }
.motion-enabled .hero.is-onstage .hero-light-warm { animation:warm-light 21s ease-in-out infinite alternate; }
@keyframes cool-light { to { transform:translate3d(3%,2%,0); opacity:.65; } }
@keyframes warm-light { to { transform:translate3d(-4%,1%,0); opacity:.6; } }
.story-text { isolation:isolate; overflow:hidden; --shine-x:50%; }
.story-text::before,.story-text::after { content:''; position:absolute; z-index:-1; pointer-events:none; }
.story-text::before { inset:0; border-radius:inherit; background:radial-gradient(ellipse at var(--shine-x) 0%,#ffffff1c,transparent 65%); box-shadow:inset 0 1px 1px #fff5,inset 1px 0 0 #ffffff21; }
.story-text::after { top:-50%; left:-50%; width:50%; height:200%; transform:rotate(24deg); background:linear-gradient(90deg,transparent,#e7eff512 45%,#fff2 50%,transparent 60%); }
.motion-enabled .story-text.is-onstage::after { animation:glass-reflection 14s ease-in-out infinite; }
@keyframes glass-reflection { 0%,18% { transform:translateX(0) rotate(24deg); opacity:0; } 35% { opacity:.55; } 67%,100% { transform:translateX(330%) rotate(24deg); opacity:0; } }
.story-signature img { width:min(230px,100%); height:auto; }
.personal-sign { width:260px; max-width:70%; height:auto; }
.motion-toggle { margin-left:16px; padding:8px 0; border:0; border-bottom:1px solid #efeee84a; color:inherit; background:transparent; cursor:pointer; font-size:11px; }
.motion-disabled .reveal { opacity:1!important; transform:none!important; }
.motion-disabled *,.motion-disabled *::before,.motion-disabled *::after { animation:none!important; scroll-behavior:auto!important; }
@media(max-width:699px) {
 .portrait-cutout { inset:48px -8% auto -8%; height:520px; }
 .portrait-cutout img { mask-image:url('assets/brand/portrait-silhouette.svg'),linear-gradient(180deg,#000 72%,transparent); mask-composite:intersect; }
 .portrait-cutout::after { background:linear-gradient(0deg,#191919,transparent 36%); }
 .hero h1 { min-height:54px; margin-top:0; }
 .hero-content .eyebrow { position:relative; top:auto; left:auto; }
 .hero-name-front { clip-path:none; opacity:.68; }
 .hero-light { opacity:.3; }
 .personal-sign { width:220px; }
}
@media(prefers-reduced-motion:reduce) {
 *,*::before,*::after { animation:none!important; scroll-behavior:auto!important; }
 .portrait-bg,.portrait-cutout { transform:none!important; }
 .mark-trace path { stroke-dasharray:none!important; }
}

/* Scroll choreography uses original letter paths, while the page scroll stays native. */
.type-chapter>div { overflow:hidden; padding-block:12px; }
.type-chapter .type-row { display:block; width:72%; margin-left:0; line-height:0; font-size:inherit; transform:translateX(var(--row-x,0px)) rotate(var(--row-rot,0deg)); transform-origin:50% 50%; }
.type-chapter .type-row:nth-child(2) { margin-left:20%; margin-top:-2%; }
.type-chapter .type-row:nth-child(3) { width:100%; margin-left:0; }
.type-chapter .type-row:nth-child(4) { width:78%; margin-left:8%; }
.type-chapter .type-row:nth-child(5) { width:66%; margin-left:34%; }
.keyword-mark { display:block; width:100%; height:auto; overflow:visible; }
.type-row.solid .keyword-mark g { fill:#e6e5df; stroke:none; }
.type-row.outline .keyword-mark g { fill:none; stroke:#efeee887; stroke-width:1.2; }
.work-entry-pending { opacity:.5; transform:translateY(22px); clip-path:inset(8% 0 0); }
.work-entry { animation:work-unfold .85s cubic-bezier(.2,.8,.2,1) both; animation-delay:var(--entry-delay,0ms); }
@keyframes work-unfold { from { opacity:.5; transform:translateY(22px); clip-path:inset(8% 0 0); } to { opacity:1; transform:none; clip-path:inset(0); } }
.photo-item .photo-button::after { content:'查看作品 ↗'; position:absolute; left:14px; bottom:14px; padding:7px 11px; border:1px solid #ffffff32; background:#191919bb; backdrop-filter:blur(8px); border-radius:20px; font:11px var(--sans); color:#f5f3ed; opacity:0; transform:translateY(5px); transition:opacity .25s,transform .3s; pointer-events:none; }
.photo-item .photo-button:hover::after,.photo-item .photo-button:focus-visible::after { opacity:1; transform:none; }
.photo-strip { padding-inline:6px; }
.strip-photo { transition:transform .5s cubic-bezier(.2,.8,.2,1),opacity .5s; transform:scale(.975); opacity:.86; }
.strip-photo.is-current { transform:scale(1.012) translateY(-3px); opacity:1; }
.photo-strip.is-dragging,.photo-strip.is-coasting,.album-grid.is-coasting { scroll-snap-type:none; scroll-behavior:auto; }
.photo-dialog .viewer-flight { position:fixed; display:block; margin:0; max-width:none; max-height:none; object-fit:fill; pointer-events:none; z-index:10; transform-origin:top left; }
.viewer-is-switching { animation:viewer-switch .35s ease-out; }
@keyframes viewer-switch { from { opacity:.3; transform:translateX(10px); } to { opacity:1; transform:none; } }
.motion-disabled .type-row { transform:none!important; }
.motion-disabled .work-entry-pending { opacity:1; transform:none; clip-path:none; }
.motion-disabled .strip-photo { transform:none; transition:none; opacity:1; }
@media(max-width:699px) {
 .type-chapter .type-row { width:88%; }
 .type-chapter .type-row:nth-child(2) { margin-left:12%; }
 .type-chapter .type-row:nth-child(3) { width:100%; }
 .type-chapter .type-row:nth-child(4) { width:88%; margin-left:4%; }
 .type-chapter .type-row:nth-child(5) { width:80%; margin-left:20%; }
 .photo-item .photo-button::after { content:'↗'; opacity:1; transform:none; left:auto; right:8px; bottom:8px; padding:5px 8px; }
 .strip-photo { transform:scale(.99); }
}
@media(prefers-reduced-motion:reduce) { .type-row,.strip-photo { transform:none!important; transition:none; } .work-entry-pending { opacity:1; transform:none; clip-path:none; } }