/* A signature in motion. The 3D letters, not page chrome, carry the experience. */
.signature-version{--paper:#e4e3df;--ink:#242426;--muted:#656366;background:var(--paper)}
.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;margin:-1px!important;padding:0!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.signature-version .nav-shell{position:absolute;inset:0 var(--pad) auto;margin:0;height:99px;z-index:8;border-color:#bfbdba}
.signature-version .brand-mark{height:32px;width:32px}.signature-version .brand{font-size:13px}.signature-version .brand-doctor{font-size:9px}.signature-version .contact-nav{padding:11px 17px;background:#262529}.signature-version .contact-nav:hover{background:var(--accent)}
.name-story{height:330svh;position:relative;background:#e4e3df;isolation:isolate}.name-pin{position:sticky;top:0;height:100svh;min-height:680px;overflow:hidden;background:#e4e3df;transition:background .5s;color:#242426;isolation:isolate}.name-stage{position:absolute;inset:106px 0 158px;z-index:0;pointer-events:none}.name-poster{display:block;width:100%;height:100%;position:absolute;inset:0;transition:opacity .35s}.name-poster img{width:100%;height:100%;object-fit:contain;display:block}.name-stage canvas{display:block;position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity .4s}.name-story.is-ready .name-stage canvas{opacity:1}.name-story.is-ready .name-poster{opacity:0}.name-mast{position:absolute;top:125px;left:var(--pad);right:var(--pad);display:flex;justify-content:space-between;font-size:11px;line-height:1.65;color:#656366;z-index:2;pointer-events:none}.name-mast span:last-child{text-align:end}.name-phase{position:absolute;left:var(--pad);right:var(--pad);bottom:102px;z-index:3;display:flex;justify-content:space-between;align-items:flex-end;will-change:transform,opacity;pointer-events:none}.name-phase[data-phase="1"],.name-phase[data-phase="2"]{opacity:0;visibility:hidden;top:32%;bottom:auto;left:8vw;right:auto;max-width:52vw}.name-phase a{pointer-events:auto}.name-phase h2{font-size:clamp(31px,3.2vw,52px);font-weight:600;letter-spacing:-.04em;line-height:1.08;max-width:650px}.name-introduction h2 span{color:var(--accent)}.name-phase p{font-size:12px;line-height:1.8;margin-top:18px;max-width:370px;color:#656366}.name-introduction>div{display:flex;align-items:flex-end;gap:65px}.name-introduction p{max-width:240px;margin:0 0 3px;line-height:1.7;font-size:11px}.name-judgment h2,.name-systems h2{font-size:clamp(55px,7vw,116px)}.name-judgment p,.name-systems p{font-size:15px;line-height:1.9;max-width:380px;margin-top:28px}.name-scroll{font-size:11px;display:flex;align-items:center;gap:15px;padding-bottom:5px}.scroll-track{height:52px;width:1px;background:#b7b3b1;position:relative;overflow:hidden}.scroll-track i{width:1px;height:20px;display:block;background:#343238;animation:scrollLine 2.5s cubic-bezier(.7,0,.3,1) infinite}.signature-work{display:inline-flex;align-items:center;gap:25px;margin-top:30px;border-bottom:1px solid currentColor;padding:0 0 9px;font-size:13px;font-weight:600}.signature-work:hover .icon{transform:translate(3px,-3px)}.signature-work .icon{transition:transform .4s}.name-bottom{position:absolute;left:var(--pad);right:var(--pad);bottom:0;z-index:4;height:69px;display:flex;align-items:center;justify-content:space-between;border-top:1px solid #bab7b4;gap:20px}.name-chapters{display:flex;gap:28px}.name-chapters button{font-size:10px;position:relative;padding:15px 0;color:#656366;transition:color .3s}.name-chapters button:before{content:'';display:inline-block;width:5px;height:5px;background:currentColor;border-radius:50%;margin-inline-end:9px;opacity:0;transition:opacity .3s}.name-chapters .is-active{color:#242426}.name-chapters .is-active:before{opacity:1}.name-options{display:flex;align-items:center;gap:28px;font-size:10px;color:#565258}.name-options button{display:flex;align-items:center;gap:8px;font-size:10px;padding:13px 0}.name-options .icon{width:13px;height:13px}.name-options a{text-decoration:underline;text-underline-offset:4px}.name-progress{position:absolute;height:1px;top:-1px;left:0;right:0;pointer-events:none}.name-progress-fill{display:block;height:100%;width:100%;background:#6d49ad;transform:scaleX(0);transform-origin:left}.story-jump{position:absolute;top:40%;height:1px;width:1px}.name-story.is-static{height:100svh}.is-static .name-phase[data-phase="1"],.is-static .name-phase[data-phase="2"]{display:none}.is-static .name-chapters,.is-static .name-scroll{display:none}.is-static .name-bottom{justify-content:flex-end}.signature-version .work-section{position:relative;z-index:5;padding-top:110px}.signature-version .section-intro{margin-bottom:60px}.signature-version .section-intro h2{font-size:clamp(42px,5vw,82px)}.signature-version .approach-section{background:#b7a4d9}.signature-version .contact-section{background:#e4e3df}.signature-version .contact-heading h2{font-size:clamp(70px,11vw,180px)}
@keyframes scrollLine{0%{transform:translateY(-20px)}70%,100%{transform:translateY(70px)}}
@media(min-width:1600px){.name-stage{inset:125px 0 190px}.name-phase{bottom:115px}}
@media(max-height:760px) and (min-width:601px){.name-pin{min-height:620px}.name-stage{inset:115px 0 160px}.name-mast{top:116px}.name-phase h2{font-size:32px}.name-phase p{font-size:10px}.name-phase[data-phase="1"],.name-phase[data-phase="2"]{top:30%}.name-judgment h2,.name-systems h2{font-size:72px}}
@media(max-width:1000px){.name-introduction>div{gap:30px}.name-introduction p{font-size:10px;max-width:190px}.name-chapters{gap:14px}.name-options{gap:18px}.name-stage{inset:140px 0 190px}.name-phase{bottom:110px}.name-mast{font-size:10px}.name-phase[data-phase="1"],.name-phase[data-phase="2"]{left:var(--pad)}.name-judgment h2,.name-systems h2{font-size:60px}.name-judgment p,.name-systems p{font-size:13px}}
@media(max-width:600px){.signature-version .nav-shell{height:83px}.signature-version .brand{font-size:11px}.signature-version .brand-doctor{font-size:8px}.signature-version .contact-nav{font-size:10px;padding:10px 12px}.name-story{height:300svh}.name-pin{min-height:700px}.name-stage{inset:120px -10px 236px}.name-mast{top:104px;font-size:8px;gap:20px;line-height:1.7}.name-mast span:first-child{max-width:190px}.name-mast span:last-child{max-width:110px}.name-phase{bottom:111px}.name-introduction>div{display:block}.name-phase h2{font-size:32px;line-height:1.1;max-width:350px}.name-introduction p{font-size:10px;line-height:1.8;margin-top:14px;max-width:270px}.name-scroll{font-size:0;gap:0;position:absolute;right:0;bottom:4px}.name-scroll .scroll-track{height:45px}.name-bottom{height:82px;align-items:flex-start;flex-wrap:wrap;gap:0;padding-top:8px;padding-bottom:11px}.name-chapters{width:100%;justify-content:space-between;gap:7px}.name-chapters button{font-size:8px;padding:8px 0}.name-chapters button:before{width:4px;height:4px;margin-inline-end:5px}.name-options{width:100%;justify-content:space-between;font-size:9px}.name-options button{font-size:9px;padding:3px 0}.name-options .icon{height:12px;width:12px}.name-phase[data-phase="1"],.name-phase[data-phase="2"]{top:auto;bottom:114px;left:var(--pad);right:var(--pad);max-width:none}.name-judgment h2,.name-systems h2{font-size:39px}.name-judgment p,.name-systems p{font-size:11px;margin-top:14px;line-height:1.7}.signature-work{margin-top:15px;font-size:10px;gap:20px;padding-bottom:5px}.signature-work .icon{height:16px;width:16px}.name-story.is-static{min-height:700px}.is-static .name-bottom{height:57px}.signature-version .work-section{padding-top:70px}.signature-version .section-intro h2{font-size:38px}.signature-version .section-intro{margin-bottom:35px}.signature-version .contact-heading h2{font-size:16vw}}
@media(max-width:360px){.name-phase h2{font-size:29px}.name-stage{inset:125px -7px 236px}.name-judgment h2,.name-systems h2{font-size:35px}.name-introduction p{font-size:9px}}
html[dir=rtl] .name-phase h2{letter-spacing:0;line-height:1.4}html[dir=rtl] .name-phase[data-phase="1"],html[dir=rtl] .name-phase[data-phase="2"]{left:auto;right:var(--pad)}html[dir=rtl] .name-introduction h2{font-size:clamp(28px,2.8vw,46px)}html[dir=rtl] .name-chapters button{font-family:'Noto Arabic',sans-serif}html[dir=rtl] .name-stage{direction:ltr}html[dir=rtl] .name-progress-fill{transform-origin:right}
@media(max-width:600px){html[dir=rtl] .name-introduction h2{font-size:27px}html[dir=rtl] .name-judgment h2,html[dir=rtl] .name-systems h2{font-size:32px}html[dir=rtl] .name-scroll{right:auto;left:0}html[dir=rtl] .name-phase[data-phase="1"],html[dir=rtl] .name-phase[data-phase="2"]{left:var(--pad)}html[dir=rtl] .name-introduction p{font-size:10px}}
@media(prefers-reduced-motion:reduce){html:not(.motion-opted-in) .name-story{height:100svh}html:not(.motion-opted-in) .name-scroll,html:not(.motion-opted-in) .name-chapters{display:none}.scroll-track i{animation:none}.name-stage canvas,.name-poster{transition:none}html:not(.motion-opted-in) .name-bottom{justify-content:flex-end}}
/* The final assembled name gets the same protected lower caption as the opening. */
.name-phase[data-phase="2"]{top:auto;bottom:102px;left:var(--pad);right:var(--pad);max-width:none}
.name-systems>div{display:flex;align-items:flex-end;gap:60px;width:100%}.name-systems h2{font-size:42px}.name-systems p{font-size:11px;margin:0;line-height:1.7}.name-systems .signature-work{margin:0 0 2px auto;font-size:12px}
@media(max-width:1000px){.name-systems>div{gap:30px}.name-systems h2{font-size:36px}.name-systems p{font-size:10px}}
@media(max-width:600px){.name-phase[data-phase="2"]{bottom:111px}.name-systems>div{display:block}.name-systems h2{font-size:30px}.name-systems p{font-size:10px;margin-top:10px}.name-systems .signature-work{position:absolute;right:0;bottom:0;font-size:9px;gap:12px;max-width:105px}.name-systems .signature-work .icon{height:14px;width:14px}html[dir=rtl] .name-systems h2{font-size:27px}html[dir=rtl] .name-systems .signature-work{right:auto;left:0}}
@media(min-width:601px){.name-phase[data-phase="1"]{max-width:43vw}.name-judgment h2{font-size:clamp(50px,6vw,96px)}}

/* Phone captions stay readable alongside the monumental letterforms. */
@media(max-width:600px){
 .name-pin,.name-story.is-static{min-height:100svh}
 .name-mast{font-size:10px}
 .name-introduction p,.name-judgment p,.name-systems p,html[dir=rtl] .name-introduction p{font-size:12px}
 .name-chapters button,.name-options,.name-options button,.name-systems .signature-work{font-size:11px}
 .name-systems p{max-width:220px}
 .name-systems .signature-work{max-width:100px;gap:10px}
}

@media(max-width:360px){.name-systems p{max-width:165px}.name-systems .signature-work{max-width:85px}}

@media(max-height:760px) and (min-width:601px){.name-judgment p{font-size:14px}}
