/* Natural Touch — smooth motion layer v10
   Faster floating blocks, lower-jank scroll motion, no blur flicker. */
:root{
  --motion-ease:cubic-bezier(.22,.72,.28,1);
  --motion-fast:cubic-bezier(.2,.8,.2,1);
}
html{scroll-behavior:smooth}
body.motion-ready{overflow-x:hidden}

/* Entrance + exit motion */
.motion-block{
  --motion-x:0px;
  --motion-y:28px;
  --float-y:0px;
  --motion-scale:.992;
  opacity:0;
  transform:translate3d(var(--motion-x),calc(var(--motion-y) + var(--float-y)),0) scale(var(--motion-scale));
  transition:
    opacity .40s var(--motion-ease),
    transform .46s var(--motion-ease),
    box-shadow .22s ease;
  transition-delay:var(--motion-delay,0ms);
  backface-visibility:hidden;
  transform-style:preserve-3d;
}
.motion-block.motion-left{--motion-x:-26px;--motion-y:8px}
.motion-block.motion-right{--motion-x:26px;--motion-y:8px}
.motion-block.motion-rise{--motion-x:0px;--motion-y:30px}
.motion-block.motion-soft{--motion-x:0px;--motion-y:18px;--motion-scale:.985}
.motion-block.motion-in{
  opacity:1;
  transform:translate3d(0,var(--float-y),0) scale(1);
}
.motion-block.motion-out-up{
  opacity:.62;
  transform:translate3d(0,calc(-14px + var(--float-y)),0) scale(.997);
}
.motion-block.motion-out-down{
  opacity:.62;
  transform:translate3d(0,calc(14px + var(--float-y)),0) scale(.997);
}
.motion-block.motion-seen{
  transition-delay:0ms!important;
  transition-duration:.24s,.18s,.20s;
}

/* Faster floating cards */
.motion-card{transform-origin:center center}
.motion-card.motion-in:hover{
  transform:translate3d(0,calc(var(--float-y) - 6px),0) scale(1.008);
  box-shadow:var(--shadow,0 18px 40px rgba(0,0,0,.13));
}
.motion-card .service-photo img,
.motion-card .decor-img img,
.motion-card .story-media img,
.motion-card .detail-media img{
  transition:transform .34s var(--motion-fast),filter .24s ease;
  backface-visibility:hidden;
}
.motion-card:hover .service-photo img{transform:scale(1.045)}

/* Keep hero's existing Ken Burns animation; avoid competing scroll repaint effects. */
.hero-bg img{backface-visibility:hidden}
.hero-card.motion-block{transition-duration:.36s,.42s,.20s}

/* Buttons and controls */
.hero-actions .btn,.wa-btn,.mobile-wa,.float-wa{
  transition:transform .18s var(--motion-fast),box-shadow .18s ease,filter .18s ease,background-color .18s ease,color .18s ease,border-color .18s ease!important;
}
.hero-actions .btn:hover,.wa-btn:hover,.mobile-wa:hover,.float-wa:hover{transform:translateY(-3px) scale(1.014)!important}
.hero-actions .btn:active,.wa-btn:active,.mobile-wa:active,.float-wa:active{transform:translateY(0) scale(.988)!important}

/* Navigation and footer micro-interactions */
.desktop-nav>a,.menu-trigger,.mega a,.drawer>a,.drawer>button,.footer a{transition:transform .16s ease,opacity .16s ease,color .16s ease,background-color .16s ease}
.desktop-nav>a:hover,.menu-trigger:hover{transform:translateY(-2px)}
.mega a:hover{transform:translateX(4px)}
.footer a:hover{transform:translateX(3px)}
.socials span{transition:transform .18s var(--motion-fast),filter .18s ease}
.socials span:hover{transform:translateY(-4px) rotate(-2deg) scale(1.05);filter:saturate(1.06)}

/* Floating WhatsApp */
@keyframes wa-breathe-fast{0%,100%{box-shadow:0 14px 30px rgba(0,0,0,.18)}50%{box-shadow:0 16px 34px rgba(0,0,0,.24),0 0 0 6px rgba(32,211,102,.09)}}
.float-wa{animation:wa-breathe-fast 3s ease-in-out infinite}

/* Headings */
.motion-heading{opacity:0;transform:translateY(14px);transition:opacity .34s var(--motion-ease),transform .40s var(--motion-ease)}
.motion-heading.motion-in{opacity:1;transform:none}
.motion-heading.motion-seen{transition-duration:.20s,.24s}

/* Tablet/mobile */
@media(max-width:1024px){
  .motion-block{--motion-y:22px}
  .motion-block.motion-left,.motion-block.motion-right{--motion-x:0px;--motion-y:22px}
  .motion-card.motion-in:hover{transform:translate3d(0,var(--float-y),0) scale(1)}
}
@media(max-width:680px){
  .motion-block{--motion-y:16px;transition-duration:.30s,.34s,.18s}
  .motion-block.motion-seen{transition-duration:.20s,.16s,.18s}
  .float-wa{animation:none}
}

/* Accessibility */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto!important}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .motion-block,.motion-heading{opacity:1!important;transform:none!important}
}
