:root{
  --gece:#0B0A1C; --morgece:#151233; --kadife:#1E1946;
  --altin:#D9B36C; --altin-parlak:#F0D89A; --nazar:#43C6C8;
  --fildisi:#F1EADB; --sis:#9A93B8; --gul:#C98A9E; --radius:14px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--gece);color:var(--fildisi);font-family:'Manrope',sans-serif;font-weight:300;line-height:1.75;overflow-x:hidden;min-height:100vh}
::selection{background:rgba(217,179,108,.35)}
h1,h2,h3,.serif{font-family:'Cormorant Garamond',serif;font-weight:500}
a{color:var(--nazar)}
a:focus-visible,button:focus-visible,input:focus-visible{outline:2px solid var(--nazar);outline-offset:3px;border-radius:4px}
.gizli{display:none!important}

#gokyuzu{position:fixed;inset:0;z-index:0;pointer-events:none}
.vinyet{position:fixed;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(ellipse 120% 80% at 50% -10%,rgba(67,60,130,.28),transparent 55%),
             radial-gradient(ellipse 100% 60% at 50% 115%,rgba(30,25,70,.55),transparent 60%)}
header,main,footer{position:relative;z-index:2}

.eyebrow{font-size:.68rem;font-weight:600;letter-spacing:.42em;text-transform:uppercase;color:var(--nazar)}

header{display:flex;align-items:center;justify-content:space-between;padding:1.3rem clamp(1.2rem,5vw,4rem)}
.logo{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:var(--fildisi)}
.logo .goz{font-size:1.25rem;filter:drop-shadow(0 0 6px rgba(67,198,200,.6))}
.logo .ad{font-family:'Cormorant Garamond',serif;font-size:1.5rem;letter-spacing:.14em}
nav{display:flex;gap:1.6rem;align-items:center}
nav a,.nav-btn{color:var(--sis);text-decoration:none;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;background:none;border:none;cursor:pointer;font-family:inherit;transition:color .3s}
nav a:hover,.nav-btn:hover{color:var(--altin-parlak)}

.cta{display:inline-flex;align-items:center;justify-content:center;gap:.7rem;
  font-size:.78rem;font-weight:600;letter-spacing:.28em;text-transform:uppercase;
  color:var(--gece);background:linear-gradient(120deg,var(--altin),var(--altin-parlak) 55%,var(--altin));
  padding:1rem 2.3rem;border:none;border-radius:999px;cursor:pointer;text-decoration:none;font-family:'Manrope',sans-serif;
  box-shadow:0 0 0 1px rgba(240,216,154,.25),0 12px 40px -12px rgba(217,179,108,.55);
  transition:transform .35s cubic-bezier(.2,.9,.3,1.4),box-shadow .35s}
.cta:hover:not([disabled]){transform:translateY(-2px);box-shadow:0 0 0 1px rgba(240,216,154,.45),0 18px 50px -12px rgba(217,179,108,.7)}
.cta[disabled]{opacity:.45;cursor:not-allowed}
.ikincil{background:none;border:1px solid rgba(154,147,184,.4);color:var(--sis);padding:.7rem 1.7rem;border-radius:999px;
  font-family:'Manrope',sans-serif;font-size:.7rem;letter-spacing:.24em;text-transform:uppercase;cursor:pointer;transition:.3s}
.ikincil:hover{color:var(--altin-parlak);border-color:var(--altin)}

.kabuk{border-radius:calc(var(--radius) + 6px);border:1px solid rgba(217,179,108,.22);
  background:radial-gradient(ellipse 90% 70% at 50% 0%,rgba(67,60,130,.18),transparent 60%),
             linear-gradient(170deg,rgba(23,19,54,.92),rgba(13,11,32,.95));
  padding:clamp(1.5rem,4vw,2.8rem);box-shadow:0 40px 90px -40px rgba(0,0,0,.9);position:relative}
.kabuk::before{content:"";position:absolute;inset:10px;border:1px solid rgba(240,216,154,.1);border-radius:var(--radius);pointer-events:none}

.alan{display:flex;flex-direction:column;gap:.45rem;margin-bottom:1.1rem}
.alan label{font-size:.66rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--altin)}
.alan input,.alan textarea,.alan select{background:rgba(11,10,28,.7);border:1px solid rgba(154,147,184,.28);border-radius:10px;
  padding:.85rem 1rem;color:var(--fildisi);font-family:'Manrope',sans-serif;font-size:.95rem;font-weight:300;transition:border-color .3s,box-shadow .3s;color-scheme:dark}
.alan textarea{min-height:92px;resize:vertical}
.alan :is(input,textarea,select):focus{outline:none;border-color:var(--nazar);box-shadow:0 0 0 3px rgba(67,198,200,.14)}
.alan ::placeholder{color:rgba(154,147,184,.55)}
.izgara2{display:grid;grid-template-columns:1fr 1fr;gap:0 1.1rem}
@media(max-width:640px){.izgara2{grid-template-columns:1fr}}

.mesaj-kutu{padding:.85rem 1.1rem;border-radius:10px;font-size:.86rem;margin-bottom:1rem}
.mesaj-kutu.hata{background:rgba(201,138,158,.12);border:1px solid rgba(201,138,158,.4);color:var(--gul)}
.mesaj-kutu.iyi{background:rgba(67,198,200,.1);border:1px solid rgba(67,198,200,.4);color:var(--nazar)}

.okuma h2{font-size:clamp(1.5rem,3.2vw,2.1rem);color:var(--altin-parlak);margin:1.5rem 0 .7rem}
.okuma h2:first-child{margin-top:0}
.okuma h3{font-size:clamp(1.2rem,2.5vw,1.5rem);margin:1.4rem 0 .6rem}
.okuma p{margin:.75rem 0;color:#DDD6C8}
.okuma em{color:var(--sis)}
.okuma strong{color:var(--altin-parlak);font-weight:600}
.okuma ul{margin:.75rem 0 .75rem 1.2rem}
.okuma li{margin:.45rem 0;color:#DDD6C8}
.okuma hr{border:none;height:1px;margin:1.6rem auto;width:70%;background:linear-gradient(90deg,transparent,rgba(217,179,108,.5),transparent)}
.okuma blockquote{margin:1.5rem 0;padding:1.2rem 1.5rem;border-left:2px solid var(--nazar);background:rgba(67,198,200,.06);border-radius:0 10px 10px 0}
.okuma blockquote h3{margin-top:0;color:var(--nazar)}
.okuma blockquote p{color:#CFE9E9}

footer{text-align:center;color:var(--sis);font-size:.78rem;padding:2.6rem 1.2rem;border-top:1px solid rgba(217,179,108,.12)}
footer .not{max-width:62ch;margin:.8rem auto 0;font-size:.7rem;opacity:.75;line-height:1.7}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  html{scroll-behavior:auto}
}

/* ============================================================
   GEÇİŞ VE ATMOSFER KATMANI
   ============================================================ */

/* --- yavaşça akan renk perdesi (arka plan derinliği) --- */
.aurora{position:fixed;inset:-20%;z-index:0;pointer-events:none;opacity:.5;
  background:
    radial-gradient(40% 35% at 20% 25%, rgba(67,198,200,.16), transparent 60%),
    radial-gradient(45% 40% at 80% 30%, rgba(150,90,190,.16), transparent 62%),
    radial-gradient(50% 45% at 50% 85%, rgba(217,179,108,.12), transparent 60%);
  filter:blur(28px);animation:aurora 26s ease-in-out infinite alternate}
@keyframes aurora{
  0%{transform:translate3d(0,0,0) scale(1)}
  50%{transform:translate3d(-2%,2%,0) scale(1.06)}
  100%{transform:translate3d(2%,-1%,0) scale(1.02)}}

/* --- sayfa açılış sıralaması: içerik sırayla süzülür --- */
.suzul{opacity:0;transform:translateY(14px);animation:suzul .85s cubic-bezier(.2,.7,.3,1) forwards}
.suzul:nth-child(1){animation-delay:.05s}
.suzul:nth-child(2){animation-delay:.14s}
.suzul:nth-child(3){animation-delay:.23s}
.suzul:nth-child(4){animation-delay:.32s}
.suzul:nth-child(5){animation-delay:.41s}
@keyframes suzul{to{opacity:1;transform:none}}

/* --- görünüme girince beliren bölümler --- */
.gorunince{opacity:0;transform:translateY(22px);transition:opacity .9s ease,transform .9s cubic-bezier(.2,.7,.3,1)}
.gorunince.gorundu{opacity:1;transform:none}

/* --- bölümler arası yumuşak geçiş --- */
.bolum-gecis{animation:bolumGir .55s cubic-bezier(.2,.8,.25,1) both}
@keyframes bolumGir{from{opacity:0;transform:translateY(18px) scale(.985)}to{opacity:1;transform:none}}

/* --- altın parıltının kenardan geçmesi (VIP ve önemli kartlar) --- */
.parilti{position:relative;overflow:hidden}
.parilti::after{content:"";position:absolute;top:0;left:-60%;width:45%;height:100%;
  background:linear-gradient(100deg,transparent,rgba(240,216,154,.16),transparent);
  transform:skewX(-18deg);animation:parilti 6.5s ease-in-out infinite}
@keyframes parilti{0%,70%{left:-60%}100%{left:130%}}

/* --- nabız (dikkat çekmesi gereken öğeler) --- */
.nabiz{animation:nabiz 2.4s ease-in-out infinite}
@keyframes nabiz{0%,100%{box-shadow:0 0 0 0 rgba(67,198,200,.45)}
  60%{box-shadow:0 0 0 12px rgba(67,198,200,0)}}

/* --- sayı sayacı yükselirken --- */
.sayac-gecis{transition:color .4s}
.sayac-gecis.artti{color:var(--nazar)}
.sayac-gecis.azaldi{color:var(--gul)}

/* --- fal metni satır satır belirir --- */
.okuma > *{opacity:0;animation:satirBelir .7s ease forwards}
.okuma > *:nth-child(1){animation-delay:.05s}
.okuma > *:nth-child(2){animation-delay:.15s}
.okuma > *:nth-child(3){animation-delay:.25s}
.okuma > *:nth-child(4){animation-delay:.35s}
.okuma > *:nth-child(5){animation-delay:.45s}
.okuma > *:nth-child(6){animation-delay:.55s}
.okuma > *:nth-child(7){animation-delay:.65s}
.okuma > *:nth-child(8){animation-delay:.75s}
.okuma > *:nth-child(n+9){animation-delay:.85s}
@keyframes satirBelir{to{opacity:1}}

/* --- kredi rozeti --- */
.kredi-rozet{display:inline-flex;align-items:center;gap:.45rem;padding:.5rem 1rem;border-radius:999px;
  border:1px solid rgba(240,216,154,.4);background:rgba(217,179,108,.09);
  font-size:.82rem;font-weight:600;color:var(--altin-parlak);letter-spacing:.04em}
.kredi-rozet .toz{font-size:.95rem;filter:drop-shadow(0 0 6px rgba(240,216,154,.7))}
.vip-rozet{display:inline-flex;align-items:center;gap:.4rem;padding:.32rem .8rem;border-radius:999px;
  background:linear-gradient(120deg,var(--altin),var(--altin-parlak));color:var(--gece);
  font-size:.62rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase}

/* --- fotoğraf yükleme alanı --- */
.yukle{border:1.5px dashed rgba(154,147,184,.4);border-radius:14px;padding:1.8rem 1.2rem;text-align:center;
  cursor:pointer;transition:border-color .35s,background .35s;background:rgba(11,10,28,.35)}
.yukle:hover,.yukle.uzerinde{border-color:var(--nazar);background:rgba(67,198,200,.07)}
.yukle .ikon{font-size:1.8rem;display:block;margin-bottom:.6rem;opacity:.8}
.yukle .baslik{font-family:'Cormorant Garamond',serif;font-size:1.1rem;color:var(--fildisi)}
.yukle .ipucu{font-size:.74rem;color:var(--sis);margin-top:.3rem}
.onizleme{position:relative;border-radius:14px;overflow:hidden;border:1px solid rgba(240,216,154,.4);animation:bolumGir .5s ease both}
.onizleme img{width:100%;max-height:280px;object-fit:cover;display:block}
.onizleme .kaldir{position:absolute;top:.6rem;right:.6rem;background:rgba(11,10,28,.85);border:1px solid rgba(201,138,158,.5);
  color:var(--gul);border-radius:999px;padding:.4rem .9rem;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;cursor:pointer;font-family:inherit}

/* --- fal türü ızgarası --- */
.tur-izgara{display:grid;grid-template-columns:repeat(auto-fit,minmax(158px,1fr));gap:.8rem}
.tur-kart{position:relative;padding:1.3rem 1rem;border-radius:14px;cursor:pointer;text-align:left;
  border:1px solid rgba(154,147,184,.2);background:linear-gradient(165deg,rgba(30,25,70,.7),rgba(17,14,42,.85));
  color:var(--fildisi);font-family:inherit;overflow:hidden;
  transition:transform .4s cubic-bezier(.2,.8,.2,1),border-color .4s,box-shadow .4s}
.tur-kart::before{content:"";position:absolute;inset:0;opacity:0;transition:opacity .45s;
  background:radial-gradient(circle at 80% -10%,rgba(67,198,200,.16),transparent 60%)}
.tur-kart:hover{transform:translateY(-4px);border-color:rgba(240,216,154,.45)}
.tur-kart:hover::before{opacity:1}
.tur-kart.aktif{border-color:var(--nazar);box-shadow:0 0 0 1px rgba(67,198,200,.3),0 18px 40px -22px rgba(67,198,200,.5)}
.tur-kart.aktif::before{opacity:1}
.tur-kart .sim{font-size:1.5rem;display:block;margin-bottom:.5rem}
.tur-kart .ad{font-family:'Cormorant Garamond',serif;font-size:1.15rem;line-height:1.2}
.tur-kart .fiyat{margin-top:.5rem;font-size:.7rem;color:var(--altin);letter-spacing:.06em}
.tur-kart .fiyat .foto{color:var(--nazar)}

/* --- VIP paketleri --- */
.paketler{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:1rem}
.paket{padding:1.6rem 1.3rem;border-radius:16px;border:1px solid rgba(217,179,108,.25);
  background:linear-gradient(170deg,rgba(35,28,78,.75),rgba(16,13,40,.9));transition:transform .4s,border-color .4s}
.paket:hover{transform:translateY(-5px);border-color:var(--altin)}
.paket.one-cikan{border-color:var(--altin);box-shadow:0 20px 50px -28px rgba(217,179,108,.7)}
.paket .etiket{font-size:.6rem;letter-spacing:.24em;text-transform:uppercase;color:var(--nazar)}
.paket h3{font-size:1.4rem;margin:.4rem 0 .2rem}
.paket .sure{font-size:.8rem;color:var(--sis);margin-bottom:1rem}
.paket .cta,.paket .ikincil{width:100%}
.ayricalik{list-style:none;margin:1.2rem 0}
.ayricalik li{padding:.55rem 0 .55rem 1.7rem;position:relative;font-size:.87rem;color:#DDD6C8;border-bottom:1px solid rgba(154,147,184,.1)}
.ayricalik li::before{content:"✦";position:absolute;left:0;color:var(--altin)}
.iletisim-kutu{margin-top:1.4rem;padding:1.2rem 1.4rem;border-radius:12px;
  border:1px solid rgba(67,198,200,.3);background:rgba(67,198,200,.07)}
.iletisim-kutu strong{color:var(--nazar)}

/* --- hediye kutusu --- */
.hediye-kutu{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;
  padding:1.2rem 1.4rem;border-radius:14px;border:1px solid rgba(240,216,154,.3);
  background:linear-gradient(120deg,rgba(217,179,108,.1),rgba(67,198,200,.06))}
.hediye-kutu .metin{font-size:.88rem;color:#DDD6C8}
.hediye-kutu .metin b{color:var(--altin-parlak)}
.seri-nokta{display:inline-flex;gap:.28rem;margin-top:.5rem}
.seri-nokta i{width:7px;height:7px;border-radius:50%;background:rgba(154,147,184,.35);display:block}
.seri-nokta i.dolu{background:var(--altin);box-shadow:0 0 8px rgba(240,216,154,.7)}

/* --- kredi hareket listesi --- */
.hareket{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.75rem .2rem;
  border-bottom:1px solid rgba(154,147,184,.12);font-size:.85rem}
.hareket .sebep{color:#DDD6C8}
.hareket .tarih{font-size:.68rem;color:var(--sis)}
.hareket .miktar{font-weight:600;white-space:nowrap}
.hareket .miktar.arti{color:var(--nazar)}
.hareket .miktar.eksi{color:var(--gul)}

/* --- toast bildirim --- */
.toast-kap{position:fixed;left:50%;bottom:2rem;transform:translateX(-50%);z-index:90;
  display:flex;flex-direction:column;gap:.6rem;align-items:center;pointer-events:none}
.toast{padding:.85rem 1.5rem;border-radius:999px;font-size:.86rem;
  background:rgba(21,18,51,.96);border:1px solid rgba(240,216,154,.35);color:var(--fildisi);
  box-shadow:0 18px 44px -20px rgba(0,0,0,.9);animation:toastGir .45s cubic-bezier(.2,.9,.3,1.3) both}
.toast.iyi{border-color:rgba(67,198,200,.5);color:var(--nazar)}
.toast.hata{border-color:rgba(201,138,158,.5);color:var(--gul)}
.toast.giden{animation:toastCik .4s ease forwards}
@keyframes toastGir{from{opacity:0;transform:translateY(16px) scale(.95)}to{opacity:1;transform:none}}
@keyframes toastCik{to{opacity:0;transform:translateY(10px) scale(.97)}}

/* --- yükleniyor iskeleti --- */
.iskelet{background:linear-gradient(90deg,rgba(154,147,184,.08) 25%,rgba(154,147,184,.16) 50%,rgba(154,147,184,.08) 75%);
  background-size:200% 100%;animation:iskelet 1.5s infinite;border-radius:10px;height:74px}
@keyframes iskelet{0%{background-position:200% 0}100%{background-position:-200% 0}}

/* ============ ROZET SAYACI ============ */
.rozet-sayi{position:absolute;top:-7px;right:-9px;min-width:18px;height:18px;padding:0 5px;border-radius:999px;
  background:var(--gul);color:var(--gece);font-size:.6rem;font-weight:700;
  display:flex;align-items:center;justify-content:center;box-shadow:0 0 10px rgba(201,138,158,.7);
  animation:nabiz 2.4s ease-in-out infinite}

/* ============ GÖRSEL ŞÖLEN v2 ============ */

/* --- dönen zodyak çemberi (panel arka planı) --- */
.zodyak{position:fixed;top:50%;left:50%;width:min(140vh,140vw);height:min(140vh,140vw);
  transform:translate(-50%,-50%);z-index:0;pointer-events:none;opacity:.055;
  animation:zodyakDon 240s linear infinite}
@keyframes zodyakDon{to{transform:translate(-50%,-50%) rotate(360deg)}}
.zodyak circle{fill:none;stroke:var(--altin);stroke-width:.5}
.zodyak line{stroke:var(--altin);stroke-width:.35}
.zodyak text{fill:var(--altin);font-size:22px;text-anchor:middle;dominant-baseline:middle}

/* --- sis katmanı (yavaş süzülen bulutlar) --- */
.sis-katman{position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.4;
  background:
    radial-gradient(ellipse 60% 30% at 15% 70%, rgba(67,198,200,.09), transparent 70%),
    radial-gradient(ellipse 50% 25% at 85% 40%, rgba(201,138,158,.07), transparent 70%);
  animation:sisAk 40s ease-in-out infinite alternate}
@keyframes sisAk{0%{transform:translateX(-3%) translateY(0)}100%{transform:translateX(3%) translateY(-2%)}}

/* --- kabuk üzerinde ince ışık halkası --- */
.kabuk{transition:border-color .6s,box-shadow .6s}
.kabuk:hover{border-color:rgba(240,216,154,.35)}

/* --- fal türü kartında yükselen ışık --- */
.tur-kart::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;
  background:linear-gradient(90deg,transparent,var(--nazar),transparent);
  transform:scaleX(0);transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.tur-kart.aktif::after,.tur-kart:hover::after{transform:scaleX(1)}

/* --- okuma başlıklarında altın çizgi --- */
.okuma h2{position:relative;padding-bottom:.35rem}
.okuma h2::after{content:"";position:absolute;left:0;bottom:0;width:52px;height:1px;
  background:linear-gradient(90deg,var(--altin),transparent);
  animation:cizgiUza 1.2s cubic-bezier(.2,.8,.2,1) both;animation-delay:.5s}
@keyframes cizgiUza{from{width:0;opacity:0}to{width:52px;opacity:1}}

/* --- tılsım blockquote'ta nefes alan kenar --- */
.okuma blockquote{position:relative;overflow:hidden}
.okuma blockquote::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;
  background:linear-gradient(180deg,transparent,var(--nazar),transparent);
  animation:kenarNefes 3.5s ease-in-out infinite}
@keyframes kenarNefes{0%,100%{opacity:.35}50%{opacity:1}}

/* --- kredi rozetinde toz parıltısı --- */
.kredi-rozet .toz{animation:tozDon 4s ease-in-out infinite}
@keyframes tozDon{0%,100%{transform:rotate(0) scale(1)}50%{transform:rotate(180deg) scale(1.2)}}

/* --- hediye kutusunda akan ışık --- */
.hediye-kutu{position:relative;overflow:hidden}
.hediye-kutu::after{content:"";position:absolute;top:0;left:-50%;width:40%;height:100%;
  background:linear-gradient(100deg,transparent,rgba(240,216,154,.12),transparent);
  transform:skewX(-20deg);animation:parilti 5s ease-in-out infinite}

/* --- pul kartlarında üstten ışık --- */
.pul{position:relative;overflow:hidden}
.pul::before{content:"";position:absolute;top:0;left:20%;right:20%;height:1px;
  background:linear-gradient(90deg,transparent,rgba(240,216,154,.5),transparent);opacity:0;transition:opacity .5s}
.pul:hover::before{opacity:1}

/* --- tarot kartı seçilince altın halka --- */
.tkart.secili::before{content:"";position:absolute;inset:-6px;border-radius:14px;
  border:1px solid rgba(240,216,154,.5);animation:halkaBelir .6s ease both;pointer-events:none}
@keyframes halkaBelir{from{opacity:0;transform:scale(.9)}to{opacity:1;transform:none}}

/* --- bekleme sırasında dönen yıldız izi --- */
.goz-halka::before{animation:halka 2.4s ease-out infinite,dondur 8s linear infinite}
@keyframes dondur{to{transform:rotate(360deg)}}

/* --- düğmelerde basılma geri bildirimi --- */
.cta:active:not([disabled]),.ikincil:active,.mini-btn:active{transform:scale(.97)}

/* --- talep listesi öğelerinde sol kenar vurgusu --- */
.gecmis-oge{position:relative;overflow:hidden}
.gecmis-oge::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;
  background:var(--nazar);transform:scaleY(0);transition:transform .35s}
.gecmis-oge:hover::before{transform:scaleY(1)}

@media (prefers-reduced-motion: reduce){
  .zodyak,.sis-katman,.aurora{animation:none}
}
