/* ═══════════════════════════════════════════
   OYUN KAMPÜSÜ — Paylaşılan Stil Dosyası
   ═══════════════════════════════════════════ */
:root {
  --bg:      #0d0f1a;
  --bg2:     #131628;
  --bg3:     #1a1e35;
  --surface: rgba(255,255,255,.06);
  --border:  rgba(255,255,255,.1);
  --text:    #f0f2ff;
  --muted:   rgba(240,242,255,.45);
  --a1: #ff6b6b;
  --a2: #ffd93d;
  --a3: #6bcb77;
  --a4: #4d96ff;
  --a5: #c77dff;
  --fh: 'Baloo 2', cursive;
  --fb: 'Nunito', sans-serif;
  --r: 18px;
}
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  font-family: var(--fb);
  background: var(--bg);
  color: var(--text);
  min-height: 100vh;
  overflow-x: hidden;
}

/* ── Starfield ── */
#starfield { position:fixed; inset:0; z-index:0; pointer-events:none; overflow:hidden; }
.star {
  position:absolute; border-radius:50%; background:#fff; opacity:0;
  animation:twinkle var(--d,3s) ease-in-out infinite var(--del,0s);
}
@keyframes twinkle {
  0%,100%{opacity:0;transform:scale(.6)}
  50%{opacity:var(--op,.7);transform:scale(1)}
}

/* ── NAV ── */
nav {
  position:fixed; top:0; left:0; right:0; z-index:200;
  display:flex; align-items:center; gap:14px;
  padding:11px 24px;
  background:rgba(13,15,26,.88);
  backdrop-filter:blur(20px);
  border-bottom:1px solid var(--border);
}
.nav-logo {
  font-family:var(--fh); font-weight:900; font-size:1.35rem;
  background:linear-gradient(90deg,var(--a1),var(--a2),var(--a3));
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
  text-decoration:none; flex-shrink:0;
}
.nav-links { display:flex; gap:4px; margin-left:auto; align-items:center; flex-wrap:wrap; }
.nav-links a {
  color:var(--muted); text-decoration:none; font-weight:700; font-size:.83rem;
  padding:5px 12px; border-radius:50px; transition:all .18s;
}
.nav-links a:hover { color:#fff; background:var(--surface); }
.nav-links a.active { color:#fff; background:var(--surface); }
.nav-cta {
  background:linear-gradient(135deg,var(--a1),var(--a2)) !important;
  color:#1a1a1a !important;
}
.nav-cta:hover { transform:scale(1.04); box-shadow:0 4px 16px rgba(255,107,107,.38); }

/* ── PAGE HEADER ── */
.page-hero {
  position:relative; z-index:1;
  padding:120px 20px 60px;
  text-align:center;
}
.page-hero-inner { max-width:700px; margin:0 auto; }
.page-tag {
  display:inline-block;
  border-radius:50px; padding:4px 14px;
  font-size:.7rem; font-weight:800; letter-spacing:2px; text-transform:uppercase;
  margin-bottom:12px;
}
.page-title {
  font-family:var(--fh); font-weight:900;
  font-size:clamp(2rem,5vw,3.4rem);
  line-height:1.1; margin-bottom:12px;
}
.page-sub {
  color:var(--muted); font-size:1rem; font-weight:600;
  line-height:1.65; max-width:580px; margin:0 auto;
}

/* ── SECTION ── */
.section { position:relative; z-index:1; padding:60px 20px; }
.section-inner { max-width:1060px; margin:0 auto; }
.section-alt { background:var(--bg2); }
.section-hdr { text-align:center; margin-bottom:40px; }
.stag {
  display:inline-block;
  background:rgba(77,150,255,.13); border:1px solid rgba(77,150,255,.26);
  border-radius:50px; padding:4px 14px;
  font-size:.7rem; font-weight:800; color:var(--a4);
  letter-spacing:2px; text-transform:uppercase; margin-bottom:10px;
}
.stitle {
  font-family:var(--fh); font-weight:900;
  font-size:clamp(1.6rem,3.5vw,2.4rem); margin-bottom:7px;
}
.ssub { color:var(--muted); font-size:.95rem; font-weight:600; }

/* ── CARD ── */
.card {
  background:var(--bg3); border:1px solid var(--border);
  border-radius:var(--r); padding:24px 20px;
}

/* ── BUTTONS ── */
.btn {
  display:inline-flex; align-items:center; gap:7px;
  padding:12px 24px; border-radius:50px;
  font-family:var(--fh); font-weight:800; font-size:1rem;
  text-decoration:none; border:none; cursor:pointer; transition:all .18s;
}
.btn:active{transform:scale(.96);}
.btn-primary {
  background:linear-gradient(135deg,var(--a4),var(--a5));
  color:#fff; box-shadow:0 6px 22px rgba(77,150,255,.35);
}
.btn-primary:hover { transform:translateY(-2px); box-shadow:0 10px 30px rgba(77,150,255,.5); }
.btn-green {
  background:linear-gradient(135deg,var(--a3),#38f9d7);
  color:#0d2a1a; box-shadow:0 6px 22px rgba(107,203,119,.35);
}
.btn-green:hover { transform:translateY(-2px); }
.btn-ghost {
  background:var(--surface); border:1px solid var(--border); color:#fff;
}
.btn-ghost:hover { background:rgba(255,255,255,.12); transform:translateY(-2px); }

/* ── FOOTER ── */
footer {
  position:relative; z-index:1;
  background:var(--bg2); border-top:1px solid var(--border);
  padding:44px 20px 24px;
}
.footer-grid {
  max-width:1060px; margin:0 auto;
  display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:32px;
  margin-bottom:28px;
}
.fbrand-name {
  font-family:var(--fh); font-weight:900; font-size:1.3rem;
  background:linear-gradient(90deg,var(--a1),var(--a2));
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
  margin-bottom:8px;
}
.fbrand-desc { font-size:.8rem; color:var(--muted); font-weight:600; line-height:1.5; max-width:230px; }
.fcol h4 {
  font-family:var(--fh); font-weight:800; font-size:.83rem;
  color:rgba(255,255,255,.65); margin-bottom:11px;
}
.fcol a {
  display:block; font-size:.8rem; color:var(--muted); font-weight:600;
  text-decoration:none; margin-bottom:7px; transition:color .15s;
}
.fcol a:hover { color:#fff; }
.footer-bottom {
  max-width:1060px; margin:0 auto;
  padding-top:20px; border-top:1px solid var(--border);
  display:flex; align-items:center; justify-content:space-between;
  flex-wrap:wrap; gap:8px;
  font-size:.74rem; color:var(--muted); font-weight:600;
}

/* ── REVEAL ── */
@keyframes fadeUp {
  from{opacity:0;transform:translateY(22px)}
  to{opacity:1;transform:translateY(0)}
}
.reveal {
  opacity:0; transform:translateY(26px);
  transition:opacity .5s ease, transform .5s ease;
}
.reveal.visible { opacity:1; transform:translateY(0); }
.fadeUp { animation:fadeUp .65s ease both; }
.fadeUp-1 { animation:fadeUp .65s .1s ease both; }
.fadeUp-2 { animation:fadeUp .65s .2s ease both; }
.fadeUp-3 { animation:fadeUp .65s .3s ease both; }

/* ── PROSE (yasal sayfalar için) ── */
.prose { max-width:760px; margin:0 auto; line-height:1.75; }
.prose h2 {
  font-family:var(--fh); font-weight:900;
  font-size:1.35rem; margin:36px 0 10px; color:#fff;
}
.prose h3 {
  font-family:var(--fh); font-weight:800;
  font-size:1.05rem; margin:24px 0 8px; color:rgba(255,255,255,.8);
}
.prose p { color:var(--muted); font-size:.9rem; margin-bottom:12px; font-weight:600; }
.prose ul { color:var(--muted); font-size:.9rem; font-weight:600; padding-left:20px; margin-bottom:12px; }
.prose ul li { margin-bottom:6px; }
.prose a { color:var(--a4); text-decoration:none; }
.prose a:hover { text-decoration:underline; }
.prose .highlight {
  background:rgba(77,150,255,.1); border:1px solid rgba(77,150,255,.22);
  border-radius:12px; padding:16px 18px; margin:18px 0;
}

/* ── İLETİŞİM FORMU ── */
.form-group { margin-bottom:16px; }
.form-group label {
  display:block; font-size:.78rem; font-weight:800;
  color:rgba(255,255,255,.65); margin-bottom:6px;
  text-transform:uppercase; letter-spacing:1px;
}
.form-group input,
.form-group textarea,
.form-group select {
  width:100%; padding:11px 15px;
  background:rgba(255,255,255,.06);
  border:1px solid var(--border);
  border-radius:12px; color:#fff;
  font-family:var(--fb); font-size:.9rem; font-weight:600;
  transition:border-color .18s;
  resize:vertical;
}
.form-group input:focus,
.form-group textarea:focus,
.form-group select:focus {
  outline:none; border-color:var(--a4);
  box-shadow:0 0 0 3px rgba(77,150,255,.15);
}
.form-group input::placeholder,
.form-group textarea::placeholder { color:rgba(255,255,255,.25); }

/* ── RESPONSIVE ── */
@media(max-width:768px) {
  .footer-grid { grid-template-columns:1fr 1fr; }
  nav { padding:10px 14px; }
  .nav-links a:not(.nav-cta) { display:none; }
}
@media(max-width:480px) {
  .footer-grid { grid-template-columns:1fr; }
}