/* ==========================================================
   SORYBOFAMILY — CLEAN MOTION LAYER
   Švarios, subtilios animacijos visai svetainei.
   Išjungiamos automatiškai, jei naršyklėje įjungta
   "Reduce motion" (prefers-reduced-motion).
   ========================================================== */

:root{
  --sf-ease:cubic-bezier(.22,1,.36,1);
  --sf-ease-soft:cubic-bezier(.4,0,.2,1);
  --sf-dur:.7s;
}

/* ---------- 1. Scroll reveal (taikoma per JS: .sf-rv) ---------- */
html.sf-motion .sf-rv{
  opacity:0;
  transform:translate3d(0,26px,0);
  transition:opacity var(--sf-dur) var(--sf-ease),transform var(--sf-dur) var(--sf-ease);
  transition-delay:var(--sf-d,0ms);
  will-change:opacity,transform;
}
html.sf-motion .sf-rv.sf-rv-left{transform:translate3d(-28px,0,0)}
html.sf-motion .sf-rv.sf-rv-right{transform:translate3d(28px,0,0)}
html.sf-motion .sf-rv.sf-rv-zoom{transform:scale(.94)}
html.sf-motion .sf-rv.sf-in{
  opacity:1;
  transform:none;
}
/* po animacijos nuimam will-change (JS prideda .sf-done) */
html.sf-motion .sf-rv.sf-done{will-change:auto;transition-delay:0ms}

/* ---------- 2. Puslapio įėjimas ---------- */
@keyframes sfPageIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
html.sf-motion:not(.sf-loading) #app > div > :not(header){
  animation:sfPageIn .6s var(--sf-ease) backwards;   /* backwards = po animacijos nelieka stacking context */
}

/* ---------- 3. Navigacija ---------- */
@keyframes sfNavDrop{from{opacity:0;transform:translateY(-14px)}to{opacity:1;transform:none}}
html.sf-motion:not(.sf-loading) header.sticky-top{animation:sfNavDrop .6s var(--sf-ease) .05s backwards}

header .nav-link,header .navbar-nav a{position:relative}
header .nav-link:after{
  content:"";position:absolute;left:50%;bottom:2px;height:2px;width:0;border-radius:2px;
  background:var(--red,#e8192c);
  transform:translateX(-50%);transition:width .3s var(--sf-ease);
}
header .nav-link:hover:after,header .nav-link.active:after{width:60%}

/* ---------- 4. Mygtukai ---------- */
.btn,button.btn,a.btn{
  position:relative;overflow:hidden;
  transition:transform .25s var(--sf-ease),box-shadow .25s var(--sf-ease),filter .25s ease,background-color .25s ease,border-color .25s ease,color .25s ease;
}
.btn:active{transform:translateY(0) scale(.97)!important}
/* šviesos "perbėgimas" per mygtuką */
.btn-primary::after{
  content:"";position:absolute;top:0;left:-120%;width:60%;height:100%;pointer-events:none;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.22),transparent);
  transform:skewX(-20deg);transition:left .7s var(--sf-ease);
}
.btn-primary:hover::after{left:140%}

/* ---------- 5. Kortelės (tik konkrečios klasės, be lėtų [class*=] selektorių) ---------- */
.card,.sf-update-card,.sf-lesson-card,.sf-aff-card,.sf-status-card,.inf-ctile{
  transition:transform .35s var(--sf-ease),box-shadow .35s var(--sf-ease),border-color .3s ease;
}
@media(hover:hover){
  .card:hover,.sf-update-card:hover,.sf-lesson-card:hover,.sf-aff-card:hover,.sf-status-card:hover{
    transform:translateY(-4px);
    box-shadow:0 18px 40px rgba(0,0,0,.4);
    border-color:rgba(255,255,255,.16);
  }
}
.card img,.sf-lesson-cover img{transition:transform .8s var(--sf-ease)}
@media(hover:hover){.card:hover img,.sf-lesson-card:hover .sf-lesson-cover img{transform:scale(1.04)}}

/* ---------- 6. Nuorodos ir ikonos ---------- */
a{transition:color .2s ease,opacity .2s ease}
.social a,.hyper-social a,.social{transition:transform .3s var(--sf-ease),filter .3s ease}
@media(hover:hover){
  .social a:hover,.hyper-social a:hover{transform:translateY(-3px) scale(1.08);}
}
i.fa-solid,i.fa-brands,i.fab{transition:transform .3s var(--sf-ease),color .25s ease}
@media(hover:hover){
  a:hover > i.fa-arrow-right,.btn:hover > i.fa-arrow-right,a:hover > i.fa-chevron-right{transform:translateX(4px)}
}

/* ---------- 7. Formos ---------- */
.form-control,.form-select,input,textarea,select{
  transition:border-color .25s ease,box-shadow .25s ease,background-color .25s ease,transform .25s var(--sf-ease);
}
.form-control:focus,.form-select:focus{transform:translateY(-1px)}

/* ---------- 8. FAQ ---------- */
.sf-faq-item{transition:border-color .3s ease,background-color .3s ease}

/* ---------- 11. Lenktynių juosta puslapio viršuje (scroll progress) ---------- */
#sf-scroll-progress{
  position:fixed;top:0;left:0;height:3px;width:100%;z-index:9999980;pointer-events:none;
  transform-origin:0 50%;transform:scaleX(0);
  background:#e8192c;
}

/* ---------- 12. "Atgal į viršų" mygtukas ---------- */
#sf-to-top{
  position:fixed;right:18px;bottom:18px;z-index:9999970;width:44px;height:44px;border-radius:14px;
  display:grid;place-items:center;cursor:pointer;color:#fff;
  border:1px solid rgba(255,83,100,.4);
  background:#c4101f;
  box-shadow:0 10px 24px rgba(0,0,0,.4);
  opacity:0;visibility:hidden;transform:translateY(16px) scale(.9);
  transition:opacity .35s ease,transform .45s var(--sf-ease),visibility .35s,box-shadow .25s ease;
}
#sf-to-top svg{width:14px;height:14px;display:block;transition:transform .3s var(--sf-ease)}
#sf-to-top.sf-show{opacity:1;visibility:visible;transform:none}
#sf-to-top:hover{background:#e8192c}
#sf-to-top:hover svg{transform:translateY(-3px)}
@media(max-width:600px){#sf-to-top{right:12px;bottom:84px}}

/* ---------- 13. Švarus focus ---------- */
:focus-visible{outline:2px solid rgba(255,83,100,.8);outline-offset:3px;border-radius:6px}

/* ---------- 14. Pasirinkimas ir slinkimas ---------- */
html{scroll-behavior:smooth}
::selection{background:rgba(232,25,44,.45);color:#fff}

/* ---------- Krepšelis: įskrendanti prekė ---------- */
.sf-fly{
  position:fixed;left:0;top:0;z-index:2147483000;pointer-events:none;
  width:64px;height:64px;border-radius:16px;overflow:hidden;
  background:#1a0d10 center/cover no-repeat;
  border:1px solid rgba(255,255,255,.2);
  box-shadow:0 14px 30px rgba(0,0,0,.5);
  display:grid;place-items:center;color:#fff;font-size:22px;
  will-change:transform,opacity;
}
.sf-fly.sf-fly-icon{background:#c4101f;border-color:rgba(255,255,255,.25)}
.sf-fly svg{width:26px;height:26px;display:block}
@keyframes sfCartBump{0%{transform:scale(1)}30%{transform:scale(1.28) rotate(-8deg)}55%{transform:scale(.94) rotate(4deg)}100%{transform:scale(1) rotate(0)}}
.sf-cart-bump{animation:sfCartBump .55s var(--sf-ease)}
@keyframes sfBadgePop{0%{transform:scale(.4);opacity:0}60%{transform:scale(1.35)}100%{transform:scale(1);opacity:1}}
.sf-badge-pop{animation:sfBadgePop .45s var(--sf-ease)}
@keyframes sfRing{from{opacity:.7;transform:scale(.6)}to{opacity:0;transform:scale(2.1)}}
.sf-cart-ring{position:fixed;z-index:2147482990;pointer-events:none;border-radius:50%;border:2px solid #ff3347;animation:sfRing .6s ease-out forwards}
@keyframes sfBtnOk{0%{transform:scale(1)}40%{transform:scale(.95)}100%{transform:scale(1)}}
.sf-btn-ok{animation:sfBtnOk .35s var(--sf-ease)}

/* ---------- Mažiau "dirbtinio" blizgesio ----------
   Nuimam neoninius švytėjimus ir perteklinius gradientus, paliekam švarų,
   plokščią stilių su aiškiais kontūrais. */
h1,h2,h3,.sf-gen-title span,.ihr-h1,.inf-products-h2,.inf-block-h2{text-shadow:none!important}
.inf-products-h2 span,.ihr-h1 span{filter:none!important}
.sf-scanlines{display:none!important}
#sf-canvas::after{opacity:.35}
.card,.inf-ctile,.sf-update-card,.sf-lesson-card,.sf-aff-card,.sf-status-card{box-shadow:0 8px 24px rgba(0,0,0,.28)}
.btn-primary{box-shadow:none!important}
.btn-primary:hover{box-shadow:0 8px 20px rgba(0,0,0,.35)!important;filter:none}
.sf-gen-modal{box-shadow:0 30px 80px rgba(0,0,0,.7)!important}
.sf-gen-card:after,.sf-gen-icon{box-shadow:none}
.sf-gen-card:after{opacity:.5}

/* ---------- Teksto žymėjimas ir kopijavimas visur ---------- */
html,body,#app,#app *{-webkit-user-select:text;user-select:text}
button,.btn,summary,.inf-toggler,.carousel-control-prev,.carousel-control-next,.sf-gen-close{-webkit-user-select:none;user-select:none}  /* tik valdikliai */
a,img{-webkit-user-drag:none}                 /* nuorodos nebetempiamos – galima žymėti tekstą kortelėse */
::selection{background:rgba(232,25,44,.55);color:#fff;text-shadow:none}
::-moz-selection{background:rgba(232,25,44,.55);color:#fff}

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