/* =========================================================
   Vegas girişi (partials/vegas-intro.php, js/intro.js): siteye girişte tam ekran karşılama.
   Işıklı tabela (yürüyen ampuller, neon yazı, yaldızlı marka), tarayan projektörler; altın külçe yağmuru,
   jetonlar ve yaldız tozu js/intro.js'in iki tuvalinde çizilir (arka: yığılan külçeler, ön: kafamıza düşenler).
   <html class="vx-intro"> yoksa hiç görünmez; intro.js gelmezse perde 5 sn sonra kendiliğinden kalkar (emniyet).
   ========================================================= */

.vxi { display: none; }
.vx-intro .vxi {
    position: fixed; inset: 0; z-index: 10000;
    display: grid; place-items: center; overflow: hidden; isolation: isolate;
    touch-action: none; overscroll-behavior: none;   /* telefonda arkadaki sayfa kaymasın */
    color: #fff; font-family: Oxanium, system-ui, sans-serif; text-align: center;
    background:
        radial-gradient(55% 45% at 50% 40%, rgba(246,210,122,.22), transparent 70%),
        radial-gradient(90% 35% at 50% 100%, rgba(224,172,64,.38), transparent 70%),
        radial-gradient(140% 110% at 50% 35%, #12336e 0%, #081a3e 45%, #02060f 100%);
    animation: vxi-failsafe .4s 5s forwards;
}
.vx-intro .vxi.is-live { animation: none; }
html.vx-lock, html.vx-lock body { overflow: hidden; }

/* ---------- Salon: bokeh ışıkları ve gökyüzünü tarayan projektörler ---------- */

.vxi__bokeh {
    position: absolute; inset: -8%; z-index: 0; pointer-events: none;
    background:
        radial-gradient(circle at 12% 22%, rgba(255,210,122,.30), rgba(255,210,122,.18) 1.8vmax, transparent 2.6vmax),
        radial-gradient(circle at 84% 18%, rgba(255,80,130,.24), rgba(255,80,130,.12) 1.3vmax, transparent 2vmax),
        radial-gradient(circle at 70% 64%, rgba(255,210,122,.20), rgba(255,210,122,.10) 2.4vmax, transparent 3.3vmax),
        radial-gradient(circle at 24% 70%, rgba(80,150,255,.20), rgba(80,150,255,.10) 1.5vmax, transparent 2.2vmax),
        radial-gradient(circle at 46% 10%, rgba(255,240,200,.20), rgba(255,240,200,.10) 1vmax, transparent 1.5vmax),
        radial-gradient(circle at 93% 80%, rgba(255,190,90,.26), rgba(255,190,90,.14) 1.7vmax, transparent 2.4vmax),
        radial-gradient(circle at 5% 90%, rgba(255,80,130,.20), rgba(255,80,130,.10) 2vmax, transparent 2.9vmax),
        radial-gradient(circle at 34% 40%, rgba(255,220,150,.12), rgba(255,220,150,.06) 3.4vmax, transparent 4.6vmax);
    animation: vxi-bokeh 9s ease-in-out infinite alternate;
}
.vxi__beams { position: absolute; inset: 0; z-index: 0; pointer-events: none; animation: vxi-fade 1.4s ease-out both; }
.vxi__beams i {
    position: absolute; bottom: -6vh; left: var(--x); width: 70vmax; height: 130vh; margin-left: -35vmax;
    transform-origin: 50% 100%;
    background: conic-gradient(from -7deg at 50% 100%, transparent, rgba(255,236,180,.42) 7deg, transparent 14deg);
    -webkit-mask: linear-gradient(to top, #000, rgba(0,0,0,.55) 40%, transparent 92%);
            mask: linear-gradient(to top, #000, rgba(0,0,0,.55) 40%, transparent 92%);
    mix-blend-mode: screen;
    animation: vxi-sweep var(--t) ease-in-out var(--d) infinite alternate;
}
.vxi__beams i:nth-child(1) { --x: 6%;  --a: 10deg;  --b: 40deg;  --t: 5.5s; --d: 0s; }
.vxi__beams i:nth-child(2) { --x: 30%; --a: -24deg; --b: 12deg;  --t: 7s;   --d: -2s; }
.vxi__beams i:nth-child(3) { --x: 70%; --a: 24deg;  --b: -12deg; --t: 6.2s; --d: -1s; }
.vxi__beams i:nth-child(4) { --x: 94%; --a: -10deg; --b: -40deg; --t: 5s;   --d: -3s; }

.vxi__fx { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.vxi__fx--back { z-index: 1; }
.vxi__fx--front { z-index: 3; }

/* ---------- Işıklı tabela ---------- */

.vxi__stage {
    position: relative; z-index: 2;
    display: grid; justify-items: center; gap: clamp(16px, 3vh, 28px);
    width: min(100%, 760px); padding: 0 16px; margin-top: -5vh;   /* dipte külçe yığınına yer kalsın */
}
.vxi__sign {
    position: relative; width: 100%;
    padding: clamp(40px, 7vh, 64px) clamp(30px, 6vw, 70px) clamp(30px, 5vh, 46px);
    border: 4px solid transparent; border-radius: 30px;
    background:
        radial-gradient(120% 85% at 50% 0%, rgba(40,100,200,.55), transparent 60%) padding-box,
        linear-gradient(180deg, #0c2556, #061230 70%, #040a1c) padding-box,
        linear-gradient(135deg, #7a5212, #ffe7a8 22%, #b8892f 45%, #fff3c8 62%, #c8952f 80%, #7a5212) border-box;
    box-shadow:
        0 0 0 2px rgba(0,0,0,.55),
        0 0 36px rgba(246,210,122,.5), 0 0 110px rgba(224,172,64,.28),
        0 40px 80px rgba(0,0,0,.6),
        inset 0 0 50px rgba(0,0,0,.65);
    animation: vxi-sign-in 1s cubic-bezier(.2, 1.3, .35, 1) .3s both;
}

/* Yürüyen ampuller: çerçeve şeridine maskelenmiş nokta deseni; içinde dönen ışık, yandığı ampulleri parlatır */
.vxi__lights {
    position: absolute; inset: 7px; border-radius: 22px; pointer-events: none;
    filter: drop-shadow(0 0 3px rgba(255,214,120,.9)) drop-shadow(0 0 9px rgba(255,180,60,.55));
}
.vxi__bulbs {
    --bulb: 17px;
    position: absolute; inset: 0; overflow: hidden; border-radius: inherit; padding: calc(var(--bulb) - 1px);
    background: rgba(196,146,58,.5);   /* sönük ampul */
    -webkit-mask: radial-gradient(circle, #000 0 calc(var(--bulb) * .2), transparent calc(var(--bulb) * .26)) 0 0 / var(--bulb) var(--bulb) round,
                  linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite: source-in, xor;
            mask: radial-gradient(circle, #000 0 calc(var(--bulb) * .2), transparent calc(var(--bulb) * .26)) 0 0 / var(--bulb) var(--bulb) round,
                  linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
            mask-composite: intersect, exclude;
}
.vxi__bulbs i {
    position: absolute; left: 50%; top: 50%; width: 170%; aspect-ratio: 1; translate: -50% -50%;
    background: repeating-conic-gradient(rgba(255,250,225,0) 0 22%, #fffbe8 38%, #ffe08a 44%, rgba(255,250,225,0) 50%);
    animation: vxi-spin 2.6s linear infinite;
}

.vxi__star {
    position: absolute; left: 50%; top: 0; width: clamp(54px, 8vw, 78px); height: auto; aspect-ratio: 1;
    translate: -50% -58%;
    filter: drop-shadow(0 0 6px #ffd27a) drop-shadow(0 0 18px rgba(255,200,90,.8));
    animation: vxi-star-in .8s cubic-bezier(.2, 1.6, .4, 1) 1s both, vxi-star 4s ease-in-out 1.8s infinite;
}

.vxi__welcome {
    margin: 0 0 6px;
    font: 400 clamp(26px, min(4.6vw, 6vh), 44px)/1.2 Pacifico, "Brush Script MT", cursive;
    color: #fff0f4;
    text-shadow: 0 0 2px #fff, 0 0 8px #ff4f86, 0 0 18px #ff2a6d, 0 0 36px #ff2a6d, 0 0 60px rgba(255,42,109,.6);
    animation: vxi-neon 1.6s steps(1) .9s both, vxi-buzz 7s steps(1) 3s infinite;
}

.vxi__brand {
    position: relative; margin: 0;
    display: grid; justify-items: center;
    font-family: Cinzel, "Times New Roman", serif; font-weight: 900; line-height: 1.05;
}
.vxi__gold {
    padding: 0 .06em;
    font-size: clamp(54px, min(13vw, 15vh), 128px); letter-spacing: .04em;
    background:
        linear-gradient(105deg, transparent 38%, rgba(255,255,255,.95) 48%, transparent 58%) 110% 0 / 250% 100% no-repeat,
        linear-gradient(180deg, #fffaf0 0%, #ffe9a6 22%, #f6c654 46%, #a8741d 50%, #e2ae45 64%, #fff1bd 92%, #ffe08a 100%);
    -webkit-background-clip: text; background-clip: text;
    color: transparent; -webkit-text-fill-color: transparent;
    filter: drop-shadow(0 1px 0 #fff3c8) drop-shadow(0 3px 0 #7a5212) drop-shadow(0 6px 0 #3b2606) drop-shadow(0 0 22px rgba(246,210,122,.55));
    animation: vxi-shine 3.6s ease-in-out 1.6s infinite;
}
.vxi__rest {
    margin-top: .15em; padding-left: .5em;   /* son harfin harf aralığı ortalamayı kaydırmasın */
    font-size: clamp(20px, min(4.2vw, 5vh), 40px); letter-spacing: .5em;
    background: linear-gradient(180deg, #fff 0%, #dfe6f2 45%, #8f9bb0 52%, #f4f7fb 100%);
    -webkit-background-clip: text; background-clip: text;
    color: transparent; -webkit-text-fill-color: transparent;
    filter: drop-shadow(0 2px 0 #2a3550) drop-shadow(0 0 12px rgba(200,220,255,.35));
}
/* Marka üstünde çakan yıldızlar */
.vxi__brand::before, .vxi__brand::after {
    content: ""; position: absolute; width: 34px; height: 34px; pointer-events: none; scale: 0;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 0C12.8 8 16 11.2 24 12C16 12.8 12.8 16 12 24C11.2 16 8 12.8 0 12C8 11.2 11.2 8 12 0Z' fill='%23fffbe8'/%3E%3C/svg%3E") center / contain no-repeat;
    filter: drop-shadow(0 0 6px #fff2c4) drop-shadow(0 0 12px #ffd27a);
    animation: vxi-twinkle 2.4s ease-in-out infinite;
}
.vxi__brand::before { left: 4%; top: 0; animation-delay: 1.8s; }
.vxi__brand::after { right: 5%; top: 42%; width: 24px; height: 24px; animation-delay: 3s; }

.vxi__tag {
    display: flex; align-items: center; justify-content: center; gap: 12px;
    margin: clamp(12px, 2.4vh, 22px) 0 0;
    font: 700 clamp(11px, 1.6vw, 15px)/1 Oxanium, system-ui, sans-serif; letter-spacing: .28em; color: #ffe7a8;
    animation: vxi-up .7s ease-out 1.3s both;
}
.vxi__tag span { padding-left: .28em; }
.vxi__tag b { font-size: 1.5em; letter-spacing: 0; color: #f6d27a; text-shadow: 0 0 10px rgba(246,210,122,.8); }
.vxi__tag b.is-red { color: #ff3b6b; text-shadow: 0 0 10px rgba(255,59,107,.8); }
.vxi__tag::before, .vxi__tag::after { content: ""; flex: 0 1 60px; height: 1px; background: linear-gradient(90deg, transparent, #f6d27a); }
.vxi__tag::after { scale: -1 1; }

/* ---------- Giriş düğmesi ---------- */

.vxi__enter {
    position: relative; overflow: hidden; isolation: isolate;
    margin-top: 4px; padding: 19px clamp(34px, 6vw, 56px);
    border: 0; border-radius: 999px; cursor: pointer;
    font: 800 clamp(16px, 2.2vw, 20px)/1 Oxanium, system-ui, sans-serif; letter-spacing: .14em; color: #2b1900;
    background: linear-gradient(180deg, #fff6d0 0%, #ffd873 32%, #e8b347 58%, #b47d24 100%);
    box-shadow:
        0 0 0 2px #6b470e, 0 0 0 6px rgba(255,214,120,.25),
        inset 0 2px 0 rgba(255,255,255,.85), inset 0 -4px 0 rgba(90,55,5,.35),
        0 12px 30px rgba(0,0,0,.55), 0 0 44px rgba(246,210,122,.55);
    text-shadow: 0 1px 0 rgba(255,245,210,.7);
    -webkit-tap-highlight-color: transparent;
    animation: vxi-pop .7s cubic-bezier(.2, 1.6, .4, 1) 1.6s both, vxi-pulse 1.8s ease-in-out 2.4s infinite;
}
.vxi__enter::after {   /* üstünden geçen ışık */
    content: ""; position: absolute; inset: 0; z-index: -1;
    background: linear-gradient(105deg, transparent 35%, rgba(255,255,255,.75) 50%, transparent 65%);
    translate: -120% 0;
    animation: vxi-btn-sweep 2.8s ease-in-out 2.2s infinite;
}
.vxi__enter:hover { filter: brightness(1.08); }
.vxi__enter:active { translate: 0 2px; }
.vxi__enter:focus-visible { outline: 3px solid #fff3c8; outline-offset: 5px; }

.vxi__age {
    margin: 0;
    font: 600 12px/1.4 Oxanium, system-ui, sans-serif; letter-spacing: .06em;
    color: rgba(255,240,205,.72); text-shadow: 0 1px 4px #000;
    animation: vxi-up .6s ease-out 2s both;
}
.vxi__skip {
    position: absolute; z-index: 5;
    top: max(14px, env(safe-area-inset-top)); right: max(14px, env(safe-area-inset-right));
    padding: 8px 14px; border: 1px solid rgba(246,210,122,.4); border-radius: 999px;
    background: rgba(4,10,28,.55); color: rgba(255,240,205,.85);
    font: 600 13px/1 Oxanium, system-ui, sans-serif; letter-spacing: .06em;
    -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
    animation: vxi-fade .5s ease-out .8s both;
}
.vxi__skip:hover { color: #fff; border-color: #f6d27a; }

/* ---------- Perde kalkarken: altın parlama, tabela öne atılır, salon kararır ---------- */

.vxi::after {
    content: ""; position: absolute; inset: 0; z-index: 4; pointer-events: none; opacity: 0;
    background: radial-gradient(circle at 50% 55%, rgba(255,250,230,.95), rgba(246,210,122,.55) 30%, transparent 65%);
}
.vx-intro .vxi.is-leaving { pointer-events: none; animation: vxi-out .8s ease-in .25s forwards; }
.vxi.is-leaving::after { animation: vxi-flash .8s ease-out forwards; }
.vxi.is-leaving .vxi__stage { animation: vxi-zoom .65s cubic-bezier(.55, 0, .75, .2) forwards; }

/* ---------- Telefon ---------- */

@media (max-width: 560px) {
    .vxi__sign { border-radius: 24px; padding-left: 22px; padding-right: 22px; }
    .vxi__lights { inset: 6px; border-radius: 18px; }
    .vxi__bulbs { --bulb: 14px; }
    .vxi__tag { gap: 8px; letter-spacing: .16em; }
    .vxi__tag span { padding-left: .16em; }
    .vxi__tag::before, .vxi__tag::after { display: none; }
    .vxi__rest { letter-spacing: .36em; padding-left: .36em; }
}

@media (prefers-reduced-motion: reduce) {
    .vxi *, .vxi *::before, .vxi *::after { animation-duration: .01ms !important; animation-delay: 0s !important; animation-iteration-count: 1 !important; }
}

@keyframes vxi-failsafe { to { opacity: 0; visibility: hidden; } }
@keyframes vxi-fade { from { opacity: 0; } }
@keyframes vxi-up { from { opacity: 0; translate: 0 12px; } }
@keyframes vxi-bokeh { from { transform: scale(1); opacity: .7; } to { transform: scale(1.08) translate(-1.5%, 1%); opacity: 1; } }
@keyframes vxi-sweep { from { transform: rotate(var(--a)); } to { transform: rotate(var(--b)); } }
@keyframes vxi-sign-in {
    from { opacity: 0; transform: perspective(800px) translateY(-40px) scale(.55) rotateX(40deg); }
    70% { opacity: 1; }
    to { opacity: 1; transform: perspective(800px) translateY(0) scale(1) rotateX(0); }
}
@keyframes vxi-spin { to { rotate: 1turn; } }
@keyframes vxi-star-in { from { opacity: 0; scale: 0; rotate: -180deg; } to { opacity: 1; scale: 1; rotate: 0deg; } }
@keyframes vxi-star { 50% { scale: 1.12; rotate: 22.5deg; } }
@keyframes vxi-neon {   /* neon tüp yanarken titrer */
    0% { opacity: .07; } 6% { opacity: 1; } 9% { opacity: .12; } 14% { opacity: 1; } 18% { opacity: .25; } 22%, 100% { opacity: 1; }
}
@keyframes vxi-buzz { 0%, 93%, 95.5%, 100% { opacity: 1; } 92% { opacity: .55; } 94.5% { opacity: .75; } }
@keyframes vxi-shine { 0% { background-position: 110% 0, 0 0; } 45%, 100% { background-position: -20% 0, 0 0; } }
@keyframes vxi-twinkle { 0%, 60%, 100% { scale: 0; rotate: 0deg; } 30% { scale: 1; rotate: 90deg; } }
@keyframes vxi-pop { from { opacity: 0; scale: .3; } to { opacity: 1; scale: 1; } }
@keyframes vxi-pulse {
    50% {
        box-shadow:
            0 0 0 2px #6b470e, 0 0 0 10px rgba(255,214,120,.12),
            inset 0 2px 0 rgba(255,255,255,.85), inset 0 -4px 0 rgba(90,55,5,.35),
            0 12px 30px rgba(0,0,0,.55), 0 0 74px rgba(246,210,122,.9);
    }
}
@keyframes vxi-btn-sweep { 0% { translate: -120% 0; } 40%, 100% { translate: 120% 0; } }
@keyframes vxi-out { to { opacity: 0; visibility: hidden; } }
@keyframes vxi-flash { 0% { opacity: 0; scale: .4; } 25% { opacity: 1; } 100% { opacity: 0; scale: 1.8; } }
@keyframes vxi-zoom { to { opacity: 0; scale: 1.3; filter: blur(6px); } }
