/* Ekon – Flip (stabil) */
.ek-wrap{background:#111;padding:12px;border-radius:14px;box-shadow:0 10px 30px rgba(0,0,0,.25)}
.ek-toolbar{display:flex;align-items:center;justify-content:space-between;color:#fff;margin-bottom:8px;gap:8px}
.ek-title{font-weight:600;letter-spacing:.2px;opacity:.9}
.ek-tools{display:flex;gap:6px}
.ek-btn{background:#222;color:#fff;border:1px solid #333;padding:6px 10px;border-radius:8px;cursor:pointer}
.ek-btn:hover{background:#2c2c2c}
.ek-fallback-link{margin-top:10px;color:#ccc;font-size:14px}

.ek-stage{position:relative;width:100%;min-height:480px;background:#000;border-radius:10px;overflow:hidden}
.ek-book{position:relative;width:100%;height:var(--ekh,70vh);min-height:480px;display:flex;justify-content:center;align-items:center;perspective:2000px}
.ek-spread{position:relative;width:min(1200px,96%);height:100%;display:grid;grid-template-columns:1fr 1fr;gap:0;align-items:center}

.ek-page{position:relative;width:100%;height:100%;background:#000;display:flex;justify-content:center;align-items:center;overflow:hidden}
.ek-page img{max-width:100%;max-height:100%;object-fit:contain;filter:drop-shadow(0 2px 12px rgba(0,0,0,.4))}
/* sayfaya tıklayınca flip */
.ek-page{ cursor:pointer; }
.ek-page.blank { background:#000; }
.ek-page.blank img { display:none; }
.ek-shadow-left{box-shadow:inset -80px 0 120px -80px rgba(0,0,0,.75)}
.ek-shadow-right{box-shadow:inset 80px 0 120px -80px rgba(0,0,0,.75)}

/* Flip overlay */
.ek-turn{position:absolute;top:0;left:50%;width:50%;height:100%;transform-origin:left center;transform-style:preserve-3d;pointer-events:none}
.ek-turn .face{position:absolute;inset:0;backface-visibility:hidden;display:flex;justify-content:center;align-items:center;background:#000}
.ek-turn .face img{max-width:100%;max-height:100%;object-fit:contain}
.ek-turn .back{transform:rotateY(180deg)}
.ek-turn .fx{position:absolute;inset:0;background:linear-gradient(90deg, rgba(0,0,0,.25), rgba(0,0,0,0));mix-blend-mode:multiply;pointer-events:none}

.ek-turn.flip{animation:ek-flip .6s ease forwards}
@keyframes ek-flip{0%{transform:rotateY(0)}100%{transform:rotateY(-180deg)}}

.ek-turn.fliprev{left:0;transform-origin:right center;animation:ek-fliprev .6s ease forwards}
@keyframes ek-fliprev{0%{transform:rotateY(0)}100%{transform:rotateY(180deg)}}
/* ekon-flip.css */
.ek-turn{ display:none; z-index:3; }   /* z-index kalsın, display: none eklendi */


/* Sayfa numarası */
.ek-counter{position:absolute;right:10px;bottom:10px;color:#ddd;background:rgba(0,0,0,.5);padding:4px 8px;border-radius:8px;font-size:12px}