/* Shared motion on every page: headings rise word by word, marked blocks float in.
   Quiet by design; everything holds still for people who prefer less motion. */
:root{--ease:cubic-bezier(.2,.7,.2,1)}
.motion [data-reveal]{opacity:0;transform:translateY(42px);transition:opacity 1.1s var(--ease),transform 1.1s var(--ease);transition-delay:var(--d,0ms)}
.motion [data-reveal].in{opacity:1;transform:none}
.motion .split .w{display:inline-block;opacity:0;transform:translateY(.45em);transition:opacity .9s var(--ease),transform .9s var(--ease);transition-delay:calc(var(--i) * 60ms)}
.motion .split.in .w{opacity:1;transform:none}
/* Arrows stretch a little on hover */
.button .arrow,.text-link .arrow,.menu-more .arrow{transition:width .4s var(--ease)}
.button:hover .arrow,.text-link:hover .arrow,.menu-more:hover .arrow{width:36px}
/* "Not Linh?" in the greeting bar */
.preview .not-me{margin-left:14px;padding:0;font-size:9px;letter-spacing:1px;color:#d1ccc2;border-bottom:1px solid rgba(209,204,194,.5);text-transform:none}
.preview .not-me:hover{color:#fff;border-color:#fff}
@media(prefers-reduced-motion:reduce){.motion [data-reveal],.motion .split .w{opacity:1!important;transform:none!important;transition:none}}
