/* Sayfa geçiş overlay */
.pt-overlay {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  background:
    radial-gradient(800px 500px at 20% 20%, rgba(196,163,90,.22), transparent 55%),
    linear-gradient(160deg, #0b1f33, #132c45 55%, #0a1a2b);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .22s ease, visibility .22s ease;
}
.pt-overlay.is-active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
.pt-stage {
  position: relative;
  width: min(340px, 78vw);
  height: 220px;
  perspective: 900px;
}
.pt-card {
  position: absolute;
  border-radius: 16px;
  display: grid;
  place-items: center;
  color: #fff;
  font-weight: 700;
  box-shadow: 0 14px 0 rgba(0,0,0,.2), 0 22px 40px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.4);
  transform-style: preserve-3d;
}
.pt-card svg { width: 28px; height: 28px; filter: drop-shadow(0 1px 1px rgba(0,0,0,.25)); }
.pt-a {
  width: 120px; height: 140px; left: 8%; top: 12%;
  background: linear-gradient(145deg, var(--gold-2, #ffd56a), var(--gold, #c4a35a) 55%, #8d6b2f);
}
.pt-b {
  width: 110px; height: 110px; right: 10%; top: 8%;
  background: linear-gradient(145deg, #5aa8ff, #1d5fd4 55%, #1347a8);
}
.pt-c {
  width: 130px; height: 100px; left: 28%; bottom: 6%;
  background: linear-gradient(145deg, #5eead4, #0d9488 55%, #0f766e);
}
.pt-brand {
  position: absolute; bottom: -2.6rem; left: 50%; transform: translateX(-50%);
  color: rgba(255,255,255,.9); font-size: .95rem; letter-spacing: .04em; white-space: nowrap;
}
.pt-fx { display: none; position: absolute; inset: 0; pointer-events: none; }

/* ——— cards3d (varsayılan) ——— */
body[data-transition="cards3d"] .pt-overlay.is-active .pt-a { animation: ptSpinIn .65s cubic-bezier(.2,.8,.2,1) both, ptBob 1.8s ease-in-out .65s infinite; }
body[data-transition="cards3d"] .pt-overlay.is-active .pt-b { animation: ptSpinIn .65s cubic-bezier(.2,.8,.2,1) .08s both, ptBob 2s ease-in-out .75s infinite; }
body[data-transition="cards3d"] .pt-overlay.is-active .pt-c { animation: ptSpinIn .65s cubic-bezier(.2,.8,.2,1) .14s both, ptBob 1.7s ease-in-out .85s infinite; }
body[data-transition="cards3d"] .pt-overlay.is-active .pt-brand { animation: ptFade .45s ease .2s both; }

/* ——— fade ——— */
body[data-transition="fade"] .pt-stage { display: none; }
body[data-transition="fade"] .pt-overlay { transition: opacity .35s ease; }

/* ——— slide_up ——— */
body[data-transition="slide_up"] .pt-stage { display: none; }
body[data-transition="slide_up"] .pt-overlay {
  transform: translateY(100%);
  transition: transform .4s cubic-bezier(.2,.8,.2,1), opacity .25s ease, visibility .25s;
  opacity: 1; visibility: hidden;
}
body[data-transition="slide_up"] .pt-overlay.is-active { transform: translateY(0); visibility: visible; }

/* ——— slide_left ——— */
body[data-transition="slide_left"] .pt-stage { display: none; }
body[data-transition="slide_left"] .pt-overlay {
  transform: translateX(100%);
  transition: transform .4s cubic-bezier(.2,.8,.2,1), opacity .25s, visibility .25s;
  opacity: 1; visibility: hidden;
}
body[data-transition="slide_left"] .pt-overlay.is-active { transform: translateX(0); visibility: visible; }

/* ——— zoom ——— */
body[data-transition="zoom"] .pt-stage { display: none; }
body[data-transition="zoom"] .pt-overlay {
  transform: scale(.6); opacity: 0;
  transition: transform .38s cubic-bezier(.2,.8,.2,1), opacity .38s ease, visibility .38s;
}
body[data-transition="zoom"] .pt-overlay.is-active { transform: scale(1); opacity: 1; visibility: visible; }

/* ——— wipe ——— */
body[data-transition="wipe"] .pt-stage { display: none; }
body[data-transition="wipe"] .pt-overlay {
  clip-path: inset(0 100% 0 0);
  transition: clip-path .45s ease, opacity .2s, visibility .2s;
  opacity: 1; visibility: hidden;
}
body[data-transition="wipe"] .pt-overlay.is-active { clip-path: inset(0 0 0 0); visibility: visible; }

/* ——— blinds ——— */
body[data-transition="blinds"] .pt-stage { display: none; }
body[data-transition="blinds"] .pt-fx { display: block; background:
  repeating-linear-gradient(90deg, var(--navy) 0 12%, transparent 12% 14%);
  transform: scaleX(0); transform-origin: left; transition: transform .5s ease;
}
body[data-transition="blinds"] .pt-overlay { background: transparent; }
body[data-transition="blinds"] .pt-overlay.is-active .pt-fx { transform: scaleX(1); }

/* ——— circle ——— */
body[data-transition="circle"] .pt-stage { display: none; }
body[data-transition="circle"] .pt-overlay {
  clip-path: circle(0% at 50% 50%);
  transition: clip-path .48s cubic-bezier(.2,.8,.2,1), opacity .2s, visibility .2s;
  opacity: 1; visibility: hidden;
}
body[data-transition="circle"] .pt-overlay.is-active { clip-path: circle(150% at 50% 50%); visibility: visible; }

/* ——— flip ——— */
body[data-transition="flip"] .pt-stage { display: none; }
body[data-transition="flip"] .pt-overlay {
  transform: perspective(800px) rotateY(90deg); opacity: 0;
  transition: transform .5s ease, opacity .35s, visibility .35s;
}
body[data-transition="flip"] .pt-overlay.is-active { transform: perspective(800px) rotateY(0); opacity: 1; visibility: visible; }

/* ——— blur ——— */
body[data-transition="blur"] .pt-stage { display: none; }
body[data-transition="blur"] .pt-overlay {
  backdrop-filter: blur(0); -webkit-backdrop-filter: blur(0);
  background: rgba(8,16,28,.55);
  transition: backdrop-filter .4s, opacity .4s, visibility .4s;
}
body[data-transition="blur"] .pt-overlay.is-active {
  backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
}

/* ——— curtain ——— */
body[data-transition="curtain"] .pt-stage { display: none; }
body[data-transition="curtain"] .pt-fx {
  display: block;
  background: linear-gradient(90deg, var(--navy) 50%, var(--navy-2) 50%);
  background-size: 200% 100%;
  transform: scaleY(0); transform-origin: top; transition: transform .5s cubic-bezier(.2,.8,.2,1);
}
body[data-transition="curtain"] .pt-overlay { background: transparent; }
body[data-transition="curtain"] .pt-overlay.is-active .pt-fx { transform: scaleY(1); }

/* ——— mosaic ——— */
body[data-transition="mosaic"] .pt-stage { display: none; }
body[data-transition="mosaic"] .pt-fx {
  display: grid; grid-template-columns: repeat(4,1fr); grid-template-rows: repeat(3,1fr); gap: 4px; padding: 4px;
}
body[data-transition="mosaic"] .pt-fx i {
  display: block; background: var(--navy-2); opacity: 0; transform: scale(.5);
  transition: opacity .25s ease, transform .35s ease;
}
body[data-transition="mosaic"] .pt-overlay { background: rgba(0,0,0,.35); }
body[data-transition="mosaic"] .pt-overlay.is-active .pt-fx i { opacity: 1; transform: scale(1); }
body[data-transition="mosaic"] .pt-overlay.is-active .pt-fx i:nth-child(1) { transition-delay: .02s; }
body[data-transition="mosaic"] .pt-overlay.is-active .pt-fx i:nth-child(2) { transition-delay: .06s; }
body[data-transition="mosaic"] .pt-overlay.is-active .pt-fx i:nth-child(3) { transition-delay: .1s; }
body[data-transition="mosaic"] .pt-overlay.is-active .pt-fx i:nth-child(4) { transition-delay: .14s; }
body[data-transition="mosaic"] .pt-overlay.is-active .pt-fx i:nth-child(5) { transition-delay: .08s; }
body[data-transition="mosaic"] .pt-overlay.is-active .pt-fx i:nth-child(6) { transition-delay: .12s; }
body[data-transition="mosaic"] .pt-overlay.is-active .pt-fx i:nth-child(7) { transition-delay: .16s; }
body[data-transition="mosaic"] .pt-overlay.is-active .pt-fx i:nth-child(8) { transition-delay: .2s; }
body[data-transition="mosaic"] .pt-overlay.is-active .pt-fx i:nth-child(9) { transition-delay: .14s; }
body[data-transition="mosaic"] .pt-overlay.is-active .pt-fx i:nth-child(10) { transition-delay: .18s; }
body[data-transition="mosaic"] .pt-overlay.is-active .pt-fx i:nth-child(11) { transition-delay: .22s; }
body[data-transition="mosaic"] .pt-overlay.is-active .pt-fx i:nth-child(12) { transition-delay: .26s; }

/* ——— ripple ——— */
body[data-transition="ripple"] .pt-stage { display: none; }
body[data-transition="ripple"] .pt-fx {
  display: block; border-radius: 50%; border: 3px solid var(--gold);
  width: 40px; height: 40px; margin: auto; top: 50%; left: 50%;
  transform: translate(-50%,-50%) scale(0); opacity: .9;
  position: absolute;
}
body[data-transition="ripple"] .pt-overlay.is-active .pt-fx { animation: ptRipple .7s ease-out both; }

/* ——— shutter ——— */
body[data-transition="shutter"] .pt-stage { display: none; }
body[data-transition="shutter"] .pt-fx {
  display: block; background: var(--navy);
  clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
  transition: clip-path .48s ease;
}
body[data-transition="shutter"] .pt-overlay { background: transparent; }
body[data-transition="shutter"] .pt-overlay.is-active .pt-fx { clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); }

/* ——— diagonal ——— */
body[data-transition="diagonal"] .pt-stage { display: none; }
body[data-transition="diagonal"] .pt-overlay {
  clip-path: polygon(0 0, 0 0, 0 100%, 0 100%);
  transition: clip-path .45s ease, visibility .2s; opacity: 1; visibility: hidden;
}
body[data-transition="diagonal"] .pt-overlay.is-active {
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); visibility: visible;
}

/* ——— book ——— */
body[data-transition="book"] .pt-stage { display: none; }
body[data-transition="book"] .pt-overlay {
  transform-origin: left center;
  transform: perspective(1000px) rotateY(-85deg);
  transition: transform .52s cubic-bezier(.2,.8,.2,1), opacity .3s, visibility .3s;
  opacity: 0;
}
body[data-transition="book"] .pt-overlay.is-active { transform: perspective(1000px) rotateY(0); opacity: 1; visibility: visible; }

/* ——— glitch ——— */
body[data-transition="glitch"] .pt-stage { display: none; }
body[data-transition="glitch"] .pt-overlay.is-active { animation: ptGlitch .42s steps(2) both; }

/* ——— wave ——— */
body[data-transition="wave"] .pt-stage { display: none; }
body[data-transition="wave"] .pt-fx {
  display: block;
  background:
    radial-gradient(circle at 20% 50%, color-mix(in srgb, var(--gold) 40%, transparent), transparent 40%),
    radial-gradient(circle at 80% 40%, rgba(56,189,248,.35), transparent 45%),
    var(--navy);
  animation: none; opacity: 0; transition: opacity .35s;
}
body[data-transition="wave"] .pt-overlay { background: transparent; }
body[data-transition="wave"] .pt-overlay.is-active .pt-fx { opacity: 1; animation: ptWaveBg 1.2s ease-in-out infinite; }

/* ——— pixel ——— */
body[data-transition="pixel"] .pt-stage { display: none; }
body[data-transition="pixel"] .pt-fx {
  display: grid; grid-template-columns: repeat(8,1fr); grid-template-rows: repeat(5,1fr); gap: 2px;
}
body[data-transition="pixel"] .pt-fx i {
  background: var(--navy-3); opacity: 0; transition: opacity .15s;
}
body[data-transition="pixel"] .pt-overlay { background: #000; }
body[data-transition="pixel"] .pt-overlay.is-active .pt-fx i { opacity: 1; }

/* ——— none ——— */
body[data-transition="none"] .pt-overlay { display: none !important; }

@keyframes ptSpinIn {
  from { opacity: 0; transform: translateY(24px) rotateX(28deg) scale(.9); }
  to { opacity: 1; transform: translateY(0) rotateX(0) scale(1); }
}
@keyframes ptBob {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-8px); }
}
@keyframes ptFade {
  from { opacity: 0; transform: translateX(-50%) translateY(6px); }
  to { opacity: 1; transform: translateX(-50%) translateY(0); }
}
@keyframes ptRipple {
  to { transform: translate(-50%,-50%) scale(28); opacity: 0; }
}
@keyframes ptGlitch {
  0% { transform: translate(0); filter: none; }
  20% { transform: translate(-6px,2px); filter: hue-rotate(90deg); }
  40% { transform: translate(6px,-2px); }
  60% { transform: translate(-3px,0); filter: hue-rotate(-40deg); }
  100% { transform: translate(0); filter: none; }
}
@keyframes ptWaveBg {
  0%, 100% { filter: hue-rotate(0deg); }
  50% { filter: hue-rotate(25deg); }
}

@media (prefers-reduced-motion: reduce) {
  .pt-overlay, .pt-overlay * { animation: none !important; transition: none !important; }
  body[data-transition]:not([data-transition="none"]) .pt-overlay.is-active {
    opacity: .92;
  }
}