/* ============================================================
   OYUN DETAY SAYFASI (oyun-detay.php)
   ------------------------------------------------------------
   Oyun sunucusu kategorisinin tek temanin parcasidir. Renkler
   ve olculer /assets/css/custom.css -> OYUN SUNUCUSU KATEGORI
   TEMASI bloguyla ayni; burada yalnizca detay sayfasina ozgu
   bilesenler tanimlanir. Vurgu rengi --ga ile oyuna gore
   degisir (minecraft yesil, fivem turuncu, rust pirinc ...).
   ============================================================ */

.game-detail{
  background-color:var(--gm-bg);
  background-image:var(--gm-hex);
  color:var(--gm-text);
}
.gd-shell{ max-width:80rem; margin-inline:auto; padding-inline:1rem; }
@media(min-width:640px){ .gd-shell{ padding-inline:1.5rem; } }

.gd-kicker{
  display:inline-flex; align-items:center; gap:.5rem;
  font-size:11px; font-weight:800; letter-spacing:.18em; text-transform:uppercase;
  color:var(--gm-accent);
}

/* ── HERO ─────────────────────────────────────────────────── */
.gd-hero2{
  position:relative; overflow:hidden;
  background-color:#05080f;
  border-bottom:1px solid var(--gm-line);
}
.gd-hero2-bg{
  position:absolute; inset:0;
  background-size:cover; background-position:center;
  opacity:.26;
}
.gd-hero2-shade{
  position:absolute; inset:0;
  background:
    radial-gradient(120% 90% at 50% 0%, rgba(5,8,15,.55) 0%, rgba(5,8,15,.92) 58%, #05080f 100%),
    linear-gradient(180deg, rgba(5,8,15,.40) 0%, rgba(5,8,15,.86) 60%, #05080f 100%);
}
.gd-hero2::after{
  content:''; position:absolute; inset:0; pointer-events:none;
  background-image:var(--gm-hex-strong);
}
.gd-hero2-inner{ position:relative; z-index:2; padding:48px 0 56px; }
.gd-hero2-grid{ display:grid; grid-template-columns:1fr; gap:36px; align-items:start; }
@media(min-width:960px){ .gd-hero2-grid{ grid-template-columns:1.15fr .85fr; gap:44px; } }

.gd-breadcrumb{ display:flex; flex-wrap:wrap; align-items:center; gap:.35rem; font-size:12px; color:var(--gm-faint); }
.gd-breadcrumb a{ transition:color .15s ease; }
.gd-breadcrumb a:hover{ color:var(--gm-title); }
.gd-breadcrumb [aria-current]{ color:var(--gm-title); font-weight:600; }

.gd-hero2-chip{
  display:inline-flex; align-items:center; gap:.55rem;
  padding:6px 14px; border-radius:999px;
  border:1px solid rgba(var(--gm-accent-rgb),.35);
  background:rgba(var(--gm-accent-rgb),.13);
  font-size:11.5px; font-weight:800; letter-spacing:.12em; text-transform:uppercase;
  color:var(--gm-accent);
}
.gd-hero2-chip img{ width:24px; height:24px; object-fit:contain; }
.gd-hero2-copy h1{
  margin-top:18px;
  font-size:clamp(28px,4.6vw,44px);
  font-weight:800; letter-spacing:-.03em; line-height:1.1; color:var(--gm-title);
}
.gd-hero2-tag{ margin-top:10px; font-size:14px; font-weight:600; color:var(--gm-accent); }
.gd-hero2-intro{ margin-top:14px; max-width:56ch; font-size:15px; line-height:1.75; color:var(--gm-dim); }
.gd-hero2-facts{ display:flex; flex-wrap:wrap; gap:.5rem 1.4rem; margin-top:20px; font-size:12.5px; font-weight:600; color:var(--gm-dim); }
.gd-hero2-facts span{ display:inline-flex; align-items:center; gap:.4rem; }
.gd-hero2-facts svg{ color:var(--gm-accent); flex:none; }
.gd-hero2-actions{ display:flex; flex-wrap:wrap; gap:.75rem; margin-top:26px; }

.gd-button{
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  padding:14px 24px; border-radius:12px;
  font-size:14px; font-weight:700;
  background:var(--gm-accent); color:var(--gm-accent-ink); border:1px solid transparent;
  transition:transform .15s ease, box-shadow .15s ease;
}
.gd-button:hover{ transform:translateY(-2px); box-shadow:0 14px 32px -14px rgba(var(--gm-accent-rgb),.8); }
.gd-button-light{
  background:var(--gm-ghost-bg); border-color:var(--gm-line-2); color:var(--gm-title);
}
.gd-button-light:hover{ background:var(--gm-ghost-bg-h); border-color:rgba(var(--gm-accent-rgb),.5); box-shadow:none; }

.gd-hero2-card{
  padding:22px; border-radius:16px;
  background:rgba(11,18,32,.82);
  border:1px solid rgba(var(--gm-accent-rgb),.26);
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
}
.gd-hero2-card-label{ font-size:11.5px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--gm-accent); }
.gd-hero2-price{ display:flex; align-items:baseline; flex-wrap:wrap; gap:.5rem; margin-top:6px; }
.gd-hero2-price strong{ font-size:32px; font-weight:800; letter-spacing:-.03em; color:var(--gm-title); }
.gd-hero2-price span{ font-size:12.5px; color:var(--gm-faint); }
.gd-hero2-card ul{ margin-top:16px; display:grid; gap:.6rem; }
.gd-hero2-card li{ display:flex; align-items:flex-start; gap:.6rem; font-size:13px; color:var(--gm-dim); }
.gd-hero2-card li svg{ flex:none; margin-top:2px; color:var(--gm-accent); }
.gd-hero2-card .gd-button{ width:100%; margin-top:18px; }
.gd-hero2-card-link{
  display:inline-flex; align-items:center; gap:.35rem; margin-top:12px;
  font-size:12.5px; font-weight:600; color:var(--gm-accent);
  transition:color .15s ease;
}
.gd-hero2-card-link:hover{ color:var(--gm-title); }

/* ── OZELLIK SERIDI ───────────────────────────────────────── */
.gd-service-strip{ background:#070d18; border-bottom:1px solid var(--gm-line); }
.gd-service-grid{
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1px;
  background:rgba(148,178,222,.14); border-inline:1px solid var(--gm-line);
}
@media(min-width:768px){ .gd-service-grid{ grid-template-columns:repeat(4,minmax(0,1fr)); } }
.gd-service-grid > div{ display:flex; align-items:center; gap:.85rem; padding:18px 20px; background:#070d18; }
.gd-service-grid > div > span{
  display:flex; align-items:center; justify-content:center;
  width:36px; height:36px; flex:none; border-radius:10px;
  background:rgba(var(--gm-accent-rgb),.14); color:var(--gm-accent);
}
.gd-service-grid p{ display:flex; flex-direction:column; line-height:1.35; }
.gd-service-grid strong{ font-size:13.5px; font-weight:700; color:var(--gm-title); }
.gd-service-grid small{ font-size:11.5px; color:var(--gm-faint); }

/* ── BOLUMLER ────────────────────────────────────────────── */
.gd-section{ background-color:var(--gm-bg); background-image:var(--gm-hex); padding:64px 0; }
@media(min-width:768px){ .gd-section{ padding:80px 0; } }
#gd-plans{ scroll-margin-top:6rem; }
.gd-section-soft{ background-color:var(--gm-bg-2); background-image:var(--gm-hex); border-top:1px solid var(--gm-line); }

.gd-section-heading{ display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:1.25rem; margin-bottom:2rem; }
.gd-section-heading h2{
  margin-top:.5rem; font-size:clamp(24px,3.2vw,30px);
  font-weight:700; letter-spacing:-.025em; line-height:1.2; color:var(--gm-title);
}
.gd-section-heading p{ margin-top:.75rem; max-width:60ch; font-size:14.5px; line-height:1.7; color:var(--gm-dim); }
.gd-price-note{
  flex:none; padding:6px 12px; border-radius:999px;
  background:rgba(var(--gm-accent-rgb),.12); border:1px solid rgba(var(--gm-accent-rgb),.28);
  font-size:11.5px; font-weight:700; color:var(--gm-accent);
}
.gd-plans-head-side{ display:flex; align-items:center; gap:.9rem; }
.gd-plans-logo img{ width:56px; height:56px; object-fit:contain; }

/* ── ISLEMLCI SEKMELERI ───────────────────────────────────── */
.gd-ptabs{
  display:inline-flex; flex-wrap:wrap; gap:.35rem; padding:.35rem;
  border-radius:.875rem; background:var(--gm-chip-bg);
  border:1px solid var(--gm-line);
}
.gd-ptab{
  display:inline-flex; align-items:center; gap:.55rem; padding:.6rem 1rem;
  border:0; border-radius:.625rem; background:transparent; font-family:inherit;
  cursor:pointer; transition:background-color .15s ease, box-shadow .15s ease;
}
.gd-ptab:hover{ background:var(--gm-faq-bg-h); }
.gd-ptab.active{ background:var(--gm-surface-2); box-shadow:0 0 0 1px rgba(var(--gm-accent-rgb),.45); }
.gd-ptab img{ width:20px; height:20px; object-fit:contain; }
.gd-ptab span{ display:flex; flex-direction:column; align-items:flex-start; line-height:1.25; }
.gd-ptab strong{ font-size:13px; font-weight:700; color:var(--gm-dim); }
.gd-ptab small{ font-size:10.5px; color:var(--gm-faint); }
.gd-ptab.active strong{ color:var(--gm-title); }
.gd-ptab.active small{ color:var(--gm-accent); }
.gd-plan-panels{ margin-top:1.5rem; }
.gd-plan-panel[hidden]{ display:none; }

/* ── PAKET KARTLARI ──────────────────────────────────────── */
.gd-plan-grid{ display:grid; gap:1.25rem; grid-template-columns:repeat(auto-fit,minmax(265px,1fr)); }
.gd-plan-card{
  display:flex; flex-direction:column; padding:22px; border-radius:16px;
  background-color:var(--gm-surface); background-image:var(--gm-hex);
  border:1px solid var(--gm-line);
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.gd-plan-card:hover{
  transform:translateY(-3px);
  border-color:rgba(var(--gm-accent-rgb),.45);
  box-shadow:0 22px 50px -22px rgba(0,0,0,.9);
}
.gd-plan-featured{
  border-color:rgba(var(--gm-accent-rgb),.40);
  background-color:var(--gm-surface-2);
  box-shadow:0 14px 40px -20px rgba(0,0,0,.85);
}
.gd-plan-card-head{ display:flex; align-items:center; justify-content:space-between; gap:.75rem; }
.gd-plan-card-head h3{ font-size:15px; font-weight:700; color:var(--gm-title); }
.gd-plan-badge{
  flex:none; padding:3px 9px; border-radius:999px;
  background:var(--gm-accent); color:var(--gm-accent-ink);
  font-size:10px; font-weight:800; letter-spacing:.06em; text-transform:uppercase;
}
.gd-plan-price{ display:flex; align-items:baseline; gap:.35rem; margin-top:10px; }
.gd-plan-price strong{ font-size:26px; font-weight:800; letter-spacing:-.03em; color:var(--gm-title); }
.gd-plan-featured .gd-plan-price strong{ color:var(--gm-accent); }
.gd-plan-price > span{ font-size:12.5px; color:var(--gm-faint); }
.gd-plan-specs{ margin-top:16px; padding-top:14px; border-top:1px solid var(--gm-line); display:grid; gap:.55rem; }
.gd-plan-specs li{ display:flex; align-items:center; gap:.55rem; font-size:12.5px; color:var(--gm-dim); }
.gd-plan-specs svg{ flex:none; color:var(--gm-accent); }
.gd-buy-button{
  display:inline-flex; align-items:center; justify-content:center; gap:.4rem;
  margin-top:20px; padding:11px 18px; border-radius:12px;
  font-size:13px; font-weight:700;
  background:var(--gm-accent); color:var(--gm-accent-ink);
  transition:transform .15s ease, box-shadow .15s ease;
}
.gd-buy-button:hover{ transform:translateY(-2px); box-shadow:0 12px 28px -12px rgba(var(--gm-accent-rgb),.85); }
.gd-buy-disabled{ background:var(--gm-chip-bg); color:var(--gm-faint); cursor:default; }
.gd-buy-disabled:hover{ transform:none; box-shadow:none; }
.gd-empty-plans{
  padding:26px; border-radius:16px; text-align:center;
  background:var(--gm-surface); border:1px dashed var(--gm-line-2);
  font-size:13.5px; color:var(--gm-faint);
}
.gd-plan-footnote{ display:flex; align-items:flex-start; gap:.55rem; margin-top:1.5rem; font-size:12.5px; line-height:1.6; color:var(--gm-faint); }
.gd-plan-footnote svg{ flex:none; margin-top:2px; color:var(--gm-accent); }

/* ── HAKKINDA + TEKNIK KART ──────────────────────────────── */
.gd-about-grid{ display:grid; grid-template-columns:1fr; gap:32px; align-items:start; }
@media(min-width:900px){ .gd-about-grid{ grid-template-columns:1.25fr .75fr; gap:48px; } }
.gd-about-grid h2{
  margin-top:.5rem; font-size:clamp(24px,3.2vw,30px);
  font-weight:700; letter-spacing:-.025em; line-height:1.2; color:var(--gm-title);
}
.gd-about-copy{ margin-top:1rem; font-size:14.5px; line-height:1.75; color:var(--gm-dim); }
.gd-feature-list{ margin-top:1.5rem; display:grid; gap:.7rem; }
.gd-feature-list li{
  display:flex; align-items:flex-start; gap:.6rem; padding:.65rem .85rem;
  border-radius:12px; background:var(--gm-faq-bg);
  border:1px solid var(--gm-line); font-size:13.5px; color:var(--gm-dim);
}
.gd-feature-list svg{ flex:none; margin-top:2px; color:var(--gm-accent); }
.gd-tech-card{ padding:22px; border-radius:16px; background:var(--gm-surface); background-image:var(--gm-hex); border:1px solid var(--gm-line); }
.gd-tech-icon{ width:44px; height:44px; object-fit:contain; }
.gd-tech-card h3{ margin-top:12px; font-size:15px; font-weight:700; color:var(--gm-title); }
.gd-tech-card > p{ margin-top:.35rem; font-size:12.5px; color:var(--gm-faint); }
.gd-tech-card ul{ margin-top:14px; padding-top:14px; border-top:1px solid var(--gm-line); display:grid; gap:.5rem; }
.gd-tech-card li{ position:relative; padding-left:14px; font-size:13px; color:var(--gm-dim); }
.gd-tech-card li::before{ content:''; position:absolute; left:0; top:.55em; width:5px; height:5px; border-radius:999px; background:var(--gm-accent); }
.gd-tech-card a{
  display:inline-flex; align-items:center; gap:.35rem; margin-top:16px;
  font-size:13px; font-weight:700; color:var(--gm-accent); transition:color .15s ease;
}
.gd-tech-card a:hover{ color:var(--gm-title); }

/* ── GALERI ───────────────────────────────────────────────── */
.gd-gallery{ display:grid; gap:1rem; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); }
.gd-gallery figure{
  margin:0; overflow:hidden; border-radius:16px;
  border:1px solid var(--gm-line); background:var(--gm-surface);
}
.gd-gallery img{ display:block; width:100%; height:180px; object-fit:cover; transition:transform .35s ease; }
.gd-gallery figure:hover img{ transform:scale(1.05); }
.gd-gallery.is-wide{ grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); }
.gd-gallery.is-wide figure.is-lead{ grid-column:span 2; }
@media(max-width:640px){ .gd-gallery.is-wide figure.is-lead{ grid-column:span 1; } }
.gd-gallery.is-wide figure.is-lead img{ height:260px; }
.gd-gallery figcaption{ padding:.7rem .9rem; font-size:12px; color:var(--gm-faint); }
.gd-gallery.is-wide figcaption{ padding:.9rem 1rem; font-size:12.5px; }

/* ── SPOTLIGHT ────────────────────────────────────────────── */
.gd-spotlight{
  display:grid; grid-template-columns:1fr; gap:32px; align-items:center;
  padding-bottom:56px;
}
.gd-spotlight:last-child{ padding-bottom:0; }
@media(min-width:900px){
  .gd-spotlight{ grid-template-columns:1.05fr .95fr; gap:48px; }
  .gd-spotlight.is-flip .gd-spotlight-media{ order:-1; }
}
.gd-spotlight-label{
  display:inline-flex; align-items:center; gap:.5rem;
  font-size:11px; font-weight:800; letter-spacing:.18em; text-transform:uppercase;
  color:var(--gm-accent);
}
.gd-spotlight-label::before{ content:''; width:22px; height:1px; background:var(--gm-accent); opacity:.7; }
.gd-spotlight h2{
  margin-top:.6rem; font-size:clamp(22px,2.8vw,28px);
  font-weight:700; letter-spacing:-.025em; line-height:1.22; color:var(--gm-title);
}
.gd-spotlight-text{ margin-top:.9rem; font-size:14px; line-height:1.75; color:var(--gm-dim); }
.gd-spotlight-text strong{ color:var(--gm-title); font-weight:700; }
.gd-spotlist{ margin-top:1.25rem; display:grid; gap:.55rem; }
.gd-spotlist li{ display:flex; align-items:flex-start; gap:.55rem; font-size:13.5px; color:var(--gm-dim); }
.gd-spotlist svg{ flex:none; margin-top:2px; color:var(--gm-accent); }
.gd-spotlight-media{
  margin:0; overflow:hidden; border-radius:16px;
  border:1px solid var(--gm-line); background:#081120;
  box-shadow:0 22px 60px rgba(0,0,0,.45);
}
.gd-spotlight-media img{ display:block; width:100%; height:auto; }
.gd-spotlight-media figcaption{ padding:.7rem .9rem; font-size:12px; color:var(--gm-faint); border-top:1px solid var(--gm-line); }

/* ── SSS ──────────────────────────────────────────────────── */
.gd-faq-shell{ max-width:56rem; }
.gd-faq{ display:grid; gap:.65rem; }
.gd-faq details{
  border-radius:12px; background:var(--gm-faq-bg);
  border:1px solid var(--gm-line); padding:.9rem 1rem;
  transition:border-color .15s ease, background-color .15s ease;
}
.gd-faq details:hover{ border-color:rgba(var(--gm-accent-rgb),.4); background:var(--gm-faq-bg-h); }
.gd-faq summary{
  display:flex; align-items:center; justify-content:space-between; gap:.75rem;
  cursor:pointer; list-style:none; font-size:14px; font-weight:700; color:var(--gm-title);
}
.gd-faq summary::-webkit-details-marker{ display:none; }
.gd-faq summary span{ flex:none; color:var(--gm-accent); transition:transform .2s ease; }
.gd-faq details[open] summary span{ transform:rotate(180deg); }
.gd-faq details p{ margin-top:.6rem; font-size:13.5px; line-height:1.7; color:var(--gm-dim); }

/* ── OYUN BILGI ──────────────────────────────────────────── */
.gd-game-info{ max-width:70rem; }
.gd-info-grid{ display:grid; grid-template-columns:1fr; gap:32px; }
@media(min-width:900px){ .gd-info-grid{ grid-template-columns:1.3fr .7fr; gap:40px; align-items:start; } }
.gd-info-main h3{ font-size:19px; font-weight:700; color:var(--gm-title); }
.gd-info-main > p{ margin-top:.8rem; font-size:14px; line-height:1.78; color:var(--gm-dim); }
.gd-info-main h4{ margin-top:1.75rem; font-size:15px; font-weight:700; color:var(--gm-title); }
.gd-info-features{ margin-top:.9rem; display:grid; gap:.55rem; }
.gd-info-features li{ display:flex; align-items:flex-start; gap:.6rem; font-size:13.5px; color:var(--gm-dim); }
.gd-info-features svg{ flex:none; margin-top:2px; color:var(--gm-accent); }
.gd-info-server{ padding:22px; border-radius:16px; background:var(--gm-surface); background-image:var(--gm-hex); border:1px solid var(--gm-line); }
.gd-info-server h4{ font-size:15px; font-weight:700; color:var(--gm-title); }
.gd-info-server > p{ margin-top:.7rem; font-size:13.5px; line-height:1.75; color:var(--gm-dim); }
.gd-info-tips{ margin-top:18px; padding-top:16px; border-top:1px solid var(--gm-line); }
.gd-info-tips h5{ font-size:12px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:var(--gm-accent); }
.gd-info-tips ul{ margin-top:.8rem; display:grid; gap:.6rem; }
.gd-info-tips li{ display:flex; align-items:flex-start; gap:.55rem; font-size:12.5px; line-height:1.6; color:var(--gm-dim); }
.gd-info-tips svg{ flex:none; margin-top:2px; color:var(--gm-accent); }

/* ── DIGER OYUNLAR ───────────────────────────────────────── */
.gd-mini{ background:var(--gm-bg); background-image:var(--gm-hex); padding:64px 0; }
@media(min-width:768px){ .gd-mini{ padding:80px 0; } }
.gd-mini-head{ display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:1rem; margin-bottom:1.75rem; }
.gd-mini-kicker{
  display:inline-flex; align-items:center; gap:.5rem;
  font-size:11px; font-weight:800; letter-spacing:.18em; text-transform:uppercase;
  color:var(--gm-accent);
}
.gd-mini-head h2{
  margin-top:.5rem; font-size:clamp(24px,3.2vw,30px);
  font-weight:700; letter-spacing:-.025em; line-height:1.2; color:var(--gm-title);
}
.gd-mini-all{
  display:inline-flex; align-items:center; gap:.4rem; padding:11px 18px; border-radius:12px;
  border:1px solid var(--gm-line-2); background:var(--gm-chip-bg);
  font-size:13px; font-weight:700; color:var(--gm-dim);
  transition:background-color .15s ease, color .15s ease;
}
.gd-mini-all:hover{ background:var(--gm-ghost-bg-h); color:var(--gm-title); }
.gd-mini-grid{ display:grid; gap:1rem; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); }
.gd-mini-card{
  display:flex; align-items:center; gap:.85rem; padding:14px 16px;
  border-radius:16px; background:var(--gm-surface); border:1px solid var(--gm-line);
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.gd-mini-card:hover{
  transform:translateY(-3px); border-color:rgba(var(--gm-accent-rgb),.45);
  box-shadow:0 18px 44px -20px rgba(0,0,0,.9);
}
.gd-mini-logo img{ width:40px; height:40px; object-fit:contain; }
.gd-mini-body{ display:flex; flex-direction:column; min-width:0; flex:1; }
.gd-mini-name{ font-size:14px; font-weight:700; color:var(--gm-title); }
.gd-mini-meta{ font-size:11.5px; color:var(--gm-faint); }
.gd-mini-price{ display:flex; align-items:baseline; gap:.2rem; font-size:15px; font-weight:800; color:var(--gm-accent); white-space:nowrap; }
.gd-mini-price small{ font-size:10.5px; font-weight:500; color:var(--gm-faint); }
/* SEO baslik blogu: bolum basligindan kucuk, tek duz olcek */
.gm-seo-h2{ font-size:20px; font-weight:700; letter-spacing:-.02em; color:var(--gm-title); }
@media(min-width:640px){ .gm-seo-h2{ font-size:22px; } }