/* Homepage hover and press feedback. Additive only: section layout and design are untouched.
   Hover motion runs only with a real pointer; reduced motion keeps colour changes and drops movement. */
.home-page{--hm-ease:cubic-bezier(.23,1,.32,1)}

/* Transitions extended (existing colour transitions kept, transform added). */
.material-story-photo img{transition:filter .6s ease}
.material-story-icon{transition:transform .35s var(--hm-ease),stroke .2s ease}
.material-story-features strong{transition:color .2s ease}
.material-story-cta-circle{transition:background .25s,color .25s,transform .16s var(--hm-ease)}
.material-story-cta-circle svg{transition:transform .3s var(--hm-ease)}
.material-story-cta-label{display:inline-block;transition:transform .3s var(--hm-ease)}
.showcase-caption h3{transition:transform .35s var(--hm-ease)}
.filter{transition:transform .16s var(--hm-ease)}
.artemo-room-swatch span{transition:transform .25s var(--hm-ease)}
.artemo-room-actions a{transition:background .2s,color .2s,transform .16s var(--hm-ease)}
.artemo-room-actions a svg{transition:transform .3s var(--hm-ease)}
.artemo-footer-nav a{transition:color .2s,transform .3s var(--hm-ease)}
.artemo-footer-social svg{transition:transform .3s var(--hm-ease)}

/* Press feedback on every control. */
.home-page .filter:active,.home-page .artemo-room-actions a:active{transform:scale(.97)}
.home-page .material-story-cta:active .material-story-cta-circle{transform:scale(.94)}
.home-page .artemo-room-swatch:active span{transform:scale(.9)}

@media(hover:hover) and (pointer:fine){
 /* Materials: the photograph warms, icons lift, the arrow leads the way. */
 .material-story-photo:hover img{filter:saturate(1.08) brightness(1.04)}
 .material-story-features li:hover .material-story-icon{transform:translateY(-4px) rotate(-6deg);stroke:#493322}
 .material-story-features li:hover strong{color:#8d663d}
 .material-story-cta:hover .material-story-cta-circle svg{transform:translateX(-5px)}
 .material-story-cta:hover .material-story-cta-label{transform:translateY(2px)}
 /* Models: name slides toward the arrow, the arrow nudges forward. */
 .showcase-card:hover .showcase-caption h3{transform:translateX(-5px)}
 /* Room: swatches grow under the pointer, the action arrow moves. */
 .artemo-room-swatch:hover span{transform:scale(1.12)}
 .artemo-room-actions a:hover svg{transform:translateX(-4px)}
 /* Footer: links step in, social icons lift. */
 .artemo-footer-nav a:hover{transform:translateX(-4px)}
 .artemo-footer-social:not(:disabled):hover svg{transform:translateY(-2px)}
}
@media(prefers-reduced-motion:reduce){
 .material-story-icon,.material-story-cta-circle,.material-story-cta-circle svg,.material-story-cta-label,.showcase-caption h3,.filter,.artemo-room-swatch span,.artemo-room-actions a,.artemo-room-actions a svg,.artemo-footer-nav a,.artemo-footer-social svg{transition:none!important;transform:none!important}
}

/* Round arrow on product cards (tablets and up). */
.showcase-arrow{transition:background .25s,color .25s,transform .3s var(--hm-ease)}
.showcase-arrow svg{transition:transform .3s var(--hm-ease)}
@media(hover:hover) and (pointer:fine){.showcase-card:hover .showcase-arrow svg{transform:translateX(-3px)}}
@media(prefers-reduced-motion:reduce){.showcase-arrow svg{transition:none!important;transform:none!important}}