/* Shared interaction rhythm. Keep movement small and content visible. */
html{scroll-behavior:smooth}
a{transition:color .18s ease,text-decoration-color .18s ease}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #79d5d2;outline-offset:5px}
.nav a{position:relative;text-decoration:none}
.nav a::after{content:"";position:absolute;left:0;right:100%;bottom:3px;height:2px;background:linear-gradient(90deg,#79d5d2,#a2dfa7);transition:right .24s ease}
.nav a:is(:hover,:focus-visible)::after{right:0}
.nav a:is(:hover,:focus-visible){color:#79d5d2}
.case-back,.reference-back,.flow-open,.persona-exhibit figcaption a,header>a{ text-underline-offset:5px;transition:color .18s ease,text-decoration-color .18s ease}
.case-back:is(:hover,:focus-visible),.reference-back:is(:hover,:focus-visible),.flow-open:is(:hover,:focus-visible),.persona-exhibit figcaption a:is(:hover,:focus-visible){color:#a7e6dc;text-decoration:underline}
button,.btn{transition:background-color .18s ease,color .18s ease,border-color .18s ease,box-shadow .18s ease,transform .18s ease}
.card,.wireframe-card{transition:border-color .2s ease,background-color .2s ease,box-shadow .2s ease,transform .2s ease}
.card:focus-within,.wireframe-card:focus-within{border-color:#79d5d2}
.persona-image-link,.flow-canvas{transition:box-shadow .2s ease}
.persona-image-link:focus-visible,.flow-canvas:focus-visible{outline:3px solid #79d5d2;outline-offset:5px}
@media(hover:hover) and (pointer:fine){
.wireframe-card:hover{border-color:#79d5d2;box-shadow:0 6px 16px #0002;transform:translateY(-2px)}
.persona-image-link:hover,.flow-canvas:hover{box-shadow:0 0 0 2px #79d5d2}
}
@media(prefers-reduced-motion:no-preference){
.case-hero h1,.case-hero .eyebrow,.case-hero .case-lead,.reference-intro,body:has(.persona-full) header{animation:site-enter .45s ease-out both}
.case-hero .case-lead{animation-delay:.06s}
@keyframes site-enter{from{opacity:0;translate:0 6px}to{opacity:1;translate:0 0}}
}
@media(prefers-reduced-motion:reduce){
html,:root{scroll-behavior:auto!important}
*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
.card:hover,.card:focus-within,.wireframe-card:hover,.btn:hover,.quote-entry:hover,.quote-entry:focus-within,.metric:hover b{transform:none!important}
}

/* Keep TravelKey screens upright while matching the component preview lift. */
.travelkey-preview img{transition:transform .35s ease}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
.card:hover .travelkey-preview img{transform:translateY(-5px)}
}
@media(prefers-reduced-motion:no-preference){
.card:focus-within .travelkey-preview img{transform:translateY(-5px)}
}

/* Match the portal preview lift to the existing project cards. */
.portal-card-screens img{transition:transform .35s ease}
.library-item{transition:border-color .2s ease,box-shadow .2s ease}
.library-item:focus-within{border-color:#79d5d2}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){.card:hover .portal-card-screens img{transform:translateY(-5px)}.library-item:hover{border-color:#79d5d2;box-shadow:0 6px 16px #0002}}
@media(prefers-reduced-motion:no-preference){.card:focus-within .portal-card-screens img{transform:translateY(-5px)}}
@media(prefers-reduced-motion:reduce){.portal-card-screens img,.library-item{transition:none!important}}