/*
 * NEXUS V3 — cinematic interface layer
 * Ortak PHP yapısını bozmadan bütün ürüne uygulanan görsel sistem.
 */
:root{
  --nx-ink:#02040a;
  --nx-panel:rgba(8,13,26,.82);
  --nx-panel-strong:#090f1e;
  --nx-line:rgba(148,163,184,.14);
  --nx-line-hot:rgba(56,189,248,.42);
  --nx-cyan:#38bdf8;
  --nx-blue:#2563eb;
  --nx-violet:#8b5cf6;
  --nx-pink:#ec4899;
  --nx-orange:#fb923c;
  --nx-green:#34d399;
  --nx-ease:cubic-bezier(.22,1,.36,1);
  --nx-shadow:0 30px 80px -42px rgba(0,0,0,.95);
  --mx:50vw;
  --my:18vh;
}

html{scroll-behavior:smooth;background:var(--nx-ink)}
body{
  background:
    radial-gradient(900px circle at var(--mx) var(--my),rgba(37,99,235,.075),transparent 42%),
    linear-gradient(145deg,#02040a 0%,#040817 42%,#02040a 100%);
  min-height:100vh;
}
body::before{
  content:"";position:fixed;inset:0;z-index:-3;pointer-events:none;opacity:.22;
  background-image:
    linear-gradient(rgba(148,163,184,.055) 1px,transparent 1px),
    linear-gradient(90deg,rgba(148,163,184,.055) 1px,transparent 1px);
  background-size:64px 64px;
  -webkit-mask-image:linear-gradient(to bottom,black,transparent 88%);
  mask-image:linear-gradient(to bottom,black,transparent 88%);
}
.nx-ambient{position:fixed;inset:0;overflow:hidden;z-index:-2;pointer-events:none}
.nx-ambient i{position:absolute;border-radius:999px;filter:blur(90px);opacity:.13;will-change:transform}
.nx-ambient i:nth-child(1){width:38vw;height:38vw;left:-12vw;top:-18vw;background:#2563eb;animation:nxDriftA 18s ease-in-out infinite}
.nx-ambient i:nth-child(2){width:34vw;height:34vw;right:-13vw;top:26%;background:#8b5cf6;animation:nxDriftB 22s ease-in-out infinite}
.nx-ambient i:nth-child(3){width:28vw;height:28vw;left:38%;bottom:-18vw;background:#f97316;animation:nxDriftA 26s ease-in-out infinite reverse}
@keyframes nxDriftA{50%{transform:translate3d(7vw,6vh,0) scale(1.14)}}
@keyframes nxDriftB{50%{transform:translate3d(-8vw,-7vh,0) scale(.88)}}

#nxScrollProgress{
  position:fixed;left:0;top:0;height:2px;width:0;z-index:9999;pointer-events:none;
  background:linear-gradient(90deg,var(--nx-cyan),var(--nx-violet),var(--nx-orange));
  box-shadow:0 0 18px rgba(56,189,248,.9);
}

/* Glass surfaces */
.bg-card,.glass-card,.game-card,.act-card,.aktif-panel{
  background:
    linear-gradient(145deg,rgba(18,27,49,.88),rgba(7,12,24,.92)) padding-box,
    linear-gradient(135deg,rgba(255,255,255,.12),rgba(56,189,248,.08),rgba(255,255,255,.025)) border-box!important;
  border:1px solid transparent!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035),var(--nx-shadow);
  backdrop-filter:blur(20px);
}
.bg-card:hover,.glass-card:hover{
  border-color:transparent!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 30px 80px -40px rgba(14,165,233,.42);
}

aside#mainSidebar{
  background:linear-gradient(180deg,rgba(6,10,21,.96),rgba(5,9,18,.92))!important;
  border-right-color:rgba(148,163,184,.1)!important;
  box-shadow:18px 0 60px -42px #000!important;
  backdrop-filter:blur(24px);
}
aside#mainSidebar>a:first-child{position:relative;overflow:hidden}
aside#mainSidebar>a:first-child::after{
  content:"";position:absolute;left:12%;right:12%;bottom:-1px;height:1px;
  background:linear-gradient(90deg,transparent,var(--nx-cyan),transparent);
  box-shadow:0 0 14px var(--nx-cyan);
}
.nav-link{border:1px solid transparent;isolation:isolate;overflow:hidden}
.nav-link::after{
  content:"";position:absolute;inset:0;z-index:-1;opacity:0;
  background:linear-gradient(90deg,rgba(56,189,248,.12),rgba(139,92,246,.055),transparent);
  transition:opacity .25s ease;
}
.nav-link:hover::after,.nav-link.active::after{opacity:1}
.nav-link:hover{border-color:rgba(56,189,248,.12);transform:translateX(3px)}
.nav-link.active{
  background:rgba(56,189,248,.065)!important;
  border-color:rgba(56,189,248,.2)!important;
  box-shadow:inset 0 0 28px rgba(56,189,248,.055),0 10px 34px -26px rgba(56,189,248,.9)!important;
}
.nav-link>div>i:first-child{filter:drop-shadow(0 0 8px currentColor);transition:transform .3s var(--nx-ease)}
.nav-link:hover>div>i:first-child{transform:scale(1.12) rotate(-4deg)}

header.hidden.lg\:flex{
  background:rgba(4,8,17,.72)!important;
  border-bottom-color:rgba(148,163,184,.1)!important;
  backdrop-filter:blur(22px) saturate(130%);
}
main{position:relative}
main::before{
  content:"";position:fixed;left:260px;right:0;top:64px;height:1px;z-index:1;pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(56,189,248,.28),rgba(139,92,246,.14),transparent);
}

/* Buttons and interactive controls */
.btn-primary,.btn-secondary,.btn-success,.btn-c,.btn-o,.btn-cyan,.btn-orange,.cmp-btn,.act-btn{
  position:relative;overflow:hidden;isolation:isolate;
}
.btn-primary::before,.btn-secondary::before,.btn-success::before,.btn-c::before,.btn-o::before,.btn-cyan::before,.btn-orange::before,.cmp-btn::before,.act-btn::before{
  content:"";position:absolute;top:-100%;bottom:-100%;left:-45%;width:28%;z-index:-1;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.42),transparent);
  transform:rotate(20deg);transition:left .65s var(--nx-ease);
}
.btn-primary:hover::before,.btn-secondary:hover::before,.btn-success:hover::before,.btn-c:hover::before,.btn-o:hover::before,.btn-cyan:hover::before,.btn-orange:hover::before,.cmp-btn:hover::before,.act-btn:hover::before{left:120%}
button,a{-webkit-tap-highlight-color:transparent}

/* Route and component reveal */
.nx-reveal{
  opacity:0;transform:translateY(22px) scale(.985);
  transition:opacity .72s var(--nx-ease),transform .72s var(--nx-ease);
  transition-delay:var(--nx-delay,0ms);
}
.nx-reveal.nx-seen{opacity:1;transform:none}

/* Home hero */
.nx-hero{
  --hero-x:72%;
  position:relative;min-height:360px;margin-bottom:1.35rem;padding:clamp(1.5rem,4vw,3.6rem);
  border:1px solid rgba(148,163,184,.13);border-radius:2rem;overflow:hidden;isolation:isolate;
  background:
    radial-gradient(720px circle at var(--hero-x) 42%,rgba(37,99,235,.2),transparent 50%),
    linear-gradient(125deg,rgba(13,21,40,.97),rgba(4,8,17,.95) 56%,rgba(9,7,24,.96));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 40px 100px -54px rgba(37,99,235,.75);
}
.nx-hero::before{
  content:"";position:absolute;inset:-50%;z-index:-2;
  background:conic-gradient(from 115deg at 68% 50%,transparent 0 65%,rgba(56,189,248,.14) 72%,transparent 80%);
  animation:nxHeroSweep 12s linear infinite;
}
.nx-hero::after{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.34;
  background-image:radial-gradient(circle,rgba(255,255,255,.38) 1px,transparent 1.2px);
  background-size:29px 29px;
  -webkit-mask-image:linear-gradient(90deg,transparent 35%,black);
  mask-image:linear-gradient(90deg,transparent 35%,black);
}
@keyframes nxHeroSweep{to{transform:rotate(360deg)}}
.nx-hero-copy{position:relative;z-index:3;max-width:720px}
.nx-kicker{
  display:inline-flex;align-items:center;gap:.55rem;padding:.42rem .75rem;border-radius:999px;
  border:1px solid rgba(52,211,153,.24);background:rgba(16,185,129,.075);
  color:#6ee7b7;font-size:.62rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
}
.nx-kicker-dot{width:.42rem;height:.42rem;border-radius:50%;background:#34d399;box-shadow:0 0 0 5px rgba(52,211,153,.09),0 0 12px #34d399;animation:nxLive 1.8s ease-in-out infinite}
@keyframes nxLive{50%{opacity:.38;transform:scale(.75)}}
.nx-hero-title{
  margin-top:1.2rem;color:#fff;font-family:var(--font-display);font-weight:800;
  font-size:clamp(2.15rem,5.1vw,4.9rem);line-height:.96;letter-spacing:-.055em;max-width:780px;
}
.nx-hero-title span{
  display:block;background:linear-gradient(90deg,#fff 0%,#7dd3fc 30%,#a78bfa 63%,#fb923c 100%);
  background-size:180% auto;-webkit-background-clip:text;background-clip:text;color:transparent;
  animation:nxHeroText 7s ease-in-out infinite alternate;
}
@keyframes nxHeroText{to{background-position:100% center}}
.nx-hero-desc{max-width:610px;margin-top:1.05rem;color:#a9b7cd;font-size:clamp(.82rem,1.4vw,1rem);line-height:1.75;font-weight:550}
.nx-hero-actions{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap;margin-top:1.45rem}
.nx-hero-cta{
  display:inline-flex;align-items:center;justify-content:center;gap:.6rem;min-height:3rem;padding:0 1.15rem;
  border-radius:.9rem;font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;transition:.28s var(--nx-ease);
}
.nx-hero-cta:hover{transform:translateY(-3px)}
.nx-hero-cta.primary{color:#03101a;background:linear-gradient(135deg,#7dd3fc,#38bdf8 55%,#2563eb);box-shadow:0 14px 35px -14px rgba(56,189,248,.9)}
.nx-hero-cta.secondary{color:#e2e8f0;background:rgba(255,255,255,.045);border:1px solid rgba(148,163,184,.2)}
.nx-hero-cta.secondary:hover{border-color:rgba(167,139,250,.48);background:rgba(139,92,246,.09)}
.nx-hero-stats{display:flex;gap:1.8rem;flex-wrap:wrap;margin-top:2rem}
.nx-hero-stat{position:relative;padding-left:.8rem}
.nx-hero-stat::before{content:"";position:absolute;left:0;top:.18rem;bottom:.18rem;width:2px;border-radius:2px;background:linear-gradient(var(--nx-cyan),var(--nx-violet))}
.nx-hero-stat b{display:block;color:#fff;font:800 1.05rem/1 var(--font-display);font-variant-numeric:tabular-nums}
.nx-hero-stat span{display:block;color:#66758d;font-size:.52rem;font-weight:800;text-transform:uppercase;letter-spacing:.12em;margin-top:.35rem}
.nx-hero-visual{position:absolute;right:clamp(-70px,2vw,30px);top:50%;width:390px;height:390px;transform:translateY(-50%);z-index:1}
.nx-orbit{position:absolute;inset:0;border:1px solid rgba(56,189,248,.15);border-radius:50%;animation:nxOrbit 22s linear infinite}
.nx-orbit.o2{inset:55px;border-color:rgba(167,139,250,.17);animation-duration:16s;animation-direction:reverse}
.nx-orbit.o3{inset:116px;border-color:rgba(251,146,60,.2);animation-duration:10s}
.nx-orbit::before{content:"";position:absolute;left:50%;top:-4px;width:8px;height:8px;border-radius:50%;background:#38bdf8;box-shadow:0 0 18px #38bdf8}
.nx-orbit.o2::before{background:#a78bfa;box-shadow:0 0 18px #a78bfa}
.nx-orbit.o3::before{background:#fb923c;box-shadow:0 0 18px #fb923c}
@keyframes nxOrbit{to{transform:rotate(360deg)}}
.nx-core{
  position:absolute;left:50%;top:50%;width:110px;height:110px;transform:translate(-50%,-50%);
  display:grid;place-items:center;border-radius:31px;background:linear-gradient(145deg,rgba(18,31,59,.95),rgba(5,9,19,.98));
  border:1px solid rgba(125,211,252,.32);box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 0 70px rgba(37,99,235,.34);
}
.nx-core::before{content:"";position:absolute;inset:-9px;border-radius:38px;border:1px solid rgba(167,139,250,.13);animation:nxCorePulse 2.8s ease-in-out infinite}
@keyframes nxCorePulse{50%{transform:scale(1.07);opacity:.45}}
.nx-core img{width:72px;height:72px;object-fit:contain;border-radius:22px;filter:drop-shadow(0 0 16px rgba(56,189,248,.45))}
.nx-float-chip{
  position:absolute;display:flex;align-items:center;gap:.5rem;padding:.55rem .72rem;border-radius:.78rem;
  background:rgba(5,9,19,.76);border:1px solid rgba(148,163,184,.16);backdrop-filter:blur(14px);
  color:#cbd5e1;font-size:.58rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;
  box-shadow:0 14px 35px -18px #000;animation:nxFloatChip 4s ease-in-out infinite;
}
.nx-float-chip i{font-size:.8rem;filter:drop-shadow(0 0 7px currentColor)}
.nx-float-chip.c1{left:5px;top:78px;color:#7dd3fc}
.nx-float-chip.c2{right:-2px;top:155px;color:#c4b5fd;animation-delay:-1.2s}
.nx-float-chip.c3{left:28px;bottom:62px;color:#6ee7b7;animation-delay:-2.4s}
@keyframes nxFloatChip{50%{transform:translateY(-8px)}}

/* Homepage polish */
.act-card{position:relative;overflow:hidden}
.act-card::after{content:"";position:absolute;width:110px;height:110px;right:-60px;top:-60px;border-radius:50%;background:var(--ac-glow,rgba(56,189,248,.15));filter:blur(22px);transition:.4s var(--nx-ease)}
.act-card:hover::after{transform:scale(1.5);opacity:.9}
.act-card.ac-amber{--ac-glow:rgba(251,191,36,.2)}
.act-card.ac-orange{--ac-glow:rgba(249,115,22,.2)}
.act-card.ac-green{--ac-glow:rgba(16,185,129,.2)}
.game-card,.og-card{transform-style:preserve-3d;will-change:transform}
.game-card::after,.og-card::after{
  content:"";position:absolute;inset:0;z-index:8;pointer-events:none;opacity:0;
  background:radial-gradient(400px circle at var(--card-x,50%) var(--card-y,20%),rgba(255,255,255,.16),transparent 42%);
  transition:opacity .25s;
}
.game-card:hover::after,.og-card:hover::after{opacity:1}
.sl-container{box-shadow:0 34px 90px -48px rgba(37,99,235,.7)!important}
.sl-slide::after{content:"";position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 80px rgba(0,0,0,.35)}
.story-ring,.rgb-ring{filter:drop-shadow(0 8px 14px rgba(0,0,0,.45))}

/* Mobile dock */
.mob-nav{
  left:50%!important;right:auto!important;bottom:10px!important;width:calc(100% - 20px);transform:translateX(-50%);
  background:rgba(5,9,18,.88)!important;border:1px solid rgba(148,163,184,.16)!important;border-radius:1.2rem!important;
  backdrop-filter:blur(24px) saturate(140%);box-shadow:0 20px 55px rgba(0,0,0,.72)!important;
}
.mob-nav a{position:relative;min-height:48px;justify-content:center}
.mob-nav a.active{background:linear-gradient(145deg,rgba(56,189,248,.16),rgba(139,92,246,.08));color:#7dd3fc!important}
.mob-nav a.active::before{content:"";position:absolute;top:3px;width:18px;height:2px;border-radius:2px;background:#38bdf8;box-shadow:0 0 10px #38bdf8}

/* Modal entrances */
[id$="Modal"]:not(.hidden),#aModal:not(.hidden),#pModal:not(.hidden),#sModal:not(.hidden),#depModal:not(.hidden){animation:nxBackdrop .28s ease both}
[id$="Modal"]:not(.hidden)>*,#aModal:not(.hidden)>*,#pModal:not(.hidden)>*,#sModal:not(.hidden)>*,#depModal:not(.hidden)>*{animation:nxModal .48s var(--nx-ease) both}
@keyframes nxBackdrop{from{opacity:0}}
@keyframes nxModal{from{opacity:0;transform:translateY(24px) scale(.96)}}

@media(max-width:1023px){
  body{background:linear-gradient(145deg,#02040a,#050918 48%,#02040a)}
  main::before{left:0;top:0}
  .nx-hero{min-height:auto;padding:1.5rem 1.2rem 1.7rem;border-radius:1.45rem}
  .nx-hero-copy{max-width:100%}
  .nx-hero-title{font-size:clamp(2.05rem,10vw,3.4rem);max-width:620px}
  .nx-hero-desc{max-width:88%}
  .nx-hero-visual{right:-120px;top:22%;width:310px;height:310px;opacity:.26}
  .nx-hero-stats{gap:1.15rem}
}
@media(max-width:639px){
  .nx-hero{--hero-x:82%;min-height:470px}
  .nx-hero-desc{max-width:100%;font-size:.78rem}
  .nx-hero-actions{align-items:stretch}
  .nx-hero-cta{flex:1;min-width:135px}
  .nx-hero-visual{top:auto;bottom:-142px;right:-42px;width:300px;height:300px;opacity:.46}
  .nx-float-chip{display:none}
  .nx-hero-stats{max-width:78%;gap:.85rem 1rem}
  .nx-hero-stat b{font-size:.92rem}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .nx-reveal{opacity:1;transform:none}
}
