/* A personal visual language: an orbit connecting science and humanity. */
.personal-note{background:#eeeae5;padding:70px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-bottom:40px}
.personal-shortcut{display:inline-flex;gap:16px;margin-top:16px;font-size:12px;border-bottom:1px solid var(--taupe);padding-bottom:4px;color:var(--taupe-dark)}.personal-shortcut:hover{color:var(--ink)}
.personal-note .wrap{display:grid;grid-template-columns:.85fr 1.15fr;gap:70px;align-items:center}
.personal-copy h2{font-size:clamp(38px,4.4vw,58px);margin-bottom:25px}.personal-copy h2 em{color:#7f3643}
.personal-copy p:not(.kicker){font-size:15px;line-height:1.85;color:var(--ink-2);margin-bottom:17px;max-width:400px}
.personal-signature{display:block;font-family:var(--serif);font-style:italic;font-size:28px;color:#7f3643;margin-top:30px}
.personal-photo{padding:10px 10px 17px;background:var(--white);border:1px solid #ded7ce;border-radius:5px;box-shadow:0 25px 60px -40px #203c3555;transform:rotate(1deg)}
.personal-frame{position:relative}.personal-frame img{display:block;width:100%;height:auto;border-radius:2px}
.personal-photo figcaption{text-align:center;font-size:11px;color:var(--ink-2);margin-top:13px}
@media(max-width:760px){.personal-note{padding:60px 0}.personal-note .wrap{grid-template-columns:1fr;gap:32px}.personal-copy p:not(.kicker){max-width:none}.personal-photo{max-width:540px;margin:auto}}
.story-portraits{position:relative;padding:0 25px 140px 0;max-width:450px;width:100%;margin:auto}
.clinical-portrait{position:absolute;right:-5px;bottom:0;width:52%;padding:7px 7px 13px;background:var(--white);border:1px solid var(--line);box-shadow:0 16px 32px -20px #203c3560;transform:rotate(5deg);transition:transform .8s ease}
.clinical-frame{position:relative;aspect-ratio:3/4;overflow:hidden}
.clinical-frame img{width:100%;height:100%;object-fit:cover;object-position:50% 55%;filter:saturate(.8)}
.clinical-portrait figcaption{font-family:var(--serif);font-size:17px;text-align:center;line-height:1.2;margin-top:10px}
.clinical-frame .photo-expand{top:9px;right:9px;width:32px;height:32px}
@media(hover:hover){.clinical-portrait:hover{transform:rotate(0)}}
@media(max-width:640px){.story-portraits{max-width:340px;padding:0 18px 130px 0}.clinical-portrait{right:0;width:51%}.clinical-portrait figcaption{font-size:15px}}
.hero{position:relative;background:radial-gradient(ellipse at 83% 42%,#e1e8d88c,transparent 48%)}
.hero-photo{isolation:isolate;perspective:1000px}
.hero-photo .frame{aspect-ratio:4/5;border-radius:180px 180px 8px 8px;box-shadow:0 25px 65px -40px #203c3580;transform:rotate(-2deg);transition:transform 1s cubic-bezier(.2,.7,.2,1)}
.hero-photo .frame img{object-position:50% 12%;transform:scale(1.01);filter:saturate(.9) contrast(.98);transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.hero-photo:before{inset:14px -2px 16px 20px;transform:rotate(3deg);border-color:#a9b99d}
.portrait-orbit{position:absolute;inset:-38px -40px -25px -40px;width:calc(100% + 80px);height:calc(100% + 63px);color:#8b9e734f;z-index:-1;pointer-events:none;animation:orbit-drift 18s ease-in-out infinite alternate}
.photo-caption{border-radius:3px;transform:rotate(1deg);bottom:0}.caption-icon{display:inline-block;animation:compass 28s linear infinite}
.hero h1 em{position:relative}.hero h1 em:after{content:'';display:block;position:absolute;left:2%;bottom:0;width:94%;height:7px;border-bottom:1px solid #99aa7d;border-radius:50%;transform:rotate(-2deg);opacity:.7}
.hero-foot:before{width:40px}.phone{aspect-ratio:4/5;border-radius:6px;transform:rotate(-3deg);border:9px solid var(--white);box-shadow:0 20px 50px -30px #203c3570;transition:transform .8s ease}.phone .screen{border-radius:1px}.phone .screen img{object-position:54% 25%;filter:saturate(.8);transition:transform 1.2s ease}.phone .tag{bottom:12px;left:10px;right:10px;background:#fffef9ed}.story .wrap{align-items:center}
.proj .thumb:has(img){background:#c5ad88;position:relative;aspect-ratio:4/3}.proj .thumb img{object-fit:contain;object-position:center;filter:saturate(.85);transition:transform .8s ease}.proj .thumb{aspect-ratio:4/3}.project-art:before{animation:art-drift 15s ease-in-out infinite alternate}.project-art:after{animation:art-drift 19s ease-in-out infinite alternate-reverse}.proj{transition:transform .6s cubic-bezier(.2,.7,.2,1),box-shadow .6s}.project-link span,.hero-actions .btn span{transition:transform .3s ease}.nav-links a{position:relative}.nav-links a:after{content:'';position:absolute;left:0;bottom:-7px;height:1px;width:100%;background:var(--ink);transform:scaleX(0);transform-origin:left;transition:transform .35s}.nav-links a:hover:after,.nav-links a[aria-current]:after{transform:scaleX(1)}
.photo-expand{position:absolute;top:22px;right:18px;z-index:3;display:grid;place-items:center;width:38px;height:38px;border:1px solid #ffffff80;border-radius:50%;background:#fffef9e8;color:var(--ink);cursor:pointer;font-size:21px;box-shadow:0 3px 16px #203c3520;transition:background .2s,transform .3s}.hero-photo .photo-expand{top:auto;bottom:100px;right:24px}.phone .photo-expand{top:14px;right:14px}.photo-expand:hover{background:#fff;transform:scale(1.08)}
.photo-dialog{margin:auto;padding:55px 20px 18px;max-width:min(95vw,1100px);max-height:94dvh;width:fit-content;border:1px solid #c3cbb8;border-radius:7px;background:var(--cream);color:var(--ink);box-shadow:0 25px 100px #0005}.photo-dialog::backdrop{background:#122720de;backdrop-filter:blur(9px)}.photo-dialog>img{max-width:100%;max-height:calc(90dvh - 120px);width:auto;object-fit:contain;margin:auto;border-radius:2px}.photo-dialog>p{text-align:center;font-size:12px;margin-top:13px}.photo-close{position:absolute;right:18px;top:13px;background:none;border:0;color:var(--ink);font:inherit;font-size:12px;cursor:pointer;display:flex;gap:15px;align-items:center}.photo-close span{font-size:24px}
.motion-toggle{position:fixed;bottom:18px;right:18px;z-index:45;display:flex;align-items:center;gap:9px;padding:10px 14px;border:1px solid #c0ccb8;border-radius:100px;background:#fffef9ed;backdrop-filter:blur(10px);color:var(--ink);font:inherit;font-size:10px;letter-spacing:.06em;cursor:pointer;box-shadow:0 4px 18px #203c3510}.motion-toggle span{font-size:14px}.motion-paused *,.motion-paused *:before,.motion-paused *:after{animation-play-state:paused!important;transition:none!important}.motion-paused{scroll-behavior:auto}
@keyframes orbit-drift{from{transform:rotate(-5deg) translateY(0)}to{transform:rotate(5deg) translateY(-9px)}}
@keyframes compass{to{transform:rotate(360deg)}}
@keyframes art-drift{from{translate:0 -8px}to{translate:15px 10px}}
@media(hover:hover) and (pointer:fine){.hero-photo:hover .frame{transform:rotate(0)}.hero-photo:hover .frame img{transform:scale(1.04)}.phone:hover{transform:rotate(0)}.phone:hover img{transform:scale(1.035)}.proj:hover{transform:translateY(-7px);box-shadow:0 24px 45px -25px #203c3550}.project-link:hover span,.hero-actions .btn:hover span{transform:translate(3px,-2px)}}
@media(max-width:980px){.hero-photo .frame{border-radius:140px 140px 6px 6px}.proj:last-child .thumb{aspect-ratio:auto}}
@media(max-width:640px){.hero-photo{max-width:335px;margin:10px auto 0}.hero-photo .frame{aspect-ratio:4/4.7;border-radius:150px 150px 6px 6px}.hero h1{font-size:clamp(41px,10.6vw,56px)}.portrait-orbit{inset:-25px -20px;width:calc(100% + 40px);height:calc(100% + 50px)}.photo-caption{left:-5px;right:8px}.phone{max-width:290px}.proj:last-child .thumb{aspect-ratio:4/3}.motion-toggle{bottom:12px;right:12px;padding:9px 12px}.photo-dialog{max-width:95vw;padding:50px 12px 15px}.photo-index{display:none}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}html{scroll-behavior:auto}}
