/* Prompt Arena hareket katmanı — yayın/espor dinamizmi.
   Mevcut mavi/kırmızı/sarı kimlik, tipografi ve yerleşim değişmez; bu dosya
   yalnızca hareket ekler. İki kademeli açma:
     html.motion       → head'deki satır içi kontrol, kullanıcı "az hareket"
                          istemediyse eklenir. Saf CSS hareketlerini açar.
     html.motion-ready → motion.js çalıştığında eklenir. Yalnızca başlangıçta
                          gizli olan kaydırma açılışlarını açar; script
                          yüklenmezse hiçbir şey gizli kalmaz.
   prefers-reduced-motion için styles.css'teki genel kapatma kuralı
   (animation/transition: none !important) buradaki her şeyi de durdurur. */

/* ---------- 1. Kaydırma ilerlemesi ve yapışkan üst menü ---------- */

.scroll-progress{display:none}
html.motion .scroll-progress{
  display:block;position:fixed;top:0;left:0;right:0;height:3px;z-index:60;pointer-events:none;
  background:linear-gradient(90deg,#4285f4,#ea4335 58%,#fbbc04);
  transform:scaleX(var(--scroll,0));transform-origin:0 50%;
}
html.motion body{overflow-x:clip}
/* Menü artık yapışkan: çapa bağlantıları (#oylama, #nasil, #duel-…) ve klavye
   odağı başlığın altında kalmasın. */
html.motion{scroll-padding-top:104px}
@media(max-width:780px){html.motion{scroll-padding-top:84px}}
html.motion .site-header{
  position:sticky;top:0;z-index:40;
  transition:transform .34s var(--ease);
}
/* Tam genişlik zemin. 50vw kaydırma çubuğunu da sayar; --sbw (motion.js) bunu
   geri alır, yoksa sayfa çubuk genişliği kadar yana taşardı. */
html.motion .site-header::before{
  content:'';position:absolute;inset:0 calc(50% - 50vw + var(--sbw,0px) / 2);z-index:-1;
  background:#0b0b0fd9;border-bottom:1px solid #ffffff17;
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  opacity:0;transition:opacity .3s ease-out;
}
html.motion .site-header.is-stuck::before{opacity:1}
html.motion .site-header.nav-hidden{transform:translateY(calc(-100% - 16px))}

/* Sayfa başında logo, kullanıcının istediği gibi çizginin üzerine taşar.
   Kaydırınca menü yüksekliğine sığacak kadar küçülür; yoksa yapışkan
   menünün altından taşıp içeriğin üzerine biner. */
html.motion .site-header{transition:transform .34s var(--ease),padding-left .3s var(--ease)}
html.motion .site-header .brand{transition:width .3s var(--ease)}
html.motion .site-header.is-stuck{padding-left:156px}
html.motion .site-header.is-stuck .brand{width:124px}

html.motion .site-header nav a{position:relative}
html.motion .site-header nav a::after{
  content:'';position:absolute;left:0;right:0;bottom:9px;height:2px;background:#fbbc04;
  transform:scaleX(0);transform-origin:0 50%;transition:transform .32s var(--ease);
}

/* ---------- 2. Hero: ortam ışığı, tarama ve giriş sıralaması ---------- */

html.motion .hero::after{
  content:'';position:absolute;inset:-25%;z-index:-1;pointer-events:none;
  background:
    radial-gradient(38% 42% at 22% 30%,#1b3fd866,transparent 70%),
    radial-gradient(34% 38% at 78% 68%,#c5221f4d,transparent 70%);
  animation:arena-drift 26s ease-in-out infinite alternate;
}
@keyframes arena-drift{
  0%{transform:translate3d(-2%,-1%,0) scale(1)}
  50%{transform:translate3d(2%,2%,0) scale(1.06)}
  100%{transform:translate3d(-1%,1%,0) scale(1.02)}
}

html.motion .hero-inner{position:relative}
html.motion .hero-inner::before{
  content:'';position:absolute;top:-10%;bottom:-10%;left:-45%;width:30%;z-index:-1;pointer-events:none;
  background:linear-gradient(100deg,transparent,#fbbc041c 42%,#ffffff12 56%,transparent);
  animation:arena-sweep 11s ease-in-out infinite;
}
@keyframes arena-sweep{
  0%,68%{transform:translateX(0) skewX(-12deg)}
  100%{transform:translateX(480%) skewX(-12deg)}
}

html.motion .hero-copy>*{animation:rise-in .85s var(--ease) both}
html.motion .hero-copy .eyebrow{animation-delay:.06s}
html.motion .hero-copy h1{animation:title-wipe 1s var(--ease) both;animation-delay:.16s}
html.motion .hero-prize{animation-delay:.36s}
html.motion .hero-prize strong{animation:prize-pop 1.1s cubic-bezier(.2,1.35,.35,1) both;animation-delay:.46s}
html.motion .hero-description{animation-delay:.48s}
html.motion .hero-actions{animation-delay:.58s}
html.motion .hero-announcement{animation:rise-in .9s var(--ease) both;animation-delay:.32s}
html.motion .hero-stages{animation:rise-in .9s var(--ease) both;animation-delay:.68s}

@keyframes rise-in{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
/* Negatif inset üst/yan: Türkçe büyük harf noktaları ve şapkalar kırpılmaz. */
@keyframes title-wipe{
  from{opacity:0;transform:translateY(26px);clip-path:inset(0 -8% 100% -8%)}
  to{opacity:1;transform:none;clip-path:inset(-35% -8% -12% -8%)}
}
@keyframes prize-pop{
  0%{opacity:0;transform:scale(.88)}
  55%{opacity:1;transform:scale(1.035);text-shadow:0 0 34px #fbbc0480}
  100%{opacity:1;transform:none;text-shadow:none}
}

/* Etap rayında ilerleyen ışık: turnuva akışını hissettirir. */
html.motion .stage-line{position:relative;overflow:hidden}
html.motion .stage-line::after{
  content:'';position:absolute;inset:0;background:#fbbc04;
  transform:translateX(-100%);animation:rail-pulse 3.6s ease-in-out infinite;
}
html.motion .hero-stages>:nth-child(4)::after{animation-delay:1.8s}
@keyframes rail-pulse{0%{transform:translateX(-100%)}55%,100%{transform:translateX(100%)}}

html.motion .vertical-poster>img:first-child,
html.motion .suggestion-top>img{animation:spark-float 5.5s ease-in-out infinite}
@keyframes spark-float{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-6px) rotate(7deg)}}

html.motion .poster-vs{animation:poster-vs-impact 5.5s ease-out infinite}
@keyframes poster-vs-impact{
  0%,76%,100%{transform:rotate(-8deg) scale(1)}
  82%{transform:rotate(-2deg) scale(1.09)}
  89%{transform:rotate(-8deg) scale(1)}
}

/* ---------- 3. Yayın şeridi ---------- */

.ticker{display:none}
html.motion .ticker{
  display:block;overflow:hidden;border-block:1px solid #30303c;background:#0e0e14;
  padding-block:11px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
}
html.motion .ticker-track{display:flex;width:max-content;animation:ticker-run 42s linear infinite}
html.motion .ticker-group{
  display:flex;align-items:center;gap:26px;padding-right:26px;
  font:800 19px/1 ArenaDisplay,Impact,sans-serif;letter-spacing:.4px;color:#e9e9f1;white-space:nowrap;
}
html.motion .ticker-group i{font-style:normal;color:#fbbc04;font-size:13px}
html.motion .ticker:hover .ticker-track{animation-play-state:paused}
@keyframes ticker-run{to{transform:translateX(-50%)}}

/* ---------- 4. Kaydırmayla açılan bölümler ---------- */

/* 13.10.2026: daha kısa ve sınırlı gecikmeli; kaydırırken içerik beklenmez. */
html.motion-ready [data-rise]{
  opacity:0;transform:translateY(16px);
  transition:opacity .45s var(--ease),transform .45s var(--ease);
  transition-delay:min(calc(var(--i,0)*60ms),240ms);
}
html.motion-ready [data-rise].in-view{opacity:1;transform:none}

/* Karşılaşma satırı: iki taraf kendi tarafından girer, VS ortada kilitlenir. */
html.motion-ready .compact-matchup .compact-side{
  opacity:0;
  transition:opacity .62s var(--ease),transform .62s var(--ease),border-color .18s ease-out,box-shadow .3s var(--ease);
}
html.motion-ready .compact-matchup .compact-side.side-a{transform:translateX(-26px)}
html.motion-ready .compact-matchup .compact-side.side-b{transform:translateX(26px)}
html.motion-ready .compact-matchup.in-view .compact-side{opacity:1;transform:none}
html.motion-ready .compact-matchup .motion-vs span{opacity:0;transform:scale(.6)}
html.motion-ready .compact-matchup.in-view .motion-vs span{opacity:1;transform:none;transition:opacity .4s var(--ease) .18s,transform .5s cubic-bezier(.2,1.5,.4,1) .18s}
html.motion-ready .compact-matchup .compact-heading{
  opacity:0;transform:translateY(14px);transition:opacity .5s var(--ease),transform .5s var(--ease);
}
html.motion-ready .compact-matchup.in-view .compact-heading{opacity:1;transform:none}

/* Yolculuk adımlarının altına marka çizgisi çekilir. */
html.motion .journey li{position:relative}
html.motion .journey li::after{
  content:'';position:absolute;left:0;bottom:-1px;height:1px;width:0;
  background:linear-gradient(90deg,#4285f4,#ea4335);
  transition:width .9s var(--ease);transition-delay:calc(var(--i,0)*90ms + 160ms);
}
html.motion .journey li.in-view::after{width:100%}
html.motion .step-number,html.motion .step-arrow{transition:color .3s,transform .3s var(--ease)}

/* ---------- 5. Karşılaşma kartları ve düğme mikro etkileşimleri ---------- */

.matchup-state.state-live::before{
  content:'';display:inline-block;width:7px;height:7px;border-radius:50%;background:#ea4335;
  margin-right:7px;vertical-align:1px;animation:live-pulse 2s ease-out infinite;
}
@keyframes live-pulse{
  0%{box-shadow:0 0 0 0 #ea4335a6}
  70%{box-shadow:0 0 0 9px #ea433500}
  100%{box-shadow:0 0 0 0 #ea433500}
}

html.motion .compact-visual::after{
  content:'';position:absolute;inset:0;z-index:2;pointer-events:none;
  background:linear-gradient(115deg,transparent 40%,#ffffff2b 50%,transparent 60%);
  transform:translateX(-130%);transition:transform .75s var(--ease);
}
html.motion .compact-side{transition:border-color .18s ease-out,transform .3s var(--ease),box-shadow .3s var(--ease)}
html.motion .compact-side.is-selected{animation:lock-in .55s cubic-bezier(.2,1.3,.4,1)}
@keyframes lock-in{from{box-shadow:0 0 0 0 #fbbc0466}to{box-shadow:0 0 0 15px #fbbc0400}}

html.motion .motion-vs::after{
  content:'';position:absolute;width:52px;height:52px;border:2px solid #fbbc04;border-radius:50%;
  opacity:0;pointer-events:none;animation:vs-ring 4.5s ease-out infinite;
}
html.motion .compact-matchup:nth-child(2n) .motion-vs::after{animation-delay:1.6s}
html.motion .compact-matchup:nth-child(3n) .motion-vs::after{animation-delay:3s}
@keyframes vs-ring{
  0%,75%{opacity:0;transform:scale(.4)}
  81%{opacity:.5;transform:scale(1)}
  100%{opacity:0;transform:scale(1.55)}
}

html.motion .button{position:relative;overflow:hidden;--sheen:#ffffff59}
html.motion .button-white{--sheen:#0b0b0f26}
html.motion .button::after{
  content:'';position:absolute;top:0;bottom:0;left:-55%;width:38%;pointer-events:none;
  background:linear-gradient(100deg,transparent,var(--sheen),transparent);
  transform:translateX(0) skewX(-18deg);transition:transform .65s var(--ease);
}
html.motion .button>span,html.motion .text-button>span,html.motion .back-top>span{
  display:inline-block;transition:transform .3s var(--ease);
}
html.motion .confirm-choice,html.motion .choose-output{transition:background-color .2s,border-color .2s,color .2s,transform .2s var(--ease)}

/* ---------- 5b. Jüri kartları ---------- */

/* Kartın kendi açılışı [data-rise] ile yapılıyor (bölüm 4). Bu yüzden burada
   karta transform verilmiyor — verilirse açılış geçişini ezer. Hover etkisi
   çerçeve, gölge ve portre üzerinden kuruluyor. */
html.motion .jury-card{transition:border-color .38s ease-out,box-shadow .38s var(--ease)}
html.motion .jury-portrait img{filter:grayscale(1) contrast(1.05) brightness(.94);transition:filter .55s var(--ease),transform .65s var(--ease)}
html.motion .jury-portrait:after{transition:opacity .55s var(--ease)}
/* Portre üzerinde geçen ışık. */
html.motion .jury-portrait:before{
  content:'';position:absolute;inset:0;z-index:2;pointer-events:none;
  background:linear-gradient(115deg,transparent 40%,#ffffff33 50%,transparent 60%);
  transform:translateX(-130%);transition:transform .8s var(--ease);
}
html.motion .jury-copy h3{transition:color .38s ease-out}

/* Açılışta marka çizgisi soldan çekilir; --i kart sırasından gelir. */
html.motion .jury-accent{transform:scaleX(0);transform-origin:0 50%;transition:transform .8s var(--ease);transition-delay:calc(var(--i,0)*90ms + 240ms)}
html.motion .jury-card.in-view .jury-accent{transform:scaleX(1)}

/* Dokunmatik ekran (03.10.2026): hover olmadığı için portreler sabit kalıyordu. Kart ekranın
   ortasındaki banttayken (.is-live, motion.js) masaüstündeki hover efektinin aynısı oynar. */
@media (hover:none),(pointer:coarse){
  html.motion .jury-card.is-live{border-color:var(--accent);box-shadow:0 14px 30px #00000099,0 0 0 1px var(--accent)}
  html.motion .jury-card.is-live .jury-portrait img{filter:none;transform:scale(1.06)}
  html.motion .jury-card.is-live .jury-portrait:after{opacity:.16}
  html.motion .jury-card.is-live .jury-portrait:before{transform:translateX(130%)}
  html.motion .jury-card.is-live .jury-copy h3{color:#fff}
}
@media(hover:hover) and (pointer:fine){
  html.motion .jury-card:hover{border-color:var(--accent);box-shadow:0 14px 30px #00000099,0 0 0 1px var(--accent)}
  html.motion .jury-card:hover .jury-portrait img{filter:none;transform:scale(1.06)}
  html.motion .jury-card:hover .jury-portrait:after{opacity:.16}
  html.motion .jury-card:hover .jury-portrait:before{transform:translateX(130%)}
  html.motion .jury-card:hover .jury-copy h3{color:#fff}
}

/* ---------- 6. SSS açılışı ---------- */

html.motion .faq-list summary span{transition:transform .3s var(--ease)}
@supports selector(::details-content){
  html.motion{interpolate-size:allow-keywords}
  html.motion .faq-list details::details-content{
    block-size:0;overflow:clip;content-visibility:hidden;
    transition:block-size .42s var(--ease),content-visibility .42s allow-discrete;
  }
  html.motion .faq-list details[open]::details-content{block-size:auto;content-visibility:visible}
}

/* ---------- 7. Mobil menü ---------- */

html.motion .mobile-menu:not([hidden])>*{animation:rise-in .45s var(--ease) both}
html.motion .mobile-menu:not([hidden])>:nth-child(2){animation-delay:60ms}
html.motion .mobile-menu:not([hidden])>:nth-child(3){animation-delay:120ms}
html.motion .mobile-menu:not([hidden])>:nth-child(4){animation-delay:180ms}

/* ---------- 8. Yalnızca gerçek imleçli cihazlarda hover ---------- */

@media(hover:hover) and (pointer:fine){
  html.motion .site-header nav a:hover::after{transform:scaleX(1)}
  html.motion .button:hover::after{transform:translateX(420%) skewX(-18deg)}
  html.motion .button:hover>span,
  html.motion .text-button:hover>span{transform:translate(3px,-3px)}
  html.motion .back-top:hover>span{transform:translateY(-3px)}
  html.motion .compact-side:hover .compact-visual::after{transform:translateX(130%)}
  html.motion .compact-side:hover{transform:translateY(-3px);box-shadow:0 12px 26px #00000099}
  html.motion .compact-side.side-a:hover{border-color:#4285f4}
  html.motion .compact-side.side-b:hover{border-color:#ea4335}
  html.motion .journey li:hover .step-arrow{transform:translate(4px,-4px)}
  html.motion .journey li:hover .step-number{color:#fbbc04}
  html.motion .confirm-choice:hover:not(:disabled){transform:translateY(-2px)}
}

/* ---------- 10. Başa dön düğmesi ---------- */

/* Düğme varsayılan olarak görünür durur (script yoksa da erişilebilir kalsın).
   Hareket açıkken sayfa başında gizlenir, ilk ekran geçildiğinde yaylanarak
   gelir; görünürlüğü motion.js'teki kaydırma çerçevesi açar. */
html.motion .to-top{transition:opacity .4s var(--ease),translate .5s cubic-bezier(.2,1.4,.4,1),scale .5s cubic-bezier(.2,1.4,.4,1),border-color .25s ease-out,box-shadow .3s var(--ease),bottom .3s var(--ease)}
html.motion-ready .to-top{opacity:0;translate:0 20px;scale:.82;pointer-events:none}
html.motion-ready .to-top.is-visible{opacity:1;translate:0;scale:1;pointer-events:auto}
html.motion .ring-fill{transition:stroke-dashoffset .16s linear}
html.motion .to-top-label{translate:9px -50%;transition:opacity .28s var(--ease),translate .28s var(--ease)}
html.motion .to-top:hover .to-top-label,html.motion .to-top:focus-visible .to-top-label{translate:0 -50%}
html.motion .to-top-badge svg{transition:translate .42s var(--ease),opacity .42s var(--ease)}
/* Boş zamanda sarı halka atışı: VS damgasıyla aynı ritim ve keyframe. */
html.motion .to-top.is-visible::after{
  content:'';position:absolute;inset:-3px;border:2px solid var(--yellow);border-radius:50%;
  opacity:0;pointer-events:none;animation:vs-ring 4.5s ease-out infinite;
}
/* Kalkış anı: rozet bir an sıkışıp okunu yukarı fırlatır. */
html.motion .to-top.is-rising{scale:.94}
html.motion .to-top.is-rising .to-top-badge svg:first-of-type{translate:-50% -250%;opacity:0}
html.motion .to-top.is-rising .to-top-badge svg:last-of-type{translate:-50% -50%}

@media(hover:hover) and (pointer:fine){
  /* Ok bandı: üstteki ok yukarı çıkar, alttaki aynı yoldan gelir. */
  html.motion .to-top:hover .to-top-badge svg:first-of-type{translate:-50% -250%;opacity:0}
  html.motion .to-top:hover .to-top-badge svg:last-of-type{translate:-50% -50%}
  html.motion .to-top.is-visible:hover{translate:0 -4px}
}

/* ---------- 9. Dar ekranda hareketi hafiflet ---------- */

@media(max-width:780px){
  html.motion .site-header.is-stuck{padding-left:112px}
  html.motion .site-header.is-stuck .brand{width:96px}
}

@media(max-width:700px){
  html.motion .hero::after,html.motion .hero-inner::before{animation:none}
  html.motion .ticker-track{animation-duration:30s}
  html.motion .ticker-group{font-size:15px;gap:18px;padding-right:18px}
  html.motion-ready .compact-matchup .compact-side.side-a,
  html.motion-ready .compact-matchup .compact-side.side-b{transform:translateY(18px)}
  html.motion .compact-side:hover{transform:none;box-shadow:none}
}

/* ---------- 11. Oylama geri sayımı ---------- */
/* Satır sabit durmaz: ışık şeridi geçer, nokta nabız atar, saniye kutusu her
   atışta yeniden basılır. Son gün/son saat durumunda ritim hızlanır ve çerçeve
   uyarıya döner. prefers-reduced-motion hepsini styles.css'ten kapatır. */
html.motion .vote-countdown .countdown-glow{animation:sayac-tarama 7s linear infinite}
html.motion .vote-countdown[data-state=soon] .countdown-glow{animation-duration:4.5s}
html.motion .vote-countdown[data-state=final] .countdown-glow{animation-duration:2.6s}
html.motion .vote-countdown[data-state=closed] .countdown-glow{animation:none}
@keyframes sayac-tarama{0%{left:-220px}100%{left:110%}}
html.motion .countdown-dot{animation:sayac-nabiz 2.1s ease-in-out infinite}
html.motion .vote-countdown[data-state=soon] .countdown-dot{animation-duration:1.1s}
html.motion .vote-countdown[data-state=final] .countdown-dot{animation-duration:.7s}
@keyframes sayac-nabiz{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.35);opacity:.55}}
html.motion .countdown-unit.is-tick b{animation:sayac-atis 620ms var(--ease)}
@keyframes sayac-atis{0%{transform:translateY(-38%) scale(1.14);opacity:.15}45%{opacity:1}100%{transform:none}}
html.motion .vote-countdown[data-state=final] .countdown-unit:last-of-type{animation:sayac-uyari 1s ease-in-out infinite}
@keyframes sayac-uyari{0%,100%{border-color:var(--red);box-shadow:0 0 0 0 #ea433500}50%{border-color:#ff7b6f;box-shadow:0 0 0 5px #ea433522}}
html.motion .countdown-rail-fill{position:relative}
html.motion .countdown-rail-fill:after{content:'';position:absolute;inset:0 0 0 auto;width:42px;background:linear-gradient(90deg,transparent,#fff9);animation:sayac-ucu 1.8s ease-in-out infinite}
@keyframes sayac-ucu{0%,100%{opacity:.25}50%{opacity:.8}}
html.motion .vote-countdown{animation:sayac-giris 620ms var(--ease) both}
@keyframes sayac-giris{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:none}}

/* ---------- 12. "Bir sonraki challenge senden" bandı ---------- */
/* Işık havuzları yavaşça sürüklenir, panelden düzenli bir tarama geçer,
   kenar çizgileri nefes alır. Düğme boşta hafifçe parlar; imleç üzerine
   gelince nabız durur ve sarı dolum devralır. */
html.motion .suggest-glow-blue{animation:oneri-mavi 17s ease-in-out infinite alternate}
html.motion .suggest-glow-red{animation:oneri-kirmizi 19s ease-in-out infinite alternate}
@keyframes oneri-mavi{0%{transform:translate(0,-50%) scale(1)}100%{transform:translate(13%,-55%) scale(1.15)}}
@keyframes oneri-kirmizi{0%{transform:translate(0,-50%) scale(1.1)}100%{transform:translate(-12%,-45%) scale(.94)}}
html.motion .suggest-sweep{animation:oneri-tarama 9.5s linear infinite}
@keyframes oneri-tarama{0%{left:-30%}100%{left:112%}}
html.motion .suggest-edge-left{animation:oneri-kenar 3.6s ease-in-out infinite}
html.motion .suggest-edge-right{animation:oneri-kenar 3.6s ease-in-out infinite reverse}
@keyframes oneri-kenar{0%,100%{opacity:.45;transform:scaleY(.8)}50%{opacity:1;transform:scaleY(1)}}
html.motion .suggest-grid{animation:oneri-izgara 30s linear infinite}
@keyframes oneri-izgara{0%{background-position:0 0}100%{background-position:760px 0}}
html.motion .suggest-cta{animation:oneri-nabiz 4.8s ease-in-out infinite}
@keyframes oneri-nabiz{0%,100%{box-shadow:0 12px 32px #00000059,0 0 0 0 #ffffff00}50%{box-shadow:0 12px 32px #00000059,0 0 0 4px #ffffff12}}
html.motion .suggest-cta:hover,html.motion .suggest-cta:focus-visible{animation:none}

html.motion .suggest-bit{animation:oneri-parca 13s ease-in-out infinite alternate}
html.motion .suggest-bit.b2{animation-duration:16s;animation-delay:-3s}
html.motion .suggest-bit.b3{animation-duration:11s;animation-delay:-6s}
html.motion .suggest-bit.b4{animation-duration:15s;animation-delay:-2s}
html.motion .suggest-bit.b5{animation-duration:12s;animation-delay:-8s}
html.motion .suggest-bit.b6{animation-duration:17s;animation-delay:-5s}
html.motion .suggest-bit.b7{animation-duration:9s;animation-delay:-4s}
@keyframes oneri-parca{0%{transform:skewX(-12deg) translate(0,0) rotate(0deg);opacity:.32}100%{transform:skewX(-12deg) translate(18px,-26px) rotate(6deg);opacity:.62}}
html.motion .suggest-seam{animation:oneri-dikis 5.2s ease-in-out infinite}
@keyframes oneri-dikis{0%,100%{opacity:.5;transform:skewX(-12deg) scaleY(.9)}50%{opacity:1;transform:skewX(-12deg) scaleY(1)}}
html.motion .suggest-floor{animation:oneri-zemin 22s ease-in-out infinite alternate}
@keyframes oneri-zemin{0%{opacity:.2;transform:scale(1)}100%{opacity:.34;transform:scale(1.06)}}
