/* motion.css: все анимации макета, точные значения.
   Подключить на всех страницах. Селекторы совпадают с разметкой макета:
   .window, .toolbar, main > section, .card (карточки проектов), .lap/.pho (ноутбук и телефон на странице проекта),
   и для главной .hero-card, .home-right > *, .home-sticky, .home-badge, .home-socials .icon-btn.
   Важно: animation-fill-mode только backwards (не both), иначе стекло внутри окна теряет backdrop-filter. */
/* motion */
@keyframes win-in{from{opacity:0;transform:scale(.965) translateY(16px)}to{opacity:1;transform:none}}
@keyframes rise{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
@keyframes pop{from{opacity:0;transform:scale(.9) translateY(10px)}to{opacity:1;transform:none}}
@keyframes slide-l{from{opacity:0;transform:translateX(-28px)}to{opacity:1;transform:none}}
@keyframes slide-r{from{opacity:0;transform:translateX(28px)}to{opacity:1;transform:none}}
@keyframes drop{from{opacity:0;transform:translateY(-40px) rotate(-10deg)}60%{opacity:1;transform:translateY(6px) rotate(-1.5deg)}to{opacity:1;transform:rotate(-3deg)}}
.window{animation:win-in .7s cubic-bezier(.2,.8,.2,1) backwards}
.toolbar{animation:rise .6s .15s cubic-bezier(.2,.8,.2,1) backwards}
main > section{animation:rise .75s cubic-bezier(.2,.8,.2,1) backwards}
main > section:nth-child(1){animation-delay:.2s}main > section:nth-child(2){animation-delay:.32s}main > section:nth-child(3){animation-delay:.44s}main > section:nth-child(4){animation-delay:.56s}main > section:nth-child(n+5){animation-delay:.66s}
.card{animation:pop .6s cubic-bezier(.2,.8,.2,1) backwards}
.card:nth-child(1){animation-delay:.35s}.card:nth-child(2){animation-delay:.42s}.card:nth-child(3){animation-delay:.49s}.card:nth-child(4){animation-delay:.56s}.card:nth-child(5){animation-delay:.63s}.card:nth-child(6){animation-delay:.7s}.card:nth-child(7){animation-delay:.77s}.card:nth-child(8){animation-delay:.84s}
.card img{transition:transform .6s cubic-bezier(.2,.8,.2,1)}.card:hover img{transform:scale(1.04)}
.btn,.navlink,.seg-btn,.icon-btn{transition:transform .25s cubic-bezier(.2,.8,.2,1),background-color .2s,color .2s,filter .2s}
.btn-primary:hover{transform:translateY(-2px)}
.btn svg{transition:transform .25s}.btn:hover svg{transform:translateX(3px)}
.lap,.pho{animation:rise .9s .35s cubic-bezier(.2,.8,.2,1) backwards}.pho{animation-name:pop;animation-delay:.7s}
.dev .lap{transition:transform .5s cubic-bezier(.2,.8,.2,1)}.dev:hover .lap{transform:translateY(-4px)}
@media (prefers-reduced-motion:reduce){.window,.toolbar,main > section,.card,.lap,.pho,.home-hero,.hero-card,.home-right > *,.home-sticky,.home-badge,.home-socials .icon-btn{animation:none !important}}
.hero-card{animation:slide-l .8s .25s cubic-bezier(.2,.8,.2,1) backwards}
.home-right > *:nth-child(1){animation:slide-r .8s .4s cubic-bezier(.2,.8,.2,1) backwards}.home-right > *:nth-child(2){animation:slide-r .8s .52s cubic-bezier(.2,.8,.2,1) backwards}
.svc-row{transition:transform .25s cubic-bezier(.2,.8,.2,1),background-color .2s}.svc-row:hover{transform:translateX(4px)}
.home-sticky{animation:drop 1s .9s cubic-bezier(.3,1.3,.4,1) backwards;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s}.home-sticky:hover{transform:rotate(-1deg) translateY(-4px) scale(1.03)}
.home-badge{animation:slide-l .8s 1.3s cubic-bezier(.2,.8,.2,1) backwards}
.home-socials .icon-btn{animation:pop .5s cubic-bezier(.2,.8,.2,1) backwards}.home-socials .icon-btn:nth-child(1){animation-delay:1.5s}.home-socials .icon-btn:nth-child(2){animation-delay:1.58s}.home-socials .icon-btn:nth-child(3){animation-delay:1.66s}.home-socials .icon-btn:nth-child(4){animation-delay:1.74s}

/* tray: MK.CMS / MK.CRM demo buttons, home page only, always fully visible (no hover-reveal, no status dot) */
.tray{position:absolute;right:20px;bottom:20px;z-index:70;display:flex;flex-direction:column;align-items:flex-end;gap:10px;pointer-events:none}
.tray-i{pointer-events:auto;display:flex;align-items:center;gap:12px;min-height:52px;padding:0 20px 0 16px;border-radius:999px;white-space:nowrap;text-decoration:none;color:var(--text);transition:background-color .2s,filter .2s}
.tray-i:hover,.tray-i:focus-visible{color:var(--text);filter:brightness(1.06)}
.tray-ic{display:inline-flex;width:20px;height:20px;flex:none;align-items:center;justify-content:center}
.tray-tx{display:flex;flex-direction:column;gap:3px}
.tray-tx b{font-size:14px;font-weight:600;letter-spacing:-.01em;line-height:1}
.tray-tx small{font-size:12px;line-height:1;color:var(--text-2)}
.site[lang="ru"] .t-en,.site[lang="en"] .t-ru{display:none}
@keyframes tray-in{from{opacity:0;transform:translateX(24px) scale(.9)}to{opacity:1;transform:none}}
.tray-i{animation:tray-in .7s 1.1s cubic-bezier(.2,.8,.2,1) backwards}
.tray-i:nth-child(2){animation-delay:1.25s}
@media (max-width:900px){.tray{position:static;flex-direction:row;flex-wrap:wrap;align-items:stretch;justify-content:flex-start;margin:0 14px 14px;pointer-events:auto}}
@media (prefers-reduced-motion:reduce){.tray-i{animation:none !important}}
