/* PuanımNe — site geneli animasyon ve süsleme katmanı (fx). Tüm sayfalara eklenir.
   Hareket azaltma tercihinde (prefers-reduced-motion) animasyonların tamamı kapanır. */

@view-transition{navigation:auto}
::view-transition-old(root){animation:fx-vt-out .18s ease both}
::view-transition-new(root){animation:fx-vt-in .32s cubic-bezier(.2,.7,.2,1) both}
@keyframes fx-vt-out{to{opacity:0;transform:translateY(-6px)}}
@keyframes fx-vt-in{from{opacity:0;transform:translateY(10px)}}

/* ---- Kaydırınca beliren öğeler ---- */
html.fx-on [data-fx-rv]{transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1);transition-delay:var(--fx-d,0ms)}
html.fx-on [data-fx-rv="wait"]{opacity:0;transform:translateY(26px)}
html.fx-on [data-fx-rv="wait"][data-fx-dir="l"]{transform:translateX(-30px)}
html.fx-on [data-fx-rv="wait"][data-fx-dir="r"]{transform:translateX(30px)}
html.fx-on [data-fx-rv="wait"][data-fx-dir="z"]{transform:scale(.94)}

/* ---- Üst okuma çubuğu ---- */
.fx-progress{position:fixed;left:0;top:0;height:3px;width:100%;z-index:9999;pointer-events:none;transform-origin:0 50%;transform:scaleX(var(--fx-p,0));
  background:linear-gradient(90deg,#059669,#10b981 35%,#fd761a 70%,#007cb1);box-shadow:0 0 10px rgba(16,185,129,.45)}

/* ---- Yukarı çık düğmesi ---- */
.fx-top{position:fixed;right:18px;bottom:18px;z-index:60;width:48px;height:48px;border:0;border-radius:50%;cursor:pointer;display:grid;place-items:center;
  background:#fff;color:#006948;box-shadow:0 8px 24px rgba(19,27,46,.16);opacity:0;transform:translateY(16px) scale(.9);pointer-events:none;
  transition:opacity .25s,transform .25s cubic-bezier(.2,.7,.2,1)}
.fx-top.fx-show{opacity:1;transform:none;pointer-events:auto}
.fx-top:hover{transform:translateY(-3px)}
.fx-top svg.fx-ring{position:absolute;inset:0;transform:rotate(-90deg)}
.fx-top svg.fx-ring circle{fill:none;stroke-width:3}
.fx-top .fx-ring-bg{stroke:#e2e7ff}
.fx-top .fx-ring-fg{stroke:url(#fx-grad);stroke-linecap:round;stroke-dasharray:138.2;stroke-dashoffset:calc(138.2 - 138.2 * var(--fx-p,0))}
.fx-top:focus-visible{outline:3px solid rgba(0,133,93,.45);outline-offset:3px}
@media print{.fx-top,.fx-progress,.fx-deco{display:none!important}}

/* ---- Hero süsleme katmanı ---- */
[data-fx-hero]{isolation:isolate;position:relative}
.fx-deco{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.fx-blob{position:absolute;border-radius:50%;filter:blur(60px);opacity:.55;will-change:transform}
.fx-blob.b1{width:340px;height:340px;left:-80px;top:-60px;background:radial-gradient(circle,rgba(16,185,129,.55),rgba(16,185,129,0) 70%);animation:fx-blob1 18s ease-in-out infinite}
.fx-blob.b2{width:300px;height:300px;right:-70px;top:40px;background:radial-gradient(circle,rgba(253,118,26,.38),rgba(253,118,26,0) 70%);animation:fx-blob2 22s ease-in-out infinite}
.fx-blob.b3{width:280px;height:280px;left:40%;bottom:-140px;background:radial-gradient(circle,rgba(0,124,177,.35),rgba(0,124,177,0) 70%);animation:fx-blob3 26s ease-in-out infinite}
@keyframes fx-blob1{50%{transform:translate(90px,60px) scale(1.15)}}
@keyframes fx-blob2{50%{transform:translate(-80px,70px) scale(.9)}}
@keyframes fx-blob3{50%{transform:translate(-60px,-50px) scale(1.2)}}
.fx-grid{position:absolute;inset:0;opacity:.5;
  background-image:radial-gradient(rgba(0,105,72,.14) 1px,transparent 1.2px);background-size:26px 26px;
  -webkit-mask-image:radial-gradient(ellipse 70% 60% at 50% 40%,#000 20%,transparent 75%);mask-image:radial-gradient(ellipse 70% 60% at 50% 40%,#000 20%,transparent 75%)}
.fx-sym{position:absolute;font-family:'Plus Jakarta Sans',system-ui,sans-serif;font-weight:800;line-height:1;user-select:none;
  animation:fx-float var(--fx-t,9s) ease-in-out var(--fx-dl,0s) infinite;opacity:var(--fx-o,.16)}
.fx-sym svg{display:block}
@keyframes fx-float{0%,100%{transform:translateY(0) rotate(var(--fx-r0,-6deg))}50%{transform:translateY(-18px) rotate(var(--fx-r1,6deg))}}
@media(max-width:767px){.fx-sym.fx-lg-only{display:none}.fx-blob{filter:blur(46px);opacity:.4}}

/* ---- Kart ışığı (fare takibi) ---- */
[data-fx-card]{transition:box-shadow .3s ease,transform .3s cubic-bezier(.2,.7,.2,1)}
[data-fx-card]:hover{box-shadow:0 14px 34px -12px rgba(0,105,72,.28),0 0 0 1px rgba(16,185,129,.22)}
[data-fx-card="glow"]:hover{background-image:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),rgba(16,185,129,.10),transparent 42%)}
.qb-card[data-fx-card]:hover{transform:translateY(-4px)}

/* ---- Düğmeler ---- */
.qb-btn--cta,.fx-shine{position:relative;overflow:hidden}
.qb-btn--cta::after,.fx-shine::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.45) 48%,transparent 66%);transform:translateX(-120%);animation:fx-shine 4.5s ease-in-out 1.2s infinite;pointer-events:none}
@keyframes fx-shine{0%,70%{transform:translateX(-120%)}100%{transform:translateX(120%)}}
.kpss-root button:active,.kpss-root a.qb-btn:active{transform:scale(.97)}

/* ---- Sayaç / rozet efektleri ---- */
.fx-pop{animation:fx-pop .5s cubic-bezier(.2,1.4,.4,1) both}
@keyframes fx-pop{from{transform:scale(.6);opacity:0}}
.fx-pulse-dot{position:relative}
.fx-pulse-dot::before{content:"";position:absolute;inset:-4px;border-radius:inherit;border:2px solid currentColor;opacity:0;animation:fx-ping 2.2s cubic-bezier(0,0,.2,1) infinite}
@keyframes fx-ping{0%{transform:scale(.8);opacity:.6}80%,100%{transform:scale(1.8);opacity:0}}

/* ---- Bölüm ayırıcı dalga ---- */
.fx-wave{display:block;width:100%;height:46px;margin:-1px 0 0;color:var(--k-sc-low,#f2f3ff)}
.fx-wave path{animation:fx-wave 12s ease-in-out infinite alternate}
@keyframes fx-wave{to{d:path("M0 22 C 240 44 480 0 720 22 C 960 44 1200 6 1440 24 V46 H0Z")}}

@media (prefers-reduced-motion:reduce){
  html.fx-on [data-fx-rv="wait"]{opacity:1!important;transform:none!important}
  .fx-blob,.fx-sym,.fx-wave path,.qb-btn--cta::after,.fx-shine::after,.fx-pulse-dot::before{animation:none!important}
  ::view-transition-old(root),::view-transition-new(root){animation:none!important}
  [data-fx-card],.fx-top{transition:none!important}
}