@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap');

:root {
  --bg-deep: #0A0E1A;
  --surface: #111827;
  --card: #1A2235;
  --cyan: #00D4FF;
  --gold: #FFB800;
  --gain: #00E676;
  --loss: #FF3D5A;
}

* { box-sizing: border-box; }

html, body {
  scroll-behavior: smooth;
}

body {
  background-color: var(--bg-deep);
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  color: #E5E9F2;
  overflow-x: hidden;
}

/* ---------- language toggle ---------- */
[data-lang="tr"] .i18n-en,
[data-lang="en"] .i18n-tr {
  display: none !important;
}

/* ---------- background ---------- */
.bg-grid {
  background-image:
    linear-gradient(rgba(0, 212, 255, 0.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 212, 255, 0.06) 1px, transparent 1px);
  background-size: 44px 44px;
  -webkit-mask-image: radial-gradient(ellipse 80% 60% at 50% 0%, #000 40%, transparent 100%);
  mask-image: radial-gradient(ellipse 80% 60% at 50% 0%, #000 40%, transparent 100%);
}

.glow-orb {
  position: absolute;
  border-radius: 9999px;
  filter: blur(90px);
  pointer-events: none;
  opacity: 0.35;
}

/* ---------- glass card ---------- */
.glass {
  background: linear-gradient(180deg, rgba(26, 34, 53, 0.75), rgba(17, 24, 39, 0.65));
  border: 1px solid rgba(255, 255, 255, 0.07);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.glass-nav {
  background: rgba(10, 14, 26, 0.72);
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}

.card-hover {
  transition: transform 0.35s cubic-bezier(.2,.8,.2,1), border-color 0.35s, box-shadow 0.35s;
}
.card-hover:hover {
  transform: translateY(-6px);
  border-color: rgba(0, 212, 255, 0.35);
  box-shadow: 0 20px 40px -20px rgba(0, 212, 255, 0.25);
}

/* ---------- gradient text ---------- */
.text-gradient {
  background: linear-gradient(90deg, #00D4FF 0%, #7C6CFF 50%, #FFB800 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* ---------- shimmer ---------- */
.shimmer {
  position: relative;
  overflow: hidden;
}
.shimmer::after {
  content: "";
  position: absolute;
  top: 0; left: -150%;
  width: 150%; height: 100%;
  background: linear-gradient(100deg, transparent 0%, rgba(255, 184, 0, 0.18) 45%, rgba(255, 184, 0, 0.35) 50%, rgba(255, 184, 0, 0.18) 55%, transparent 100%);
  animation: shimmer-sweep 3.2s ease-in-out infinite;
}
@keyframes shimmer-sweep {
  0% { left: -150%; }
  60%, 100% { left: 150%; }
}

/* ---------- floating icon ---------- */
.float-y {
  animation: float-y 6s ease-in-out infinite;
}
@keyframes float-y {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-14px); }
}

/* ---------- reveal on scroll ---------- */
.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.7s ease, transform 0.7s ease;
}
.reveal.in-view {
  opacity: 1;
  transform: translateY(0);
}

/* ---------- scrollbar ---------- */
::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: var(--bg-deep); }
::-webkit-scrollbar-thumb { background: #253047; border-radius: 8px; }
::-webkit-scrollbar-thumb:hover { background: #324061; }

/* ---------- lang pill ---------- */
.lang-pill button {
  transition: background 0.25s, color 0.25s;
}
.lang-pill button.active {
  background: var(--cyan);
  color: #05131A;
}

/* ---------- badge dot ---------- */
.pulse-dot {
  animation: pulse-dot 1.6s ease-in-out infinite;
}
@keyframes pulse-dot {
  0%, 100% { box-shadow: 0 0 0 0 rgba(0, 230, 118, 0.55); }
  70% { box-shadow: 0 0 0 8px rgba(0, 230, 118, 0); }
}

/* number tabular */
.tabular-nums { font-variant-numeric: tabular-nums; }