/* Akışık Filtre — teslimat sahnesi + "yukarı çık" kamyonu (önek: tk-) */
.tk-stage{--tk-road:42px;position:relative;height:250px;overflow:hidden;color:#fff;isolation:isolate;contain:layout paint;
  background:radial-gradient(60% 90% at 68% 100%,rgba(40,192,99,.16),transparent 70%),linear-gradient(180deg,#051118 0%,#0a1f2b 62%,#0d2a39 100%)}
.tk-bg,.tk-act,.tk-road{position:absolute;left:0;right:0;bottom:0}
.tk-bg{top:0;z-index:0;pointer-events:none}
.tk-bg::before{content:"";position:absolute;inset:0 0 40% 0;opacity:.55;
  background-image:radial-gradient(1.4px 1.4px at 8% 22%,#fff,transparent),radial-gradient(1px 1px at 22% 48%,#cfe,transparent),radial-gradient(1.2px 1.2px at 37% 14%,#fff,transparent),radial-gradient(1px 1px at 52% 36%,#fff,transparent),radial-gradient(1.4px 1.4px at 66% 12%,#dff,transparent),radial-gradient(1px 1px at 79% 40%,#fff,transparent),radial-gradient(1.2px 1.2px at 91% 20%,#fff,transparent)}
.tk-hill{position:absolute;left:0;bottom:var(--tk-road);width:100%;height:52%}
.tk-tb2{position:absolute;bottom:calc(var(--tk-road) + 18%);opacity:.5;overflow:visible}
.tk-bl{transform-box:view-box;transform-origin:20px 20px;animation:tk-spin 9s linear infinite}
.tk-tb2:nth-of-type(3) .tk-bl{animation-duration:7s}
.tk-road{z-index:1;height:var(--tk-road);overflow:hidden;background:linear-gradient(#1d2c35,#121c22);border-top:2px solid #34464f;box-shadow:0 -1px 0 rgba(255,255,255,.05)}
.tk-road::after{content:"";position:absolute;left:0;right:0;bottom:0;height:22%;background:#0b1419}
.tk-lane{position:absolute;left:0;top:44%;width:calc(100% + 90px);height:3px;margin-top:-1.5px;
  background:repeating-linear-gradient(90deg,rgba(242,182,50,.75) 0 40px,transparent 40px 90px);animation:tk-lane .5s linear infinite paused;will-change:transform}
.tk-mv .tk-lane{animation-play-state:running}
.tk-act{top:0;z-index:2;overflow:hidden;left:calc(max(20px,50% - 600px) + min(34%,400px));
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 80px);mask-image:linear-gradient(90deg,transparent,#000 80px)}
.tk-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;max-width:none}
.tk-smk circle{opacity:0;transform-box:fill-box;transform-origin:center;animation:tk-smoke 1.5s linear infinite}
.tk-smk circle:nth-child(2){animation-delay:.5s}.tk-smk circle:nth-child(3){animation-delay:1s}
.tk-stage:not(.tk-run) .tk-smk{display:none}
.tk-copy{position:absolute;z-index:3;left:max(20px,50% - 600px);top:0;bottom:var(--tk-road);width:min(34%,400px);display:flex;flex-direction:column;justify-content:center;padding-right:16px}
.tk-copy .eyebrow{margin-bottom:6px;font-size:.82rem}
.tk-h{color:#fff!important;font-size:clamp(1.7rem,2.6vw,2.3rem);margin:0 0 4px;line-height:1.02}
.tk-p{margin:0;color:#a9b9c1;font-size:.96rem;line-height:1.45}
.tk-cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}.tk-cta:empty{display:none}
.tk-rp{position:absolute;z-index:4;top:12px;right:12px;width:36px;height:36px;border-radius:50%;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.07);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;opacity:0;pointer-events:none;transition:opacity .4s,background .2s,transform .3s}
.tk-rp svg{width:18px;height:18px}
.tk-done .tk-rp{opacity:1;pointer-events:auto}
.tk-rp:hover{background:var(--green);transform:rotate(-40deg)}
.tk-rp:focus-visible,.tk-top:focus-visible{outline:2px solid var(--green2);outline-offset:3px}
@media(max-width:900px){.tk-copy{width:min(38%,340px)}.tk-act{left:calc(20px + min(38%,340px))}}
@media(max-width:640px){
  .tk-stage{height:310px}
  .tk-copy{left:16px;right:60px;width:auto;top:16px;bottom:auto;display:block;padding:0}
  .tk-h{font-size:1.65rem}.tk-p{font-size:.9rem}
  .tk-act{left:0;top:118px;-webkit-mask-image:none;mask-image:none}
  .tk-cta{margin-top:8px}
}
@keyframes tk-lane{to{transform:translateX(-90px)}}
@keyframes tk-spin{to{transform:rotate(360deg)}}
@keyframes tk-smoke{0%{opacity:0;transform:translate(0,0) scale(.4)}12%{opacity:.8}100%{opacity:0;transform:translate(-50px,-26px) scale(3)}}

/* ---------- yukarı çık kamyonu ---------- */
.to-top{display:none!important}
.tk-top{position:fixed;right:18px;bottom:22px;z-index:72;width:92px;height:58px;padding:0;margin:0;border:0;border-radius:12px;background:none;cursor:pointer;color:inherit;
  opacity:0;visibility:hidden;transform:translateX(30px);transition:opacity .35s,visibility .35s,transform .5s cubic-bezier(.2,.9,.3,1.25);-webkit-tap-highlight-color:transparent}
.tk-top.tk-on{opacity:1;visibility:visible;transform:none}
.tk-top svg{display:block;width:92px;height:58px;overflow:visible;max-width:none}
.tk-tv{display:block;transform-origin:50% 62%;filter:drop-shadow(0 8px 10px rgba(8,24,33,.28))}
.tk-tw{transform-box:fill-box;transform-origin:center}
.tk-tip{position:absolute;right:2px;bottom:calc(100% + 10px);background:#fff;color:var(--navy);font:800 .8rem/1 var(--ff);padding:8px 12px;border-radius:999px;white-space:nowrap;box-shadow:0 8px 20px -6px rgba(8,24,33,.35);
  opacity:0;transform:translateY(6px) scale(.9);transform-origin:80% 100%;transition:.22s;pointer-events:none}
.tk-tip::after{content:"";position:absolute;right:26px;top:100%;border:6px solid transparent;border-top-color:#fff}
.tk-tip::before{content:"\2191";color:var(--green);margin-right:5px}
.tk-top:hover .tk-tip,.tk-top:focus-visible .tk-tip{opacity:1;transform:none}
.tk-top:hover .tk-tv,.tk-top:focus-visible .tk-tv{animation:tk-hop .75s ease-in-out infinite}
.tk-roll .tk-tb{animation:tk-bob .24s linear infinite}
.tk-jp circle{opacity:0;transform-box:fill-box;transform-origin:center}
.tk-top.tk-go .tk-tip{opacity:0}
.tk-top.tk-go .tk-tv{animation:tk-up 1.1s forwards}
.tk-go .tk-jp circle{animation:tk-jet .42s linear infinite}
.tk-go .tk-jp circle:nth-child(2){animation-delay:.14s}.tk-go .tk-jp circle:nth-child(3){animation-delay:.28s}
@keyframes tk-hop{0%,100%{transform:none}30%{transform:translateY(-7px) rotate(-3deg)}55%{transform:translateY(0) scale(1.04,.95)}70%{transform:translateY(-2px)}}
@keyframes tk-bob{50%{transform:translateY(-.7px)}}
@keyframes tk-up{0%{transform:none}14%{transform:translateY(3px) scale(1.07,.88)}
  34%{transform:translateY(-6px) rotate(-90deg);animation-timing-function:cubic-bezier(.55,0,.85,.35)}100%{transform:translateY(-115vh) rotate(-90deg)}}
@keyframes tk-jet{0%{opacity:.9;transform:translate(0,0) scale(.5)}100%{opacity:0;transform:translate(-22px,3px) scale(2.2)}}
@media(max-width:760px){.tk-top{bottom:80px;right:12px}}
@media(prefers-reduced-motion:reduce){
  .tk-lane,.tk-bl,.tk-smk,.tk-top:hover .tk-tv,.tk-top:focus-visible .tk-tv,.tk-roll .tk-tb{animation:none!important}
  .tk-smk{display:none}.tk-top{transform:none;transition:opacity .2s,visibility .2s}
}