/* PHP sürümü için ek stiller: sayfa geçişleri, lightbox, slider — Tailwind build çıktısına ek */

.reveal { opacity: 0; transform: translateY(18px); transition: opacity .7s ease, transform .7s ease; }
.reveal-visible { opacity: 1; transform: translateY(0); }

/* Hero slider */
.hero-slide { position: absolute; inset: 0; opacity: 0; transition: opacity 1.1s ease; }
.hero-slide.is-active { opacity: 1; z-index: 1; }
.hero-dots { position: absolute; bottom: 1.5rem; left: 50%; transform: translateX(-50%); display: flex; gap: .5rem; z-index: 20; }
.hero-dot { width: 8px; height: 8px; border-radius: 50%; background: rgba(255,255,255,.4); cursor: pointer; border: none; padding: 0; }
.hero-dot.is-active { background: rgba(255,255,255,.95); }

/* Lightbox */
.lightbox-overlay { position: fixed; inset: 0; z-index: 70; display: flex; align-items: center; justify-content: center; background: rgba(10,10,10,.95); padding: 1rem; }
.lightbox-overlay.hidden { display: none; }
.lightbox-img { max-height: 80svh; max-width: 100%; object-fit: contain; }
.lightbox-nav { position: absolute; top: 50%; transform: translateY(-50%); background: rgba(10,10,10,.6); color: #fff; padding: .75rem; border: none; cursor: pointer; }
.lightbox-close { position: absolute; top: 1.25rem; right: 1.25rem; color: rgba(255,255,255,.85); background: none; border: none; cursor: pointer; font-size: 1.75rem; line-height: 1; }
.lightbox-caption { margin-top: 1rem; text-align: center; font-size: .7rem; letter-spacing: .18em; text-transform: uppercase; color: rgba(255,255,255,.7); }

/* Video modal */
.video-modal { position: fixed; inset: 0; z-index: 70; display: flex; align-items: center; justify-content: center; background: rgba(10,10,10,.95); padding: 1rem; }
.video-modal.hidden { display: none; }

[dir="rtl"] .rtl-flip { transform: scaleX(-1); }
