/* Palıd Travel — əsas səhifə: axıcılıq (yalnız index.html). Mövcud dizayn dəyişmir, sadəcə hərəkət yumşalır. */

/* Fonda qızılı 3D ipək dalğaları */
#pfx { position: fixed; inset: 0; width: 100%; height: 100%; z-index: -1; pointer-events: none; }

/* Axıcı sürüşmə JS ilə idarə olunur (brauzerin öz “smooth”u ilə toqquşmasın) */
html.p-smooth, html.p-smooth body { scroll-behavior: auto !important; }

/* Kartlar əyilməsin — yerinə yumşaq qalxma */
.card-3d { transform: none !important; transition: translate .5s cubic-bezier(.2,.8,.2,1), box-shadow .5s, border-color .4s !important; }
.card-3d:hover { translate: 0 -8px; }
.card-img-wrapper { transform: none !important; }
.card-img-wrapper img { transition: transform 1.2s cubic-bezier(.2,.8,.2,1) !important; }
.card-3d:hover .card-img-wrapper img { transform: scale(1.06) !important; }
.domestic-img:hover { transform: scale(1.02) !important; }

/* Bölmələr ekrana girəndə yumşaq, bulanıqlıqdan açılsın */
.reveal { opacity: 0; transform: translate3d(0, 40px, 0) scale(.98); filter: blur(6px);
  transition: opacity 1.1s cubic-bezier(.2,.8,.2,1), transform 1.1s cubic-bezier(.2,.8,.2,1), filter 1.1s !important; }
.reveal.active { opacity: 1; transform: none; filter: none; }
.tours-grid > * { opacity: 0; transform: translate3d(0, 34px, 0); transition: opacity .9s cubic-bezier(.2,.8,.2,1), transform .9s cubic-bezier(.2,.8,.2,1); }
.tours-grid > .p-in { opacity: 1; transform: none; }

/* Hero: dərinlik (video arxada yavaş, yazı önə doğru solur) */
.hero-video-container { will-change: transform; transition: none !important; }
.hero-content { will-change: transform, opacity; }

@media (prefers-reduced-motion: reduce) {
  #pfx { display: none; }
  .reveal, .tours-grid > * { opacity: 1 !important; transform: none !important; filter: none !important; }
}

/* ═══ Kinematik 3D giriş ═══ */
html.p-lock, html.p-lock body { overflow: hidden !important; }
#pIntro { position: fixed; inset: 0; z-index: 100000; background: radial-gradient(120% 90% at 50% 45%, #0b1b33 0%, #040d1a 55%, #02060d 100%); display: grid; place-items: center; overflow: hidden;
  transition: opacity 1s cubic-bezier(.6,0,.2,1), transform 1.1s cubic-bezier(.6,0,.2,1), filter 1s; }
#pIntro canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
#pIntro.out { opacity: 0; transform: scale(1.25); filter: blur(6px); pointer-events: none; }
.pi-txt { position: relative; z-index: 2; text-align: center; margin-top: 44vh; perspective: 900px; pointer-events: none; }
.pi-logo { font-family: 'Playfair Display', Georgia, serif; font-weight: 700; font-size: clamp(2.6rem, 7vw, 5.4rem); letter-spacing: .04em; line-height: 1; white-space: nowrap; }
.pi-logo span { display: inline-block; opacity: 0; transform-origin: 50% 100%; color: #D4AF37;
  background: linear-gradient(180deg, #fff3c4 0%, #D4AF37 55%, #9c7a1c 100%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
  text-shadow: 0 0 30px rgba(212,175,55,.25); animation: piLetter 1.1s cubic-bezier(.2,.9,.2,1) forwards; }
.pi-logo span.tr { background: linear-gradient(180deg, #ffffff 0%, #dfe8ff 100%); -webkit-background-clip: text; background-clip: text; }
@keyframes piLetter { 0% { opacity: 0; transform: translate3d(0, 60px, -200px) rotateX(-95deg); filter: blur(8px); } 60% { opacity: 1; filter: blur(0); } 100% { opacity: 1; transform: none; } }
.pi-sub { margin-top: 14px; color: #ccd6f6; letter-spacing: .35em; text-transform: uppercase; font-size: clamp(.62rem, 1.4vw, .85rem); opacity: 0; animation: piSub 1.2s 2.3s cubic-bezier(.2,.8,.2,1) forwards; }
@keyframes piSub { from { opacity: 0; letter-spacing: 1em; } to { opacity: .85; letter-spacing: .35em; } }
.pi-skip { position: absolute; z-index: 3; right: 22px; bottom: calc(22px + env(safe-area-inset-bottom)); background: rgba(255,255,255,.06); border: 1px solid rgba(212,175,55,.35); color: #e8d9a8; padding: 9px 16px; border-radius: 99px; font-size: .8rem; letter-spacing: .1em; cursor: pointer; backdrop-filter: blur(8px); opacity: 0; animation: piSub .8s 1s forwards; }
.pi-skip:hover { background: rgba(212,175,55,.18); }
/* WebGL olmayanda: yalnız 3D yazı + qızılı halqalar */
#pIntro.flat::before, #pIntro.flat::after { content: ''; position: absolute; width: 46vmin; height: 46vmin; border-radius: 50%; border: 1px solid rgba(212,175,55,.45); top: 50%; left: 50%; margin: -30vmin 0 0 -23vmin; animation: piRing 6s linear infinite; }
#pIntro.flat::after { width: 60vmin; height: 60vmin; margin: -37vmin 0 0 -30vmin; border-color: rgba(255,255,255,.18); animation-duration: 9s; animation-direction: reverse; }
@keyframes piRing { from { transform: rotateX(70deg) rotateZ(0); } to { transform: rotateX(70deg) rotateZ(360deg); } }

/* Girişdən sonra hero “açılır” */
body.p-go .hero-video { animation: pHeroV 2s cubic-bezier(.2,.8,.2,1) both; }
@keyframes pHeroV { from { transform: scale(1.35); filter: blur(12px) brightness(.35); } to { transform: none; filter: none; } }
body.p-go .hero-content h1 { animation: pHeroT 1.4s .25s cubic-bezier(.2,.9,.2,1) both; }
body.p-go .hero-content p { animation: pHeroT 1.4s .5s cubic-bezier(.2,.9,.2,1) both; }
.hero-content { perspective: 900px; }
@keyframes pHeroT { from { opacity: 0; transform: translate3d(0, 50px, -120px) rotateX(-35deg); filter: blur(6px); } to { opacity: 1; transform: none; filter: none; } }

/* Sürüşdükcə bölmələr dərinlikdən, arxaya əyilmiş halda üzərək gəlsin (fluid.js idarə edir) */
.p-depth { transform-origin: 50% 0%; will-change: transform, opacity; }
/* Tur kartları dönərək açılsın */
.tours-grid > * { opacity: 0; translate: 0 40px; rotate: y -28deg; transform: none; transition: opacity 1s cubic-bezier(.2,.8,.2,1), translate 1s cubic-bezier(.2,.8,.2,1), rotate 1.1s cubic-bezier(.2,.8,.2,1), box-shadow .5s, border-color .4s !important; }
.tours-grid > .p-in { opacity: 1; translate: 0 0; rotate: none; }
.tours-grid > .p-in:hover { translate: 0 -8px; }

@media (prefers-reduced-motion: reduce) {
  .tours-grid > * { opacity: 1 !important; translate: none !important; rotate: none !important; }
  body.p-go .hero-video, body.p-go .hero-content h1, body.p-go .hero-content p { animation: none; }
}
.pi-txt::before { content: ''; position: absolute; left: 50%; top: 50%; width: 140%; height: 220%; transform: translate(-50%, -50%); background: radial-gradient(closest-side, rgba(2,6,13,.75), transparent); z-index: -1; }