/* ===================================================================
   DRAGA TRANS — шар руху (motion layer)
   Підключається після site.css. Усе вимикається за prefers-reduced-motion.
   =================================================================== */

/* ---------- 1. Поява блоків при скролі ---------- */
.reveal{opacity:0;transform:translateY(30px);
  transition:opacity .72s cubic-bezier(.22,.61,.24,1), transform .72s cubic-bezier(.22,.61,.24,1);
  will-change:opacity,transform}
.reveal.in{opacity:1;transform:none}

.reveal[data-anim="left"]{transform:translateX(-38px)}
.reveal[data-anim="right"]{transform:translateX(38px)}
.reveal[data-anim="zoom"]{transform:scale(.94)}
.reveal[data-anim="fade"]{transform:none}
.reveal[data-anim="up-lg"]{transform:translateY(56px)}
.reveal.in[data-anim]{transform:none}

/* ---------- 2. Вхід героїні ---------- */
.hero .badge-live,.hero h1,.hero .lead,.hero .hero-actions,.hero .trust-row{
  opacity:0;transform:translateY(26px);
  transition:opacity .9s cubic-bezier(.22,.61,.24,1), transform .9s cubic-bezier(.22,.61,.24,1)}
body.loaded .hero .badge-live{opacity:1;transform:none;transition-delay:.10s}
body.loaded .hero h1{opacity:1;transform:none;transition-delay:.22s}
body.loaded .hero .lead{opacity:1;transform:none;transition-delay:.38s}
body.loaded .hero .hero-actions{opacity:1;transform:none;transition-delay:.52s}
body.loaded .hero .trust-row{opacity:1;transform:none;transition-delay:.66s}

/* повільний zoom-out фото героїні + паралакс через --py */
.hero-bg{transform:scale(1.12) translateY(var(--py,0px));transition:transform 1.6s cubic-bezier(.22,.61,.24,1);will-change:transform}
body.loaded .hero-bg{transform:scale(1.02) translateY(var(--py,0px));transition:transform 2.4s cubic-bezier(.22,.61,.24,1)}
body.loaded.scrolled-any .hero-bg{transition:transform .12s linear}

/* акцентний текст — м'який перелив */
.hero h1 .ac{background:linear-gradient(100deg,#D8C6AE 0%,#F3E7D4 42%,#D8C6AE 78%);
  background-size:260% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;
  animation:acShine 7s ease-in-out infinite}
@keyframes acShine{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}

/* ---------- 3. Індикатор прокрутки сторінки ---------- */
#scrollbar{position:fixed;top:0;left:0;height:3px;width:0;z-index:1200;
  background:linear-gradient(90deg,var(--soft-light),var(--copper));
  box-shadow:0 0 12px rgba(216,198,174,.5);transition:opacity .3s}

/* ---------- 4. Шапка ---------- */
header{transition:transform .4s cubic-bezier(.22,.61,.24,1),background .3s,box-shadow .3s}
header.hide{transform:translateY(-100%)}
.nav-links a::after{transition:width .28s cubic-bezier(.22,.61,.24,1)}
.logo{transition:transform .3s}
.logo:hover{transform:translateY(-1px)}
.logo .mk svg{transition:transform .5s cubic-bezier(.22,.61,.24,1)}
.logo:hover .mk svg{transform:rotate(-8deg) scale(1.06)}

/* ---------- 5. Кнопки: світловий проблиск ---------- */
.btn{position:relative;overflow:hidden;isolation:isolate}
.btn::before{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.42) 50%,transparent 70%);
  transform:translateX(-120%);transition:transform .7s cubic-bezier(.3,.7,.3,1)}
.btn:hover::before{transform:translateX(120%)}
.btn:active{transform:translateY(0) scale(.985)}

/* ---------- 6. Картки: мікровзаємодії ---------- */
.service-card{transition:transform .34s cubic-bezier(.22,.61,.24,1),box-shadow .34s,border-color .34s}
.service-card .ic img{transition:transform .42s cubic-bezier(.34,1.4,.5,1)}
.service-card:hover .ic img{transform:translateY(-4px) scale(1.08)}
.service-card::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;
  background:linear-gradient(90deg,var(--soft-light),var(--copper));
  transform:scaleX(0);transform-origin:left;transition:transform .42s cubic-bezier(.22,.61,.24,1)}
.service-card:hover::after{transform:scaleX(1)}

.adv-card,.geo-card,.fleet-card,.doc-card{transition:transform .32s cubic-bezier(.22,.61,.24,1),box-shadow .32s,border-color .32s}
.adv-card:hover,.geo-card:hover,.fleet-card:hover,.doc-card:hover{transform:translateY(-4px);box-shadow:0 18px 38px rgba(22,33,90,.11)}
.adv-card .ic,.adv-card svg{transition:transform .4s cubic-bezier(.34,1.4,.5,1)}
.adv-card:hover .ic,.adv-card:hover svg{transform:scale(1.1)}

/* новини — плавний зум зображення */
.news-card .img{transition:transform .7s cubic-bezier(.22,.61,.24,1)}
.news-card{overflow:hidden}
.news-card:hover .img{transform:scale(1.07)}

/* відгуки */
.review-card,.rv-card{transition:transform .3s cubic-bezier(.22,.61,.24,1),box-shadow .3s,border-color .3s}
.review-card:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(22,33,90,.1)}

/* логотипи клієнтів */
.client-chip{transition:transform .3s cubic-bezier(.22,.61,.24,1),box-shadow .3s,border-color .3s}
.client-chip .logo-wrap img{transition:opacity .3s,transform .45s cubic-bezier(.34,1.4,.5,1)}
.client-chip:hover .logo-wrap img{transform:scale(1.06)}

/* фото команди / автопарку */
.team-photo,.fleet-shot img{transition:transform .8s cubic-bezier(.22,.61,.24,1)}
.team-photo:hover{transform:scale(1.015)}

/* ---------- 7. Жива карта ---------- */
.map-card path[stroke-dasharray]{animation:routeFlow 2.4s linear infinite}
@keyframes routeFlow{to{stroke-dashoffset:-26}}
.map-card g circle:first-of-type{animation:vanPulse 2.2s ease-out infinite}
@keyframes vanPulse{0%{r:10;opacity:.34}70%{r:20;opacity:0}100%{r:20;opacity:0}}
.dotlive{animation:livePulse 1.9s ease-in-out infinite}
@keyframes livePulse{0%,100%{box-shadow:0 0 0 0 rgba(143,230,166,.55);opacity:1}
  55%{box-shadow:0 0 0 7px rgba(143,230,166,0);opacity:.75}}
.map-live-chip{animation:chipFloat 5s ease-in-out infinite}
@keyframes chipFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}

/* рядки флоту з'являються каскадом */
.van-list .van-row{animation:rowIn .5s cubic-bezier(.22,.61,.24,1) both}
.van-list .van-row:nth-child(1){animation-delay:.05s}
.van-list .van-row:nth-child(2){animation-delay:.13s}
.van-list .van-row:nth-child(3){animation-delay:.21s}
.van-list .van-row:nth-child(4){animation-delay:.29s}
.van-list .van-row:nth-child(5){animation-delay:.37s}
.van-list .van-row:nth-child(6){animation-delay:.45s}
@keyframes rowIn{from{opacity:0;transform:translateX(14px)}to{opacity:1;transform:none}}

/* ---------- 8. Картки відгуків на сторінці «Відгуки» ---------- */
.rv-card:hover{transform:translateY(-4px)}
.rv-chip{transition:background .22s,color .22s,border-color .22s,transform .22s}
.rv-chip:active{transform:scale(.96)}

/* ---------- 9. Форми ---------- */
input,select,textarea{transition:border-color .24s,box-shadow .24s,background .24s}
.contact-form input:focus,.contact-form textarea:focus,.calc-form input:focus,.calc-form select:focus{
  box-shadow:0 0 0 4px rgba(22,33,90,.08)}
.track-bar input:focus{box-shadow:0 0 0 4px rgba(216,198,174,.16)}

/* ---------- 10. Кнопка «нагору» ---------- */
#toTop{position:fixed;right:24px;bottom:96px;width:46px;height:46px;border-radius:50%;
  background:var(--before-dawn);color:var(--soft-light);border:1px solid rgba(216,198,174,.32);
  display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:900;
  opacity:0;visibility:hidden;transform:translateY(14px) scale(.9);
  transition:.32s cubic-bezier(.22,.61,.24,1);box-shadow:0 10px 26px rgba(12,20,76,.3)}
#toTop.show{opacity:1;visibility:visible;transform:none}
#toTop:hover{background:var(--deep-night);transform:translateY(-3px)}
#toTop svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:640px){#toTop{right:16px;bottom:86px;width:42px;height:42px}}

/* ---------- 11. Перехід між сторінками ---------- */
body{opacity:1;transition:opacity .28s ease}
body.page-out{opacity:0}

/* ---------- 12. FAQ ---------- */
.faq-item{transition:border-color .28s,background .28s}
.faq-item:hover{border-color:var(--soft-light)}
.faq-q{transition:color .2s}

/* ---------- 13. Крокери трекінгу ---------- */
.track-result.show .ts{animation:stepIn .5s cubic-bezier(.22,.61,.24,1) both}
.track-result.show .ts:nth-child(1){animation-delay:.04s}
.track-result.show .ts:nth-child(2){animation-delay:.12s}
.track-result.show .ts:nth-child(3){animation-delay:.2s}
.track-result.show .ts:nth-child(4){animation-delay:.28s}
.track-result.show .ts:nth-child(5){animation-delay:.36s}
@keyframes stepIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* ---------- 14. Повага до системних налаштувань ---------- */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important;scroll-behavior:auto!important}
  .reveal,.hero .badge-live,.hero h1,.hero .lead,.hero .hero-actions,.hero .trust-row{opacity:1!important;transform:none!important}
  .hero-bg{transform:none!important}
  #scrollbar{display:none}
}