/* Entry motion: content remains available without JavaScript. */
@keyframes hero-enter{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@keyframes hero-actions-enter{from{opacity:0;transform:translateY(36px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:no-preference){
  .hero-inner>.hero-label,.hero-inner>h1,.hero-inner>.hero-bio,.hero-inner>.hero-actions{
    animation:hero-enter .5s cubic-bezier(.22,1,.36,1) both;
  }
  .hero-inner>.hero-bio{animation-delay:80ms}
  .hero-inner>.hero-actions{animation-name:hero-actions-enter;animation-duration:1.4s;animation-timing-function:cubic-bezier(.4,0,.2,1);animation-delay:300ms}
}
.hero-inner h1{position:relative}
.hero-inner h1.is-typing>span[data-i18n],.hero-inner h1.is-typing>em[data-i18n]{opacity:0}
.hero-typing-visual{position:absolute;inset:0;pointer-events:none}
.hero-typing-char{opacity:0}
.hero-typing-char.is-visible{opacity:1}
.hero-typing-char.is-cursor::after{content:"";display:inline-block;position:absolute;width:2px;height:.8em;background:var(--accent);margin-left:2px;transform:translateY(.1em)}
@media(prefers-reduced-motion:reduce){
  .hero-typing-visual{display:none}
  .hero-inner h1.is-typing>span[data-i18n],.hero-inner h1.is-typing>em[data-i18n]{opacity:1}
}

.hero-bio{position:relative}
.hero-bio.is-typing>.hero-typing-source{opacity:0}
@media(prefers-reduced-motion:reduce){.hero-bio.is-typing>.hero-typing-source{opacity:1}}

/* Header entrance keeps the fixed navigation and scroll styles intact. */
@keyframes header-enter{
  from{opacity:0;translate:0 -20px}
  to{opacity:1;translate:0 0}
}
@media(prefers-reduced-motion:no-preference){
  body[data-page="index"] .header{
    animation:header-enter 1.2s cubic-bezier(.4,0,.2,1) both;
  }
  body[data-page="index"] .header:focus-within{animation:none}
}
