/* ==================================================================
   Elite Escape Village — ee-motion.css
   Doğa / bungalov temalı, sade hareket katmanı.
   - Yazılara, logoya ve renk sistemine dokunmaz.
   - Dekoratif öğeler (gece silüeti, ateş böcekleri, güneş/ay ikonları)
     ee-motion.js tarafından eklenir; JS yoksa site olduğu gibi kalır.
   - Ekran dışındaki animasyonlar durur; "azaltılmış hareket" ayarında
     tüm döngüsel animasyonlar kapanır.
   ================================================================== */

:root{
  --ee-ease-out: cubic-bezier(.22,1,.36,1);
  --ee-glow: #F2C46B;
  --ee-ember: #E8A03C;
  --ee-firefly: #E9E3A0;
}

/* ---------- 1. Footer: hareketli gece köyü silüeti ---------- */
.ee-sky{
  position:absolute; left:0; right:0; bottom:calc(100% - 1px);
  height:clamp(56px, 8.4vw, 132px);
  pointer-events:none; z-index:1; overflow:visible;
}
.bfoot.ee-sky-host, .lp-foot.ee-sky-host{ margin-top:clamp(64px, 8vw, 120px); }
.ee-sky svg{ display:block; width:100%; height:100%; overflow:visible; }
.ee-sky .far{ opacity:.55; }
.ee-sky .win{ fill:var(--ee-glow); animation:eeWin 5s ease-in-out infinite alternate; }
.ee-sky .win.b{ animation-duration:7s; animation-delay:-2s; }
.ee-sky .win.c{ animation-duration:4s; animation-delay:-1s; }
.ee-sky .halo{ fill:var(--ee-glow); opacity:.16; filter:blur(6px); animation:eeHalo 5s ease-in-out infinite alternate; }
.ee-sky .sway{ transform-box:fill-box; transform-origin:50% 100%; animation:eeSway 9s ease-in-out infinite; }
.ee-sky .sway.b{ animation-duration:12s; animation-delay:-4s; }
.ee-sky .flame{ transform-box:fill-box; transform-origin:50% 100%; fill:var(--ee-ember); animation:eeFlame 1.1s ease-in-out infinite alternate; }
.ee-sky .flame.in{ fill:#F7D27A; animation-duration:.8s; animation-delay:-.3s; }
.ee-sky .firelight{ fill:var(--ee-ember); opacity:.22; filter:blur(8px); animation:eeHalo 1.6s ease-in-out infinite alternate; }
.ee-sky .spark{ fill:#F7C66A; opacity:0; transform-box:fill-box; animation:eeSpark 3.2s ease-out infinite; }
.ee-sky .fly{ fill:var(--ee-firefly); opacity:0; transform-box:fill-box; animation:eeFly 9s ease-in-out infinite; filter:drop-shadow(0 0 3px rgba(233,227,160,.9)); }
.ee-sky .smoke{ fill:none; stroke:rgba(246,244,236,.35); stroke-width:2; stroke-linecap:round; stroke-dasharray:6 90; animation:eeSmoke 6s linear infinite; }

@keyframes eeWin{ 0%{ opacity:.72; } 40%{ opacity:1; } 55%{ opacity:.86; } 100%{ opacity:.95; } }
@keyframes eeHalo{ from{ opacity:.10; } to{ opacity:.24; } }
@keyframes eeSway{ 0%,100%{ transform:rotate(-1.4deg); } 50%{ transform:rotate(1.4deg); } }
@keyframes eeFlame{ 0%{ transform:scale(1,1) skewX(0deg); } 50%{ transform:scale(.9,1.15) skewX(4deg); } 100%{ transform:scale(1.05,.9) skewX(-3deg); } }
@keyframes eeSpark{
  0%{ opacity:0; transform:translate(0,0); }
  15%{ opacity:1; }
  100%{ opacity:0; transform:translate(var(--dx,6px), -46px); }
}
@keyframes eeFly{
  0%{ opacity:0; transform:translate(0,0); }
  20%{ opacity:.95; }
  45%{ opacity:.35; transform:translate(var(--fx,14px), var(--fy,-10px)); }
  70%{ opacity:.9; }
  100%{ opacity:0; transform:translate(calc(var(--fx,14px) * -.6), calc(var(--fy,-10px) * 1.8)); }
}
@keyframes eeSmoke{ from{ stroke-dashoffset:96; } to{ stroke-dashoffset:0; } }

/* ---------- 2. Koyu bölümlerde ateş böcekleri ---------- */
.ee-flies{ position:absolute; inset:0; pointer-events:none; overflow:hidden; z-index:0; }
.ee-flies i{
  position:absolute; width:4px; height:4px; border-radius:50%;
  background:var(--ee-firefly);
  box-shadow:0 0 6px 2px rgba(233,227,160,.55), 0 0 16px 4px rgba(233,227,160,.18);
  opacity:0; animation:eeFlyDom var(--d,12s) ease-in-out var(--dl,0s) infinite;
}
@keyframes eeFlyDom{
  0%{ opacity:0; transform:translate(0,0); }
  18%{ opacity:.85; }
  40%{ opacity:.25; }
  55%{ opacity:.8; transform:translate(var(--fx,30px), var(--fy,-24px)); }
  100%{ opacity:0; transform:translate(calc(var(--fx,30px) * 1.6), calc(var(--fy,-24px) * -.4)); }
}
.ee-flies-host > .container{ position:relative; z-index:1; }

/* Ekran dışındayken tüm döngüler durur (performans) */
.ee-paused .win, .ee-paused .halo, .ee-paused .sway, .ee-paused .flame, .ee-paused .firelight,
.ee-paused .spark, .ee-paused .fly, .ee-paused .smoke, .ee-paused i{ animation-play-state:paused !important; }

/* ---------- 3. Özel / Ortak alan seçicisinde ay & güneş ---------- */
.ee-dico{ display:inline-flex; width:18px; height:18px; margin-inline-end:8px; vertical-align:-3px; }
.ee-dico svg{ width:100%; height:100%; overflow:visible; }
.duality-toggle button .ee-dico{ opacity:.55; transition:opacity .3s ease; }
.duality-toggle button.active .ee-dico{ opacity:1; }
.duality-toggle button.active .ee-dico svg{ animation:eeIcoIn .7s var(--ee-ease-out) both; }
.ee-dico .rays{ transform-box:fill-box; transform-origin:center; }
.duality-toggle button.active .ee-dico .rays{ animation:eeSpin 24s linear infinite; }
.ee-dico .star{ fill:currentColor; opacity:0; }
.duality-toggle button.active .ee-dico .star{ animation:eeTwinkle 2.6s ease-in-out infinite; }
.duality-toggle button.active .ee-dico .star.b{ animation-delay:-1.3s; }
@keyframes eeIcoIn{ from{ transform:rotate(-40deg) scale(.6); opacity:0; } to{ transform:none; opacity:1; } }
@keyframes eeSpin{ to{ transform:rotate(360deg); } }
@keyframes eeTwinkle{ 0%,100%{ opacity:0; } 50%{ opacity:1; } }

/* ---------- 4. Küçük dokunuşlar ---------- */
/* SSS: yumuşak açılma (destekleyen tarayıcılarda) */
details{ interpolate-size:allow-keywords; }
details::details-content{
  block-size:0; overflow:clip;
  transition:block-size .5s var(--ee-ease-out), content-visibility .5s allow-discrete;
}
details[open]::details-content{ block-size:auto; }

/* Mobil menü: yukarıdan yumuşak açılış */
.nav-mobile.open{ animation:eeMenuIn .45s var(--ee-ease-out) both; }
.nav-mobile.open > a{ animation:eeItemIn .5s var(--ee-ease-out) both; animation-delay:calc(var(--ee-i, 0) * 30ms + 60ms); }
@keyframes eeMenuIn{ from{ opacity:0; clip-path:inset(0 0 100% 0); } to{ opacity:1; clip-path:inset(0 0 0 0); } }
@keyframes eeItemIn{ from{ opacity:0; transform:translateY(-6px); } to{ opacity:1; transform:none; } }

/* Lightbox görseli yumuşak büyüyerek açılır */
.ee-lb.open img{ animation:eeZoomIn .5s var(--ee-ease-out) both; }
@keyframes eeZoomIn{ from{ opacity:0; transform:scale(.94); } to{ opacity:1; transform:none; } }

/* Hero fotoğrafında hafif derinlik (yalnız görsel katman, yazılar sabit) */
@supports (animation-timeline: scroll()){
  .hero-slides{ animation:eeParallax linear both; animation-timeline:scroll(root); animation-range:0 100vh; }
}
@keyframes eeParallax{ to{ transform:translate3d(0, 14vh, 0); } }

/* Sayfalar arası yumuşak geçiş */
@view-transition{ navigation:auto; }

/* ---------- 5. Web yazılım kredisi (footer altı) ---------- */
.ee-credit{ position:relative; z-index:1; text-align:center; font-size:.68rem; line-height:1.4; letter-spacing:.02em; padding:12px 16px 0; }
.ee-credit a{ color:inherit; text-decoration:none; opacity:.42; transition:opacity .25s ease; }
.ee-credit a:hover, .ee-credit a:focus-visible{ opacity:.9; }

/* ---------- 6. Düzeltme: blog alt bilgi bağlantıları mobilde taşıyordu ----------
   (satır kırılmadığı için sayfa yatay kayıyor, WhatsApp butonu ve çerez
   bandı ekran dışına itiliyordu) */
.bfoot .bflinks{ display:flex; flex-wrap:wrap; gap:8px 14px; min-width:0; max-width:100%; }
.bfoot .bflinks a{ margin-right:0; }

/* ---------- 7. Erişilebilirlik ---------- */
@media (prefers-reduced-motion: reduce){
  .ee-sky *, .ee-flies i, .ee-dico *, .ee-dico svg{ animation:none !important; }
  .ee-sky .fly, .ee-sky .spark, .ee-flies{ display:none; }
  .ee-sky .smoke{ display:none; }
  .hero-slides, .nav-mobile.open, .nav-mobile.open > a, .ee-lb.open img{ animation:none !important; }
  details::details-content{ transition:none; }
  ::view-transition-group(*), ::view-transition-old(*), ::view-transition-new(*){ animation:none !important; }
}
@media print{ .ee-sky, .ee-flies{ display:none !important; } }
