/* Motion enhances the existing layout; nothing relies on animation to be visible. */
.button,.seo-button{position:relative;isolation:isolate;overflow:hidden;transition:transform .24s cubic-bezier(.2,.8,.2,1),box-shadow .24s ease}
.button::after,.seo-button::after{content:'';position:absolute;pointer-events:none;inset:-90% auto -90% -60%;width:38%;background:linear-gradient(90deg,transparent,#ffffff30,transparent);transform:rotate(20deg) translateX(-150%)}
.button .icon,.text-link .icon,.seo-button>span,.seo-guide-card h3>span{transition:transform .24s cubic-bezier(.2,.8,.2,1)}
.feature-card,.guide-grid>a,.seo-guide-card{transition:translate .3s cubic-bezier(.16,1,.3,1),box-shadow .3s ease,border-color .3s ease}
.preview-nav label{transition:background .22s ease,color .22s ease,box-shadow .22s ease}
.preview-nav .app-object,.feature-label .app-object,.header-links .instagram-link svg,.seo-links .instagram-link svg{transition:transform .3s cubic-bezier(.2,.8,.2,1)}
.tour-panel{animation:la-panel-reveal .42s cubic-bezier(.16,1,.3,1) both}
.faq-list details[open]>p,.seo-faq details[open]>p{animation:la-answer-reveal .28s ease both}
.faq-list summary::after,.seo-faq summary::after{transition:transform .22s ease}
.faq-list details[open] summary::after,.seo-faq details[open] summary::after{transform:rotate(180deg)}
@keyframes la-panel-reveal{from{opacity:.2;translate:0 10px}to{opacity:1;translate:0 0}}
@keyframes la-answer-reveal{from{opacity:0;translate:0 -5px}to{opacity:1;translate:0 0}}
@keyframes la-button-sheen{from{left:-60%}to{left:180%}}
@keyframes la-heart-greet{0%,100%{transform:scale(1)}25%{transform:scale(1.15)}45%{transform:scale(1)}65%{transform:scale(1.09)}}
@media(hover:hover) and (pointer:fine){
 .button:hover::after,.seo-button:hover::after{animation:la-button-sheen .85s ease}
 .button:hover .icon,.text-link:hover .icon,.seo-button:hover>span,.seo-guide-card:hover h3>span{transform:translateX(4px)}
 .feature-card:hover,.guide-grid>a:hover,.seo-guide-card:hover{translate:0 -5px;box-shadow:0 17px 40px #142b4a12}
 .feature-card:hover .feature-label .app-object,.preview-nav label:hover .app-object{transform:translateY(-3px) rotate(-7deg) scale(1.06)}
 .reflect-feature:hover .app-heart,.app-breather:hover>.app-object{animation:la-heart-greet .8s ease}
 .instagram-link:hover svg{transform:rotate(-8deg) scale(1.1)}
 .button:active,.seo-button:active{transform:translateY(0) scale(.97)}
}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 .button,.seo-button,.button .icon,.text-link .icon,.seo-button>span,.seo-guide-card h3>span,.feature-card,.guide-grid>a,.seo-guide-card,.preview-nav label,.preview-nav .app-object,.feature-label .app-object,.instagram-link svg,.faq-list summary::after,.seo-faq summary::after{transition:none!important}
 .tour-panel,.faq-list details[open]>p,.seo-faq details[open]>p,.button::after,.seo-button::after,.app-heart,.app-breather>.app-object{animation:none!important}
 .feature-card:hover,.guide-grid>a:hover,.seo-guide-card:hover{translate:none}
 .button:hover,.seo-button:hover,.button:active,.seo-button:active,.button:hover .icon,.text-link:hover .icon,.seo-button:hover>span,.seo-guide-card:hover h3>span,.feature-card:hover .feature-label .app-object,.preview-nav label:hover .app-object,.instagram-link:hover svg{transform:none}
}