/* The opening title uses the real hero's measured typography and position. */
.opening{display:block;background:transparent;animation:opening-failsafe 0s 4.5s forwards;overflow:hidden}
.opening[hidden]{display:none}
.opening-veil{position:absolute;inset:0;background:#080808}
.opening-panels{position:absolute;inset:0;display:grid;grid-template-columns:1fr 1fr;pointer-events:none}
.opening-panels>span{background:#080808}
.opening-name{position:absolute;font-family:Arial,sans-serif;font-weight:700;white-space:nowrap;transform-origin:left top}
/* Typing caret for the homepage intro. */
.opening-caret{position:absolute;background:#fff;animation:caret-blink .9s steps(1) infinite}
@keyframes caret-blink{50%{visibility:hidden}}
.skip-intro{z-index:2}
.intro-running #hero-title{opacity:0}
.intro-running .hero-montage,.intro-running .hero-identity{animation:none}
.intro-running .hero-identity p,.intro-running .hero-footer,.intro-running .site-header{animation:opening-detail .6s 2.5s both}
@keyframes opening-detail{from{opacity:0;translate:0 8px}to{opacity:1;translate:0 0}}
@keyframes opening-failsafe{to{visibility:hidden;pointer-events:none}}

.about-grid{grid-template-columns:1.2fr 1fr;gap:8%}
.portrait{width:100%}
.portrait img{width:100%;height:auto;aspect-ratio:auto;object-fit:contain;filter:none}
@media(max-width:760px){
  .about-grid{grid-template-columns:1fr;gap:40px}
}
/* A single quiet entrance: slight upward movement and a soft blur clearing. */
.soft-reveal{animation:soft-rise .9s cubic-bezier(.22,.61,.36,1) both,soft-clarity .75s cubic-bezier(.25,.1,.25,1) both}
@keyframes soft-rise{from{translate:0 24px}to{translate:0 0}}
@keyframes soft-clarity{from{filter:blur(4px);opacity:.65}to{filter:blur(0);opacity:1}}
.motion-off .soft-reveal,.studio-motion-off .soft-reveal,.soft-reveal:focus-within{animation:none;translate:none;filter:none;opacity:1}
@media(prefers-reduced-motion:reduce){.opening{display:none}.soft-reveal{animation:none;translate:none;filter:none;opacity:1}}