/* ==========================================================================
   GAZANCI — CELESTIAL MERIDIAN
   Özgün tema katmanı: obsidyen gece, altın varak, zümrüt ve burgundy vurgular.
   Mevcut yapıyı bozmadan renk, doku, tipografi ve yüzeyleri yeniden tanımlar.
   ========================================================================== */

:root {
  --g3-ink: #04060d;
  --g3-ink-2: #080c16;
  --g3-ink-3: #0d1220;
  --g3-gold: #c9a24b;
  --g3-gold-bright: #f0d78c;
  --g3-gold-deep: #8a5a2b;
  --g3-emerald: #1f6f5c;
  --g3-burgundy: #6e1f35;
  --g3-ivory: #f2ead8;
  --g3-muted: #a49a86;
  --g3-line: rgba(201, 162, 75, .20);

  /* Eski değişkenleri yeni palete bağla */
  --bg-deep: #04060d;
  --gold: #c9a24b;
  --gold-light: #f0d78c;
  --gold-dark: #8a5a2b;
  --purple: #c9a24b;
  --cyan: #1f6f5c;
  --blue: #1f6f5c;
  --rose: #6e1f35;
  --text: #e8e2d2;
  --text-muted: #a49a86;
  --border: rgba(201, 162, 75, .16);
  --border-gold: rgba(201, 162, 75, .35);
  --bg-card: rgba(9, 13, 23, .78);
  --bg-card-hover: rgba(14, 20, 34, .92);
  --gradient-gold: linear-gradient(135deg, #8a5a2b, #c9a24b 45%, #f0d78c);
  --shadow: 0 24px 70px rgba(0, 0, 0, .55);
  --gx-violet: #c9a24b;
  --gx-cyan: #1f6f5c;
  --gx-gold: #f0d78c;
  --gx-glass: rgba(8, 12, 22, .72);
}

/* ---------- Zemin: gözlemevi gecesi ---------- */
html { background: var(--g3-ink); }

body {
  background:
    radial-gradient(ellipse at 14% 0%, rgba(201, 162, 75, .10), transparent 42%),
    radial-gradient(ellipse at 88% 12%, rgba(31, 111, 92, .10), transparent 40%),
    radial-gradient(ellipse at 50% 106%, rgba(110, 31, 53, .10), transparent 55%),
    var(--g3-ink) !important;
  color: var(--text);
}

body::before {
  background-image:
    radial-gradient(1px 1px at 12% 18%, rgba(240, 215, 140, .60), transparent),
    radial-gradient(1px 1px at 76% 13%, rgba(201, 162, 75, .52), transparent),
    radial-gradient(1.5px 1.5px at 89% 61%, rgba(31, 111, 92, .45), transparent),
    radial-gradient(1px 1px at 32% 74%, rgba(242, 234, 216, .32), transparent),
    radial-gradient(ellipse at 50% 0%, rgba(201, 162, 75, .10), transparent 55%),
    radial-gradient(ellipse at 0% 80%, rgba(110, 31, 53, .08), transparent 45%) !important;
}

body::after {
  background-image:
    linear-gradient(rgba(201, 162, 75, .045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(201, 162, 75, .045) 1px, transparent 1px) !important;
  opacity: .30 !important;
}

::selection { background: rgba(201, 162, 75, .35); color: #fff8e8; }

/* Altın ince kaydırma çubuğu */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: #05080f; }
::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #8a5a2b, #c9a24b 50%, #8a5a2b);
  border-radius: 8px;
  border: 2px solid #05080f;
}
::-webkit-scrollbar-thumb:hover { background: linear-gradient(180deg, #c9a24b, #f0d78c 50%, #c9a24b); }

/* ---------- Başlık ---------- */
.site-header {
  background: linear-gradient(180deg, rgba(4, 6, 13, .96), rgba(4, 6, 13, .84)) !important;
  border-bottom: 1px solid rgba(201, 162, 75, .22) !important;
  box-shadow: 0 12px 44px rgba(0, 0, 0, .5) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.site-header::after {
  background: linear-gradient(90deg, transparent, #8a5a2b 20%, #c9a24b 38%, #f0d78c 50%, #c9a24b 62%, #8a5a2b 80%, transparent) !important;
  height: 1px;
  opacity: .9;
}

.logo { letter-spacing: 2.4px; }
.logo span {
  background: linear-gradient(100deg, #f7e7b0, #c9a24b 45%, #f0d78c 75%, #c9a24b);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
} 

.logo-img {
  border: 1px solid rgba(240, 215, 140, .65) !important;
  box-shadow: 0 0 0 3px rgba(201, 162, 75, .08), 0 0 22px rgba(201, 162, 75, .28) !important;
}

.nav-links a {
  color: #b7ad97;
  letter-spacing: .02em;
}
.nav-links a:hover,
.nav-links a.active {
  color: #f7e7b0 !important;
  background: rgba(201, 162, 75, .10) !important;
}

.nav-cta {
  background: linear-gradient(135deg, #8a5a2b, #c9a24b 55%, #f0d78c) !important;
  color: #080c16 !important;
  box-shadow: 0 6px 22px rgba(201, 162, 75, .28) !important;
}

/* ---------- Hero ---------- */
.hero {
  position: relative;
  isolation: isolate;
}

.hero::before {
  background: radial-gradient(ellipse, rgba(201, 162, 75, .16), rgba(31, 111, 92, .07) 44%, transparent 70%) !important;
  filter: blur(30px) !important;
}

/* Astrolabe filigranı */
.hero::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 46%;
  width: min(94vw, 780px);
  height: min(94vw, 780px);
  transform: translate(-50%, -50%);
  background: url("../img/astrolabe.svg") center / contain no-repeat;
  opacity: .07;
  pointer-events: none;
  z-index: -1;
}

.hero-badge {
  background: rgba(201, 162, 75, .08) !important;
  border-color: rgba(201, 162, 75, .42) !important;
  color: #f0d78c !important;
  box-shadow: 0 0 34px rgba(201, 162, 75, .10) !important;
  letter-spacing: 2.4px !important;
}

.hero h1 {
  color: #f4eedd;
  text-shadow: 0 10px 60px rgba(201, 162, 75, .16);
}

.hero h1 .gold,
.hero .gold {
  background: linear-gradient(100deg, #fff6d4 0%, #f0d78c 24%, #c9a24b 48%, #8a5a2b 68%, #f0d78c 92%) !important;
  background-size: 220% auto !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

.hero-sub { color: #b9b09d; }

/* ---------- Butonlar ---------- */
.btn {
  border-radius: 4px;
  letter-spacing: .04em;
}

.btn-primary {
  background: linear-gradient(135deg, #8a5a2b, #c9a24b 48%, #f0d78c) !important;
  color: #080c16 !important;
  border: 1px solid rgba(240, 215, 140, .55) !important;
  box-shadow: 0 10px 32px rgba(201, 162, 75, .20), inset 0 1px rgba(255, 255, 255, .35) !important;
}

.btn-primary:hover {
  box-shadow: 0 16px 44px rgba(201, 162, 75, .32), inset 0 1px rgba(255, 255, 255, .45) !important;
}

.btn-outline {
  border-color: rgba(201, 162, 75, .34) !important;
  background: rgba(8, 12, 22, .40) !important;
  color: #e8e2d2;
}
.btn-outline:hover {
  border-color: rgba(240, 215, 140, .75) !important;
  background: rgba(201, 162, 75, .08) !important;
  color: #f7e7b0 !important;
}

/* ---------- Bölüm başlıkları ---------- */
.section-header h2,
.page-hero h1,
.content-box h2 {
  color: #f4eedd;
  letter-spacing: -.01em;
}

.section-header h2::after {
  width: 104px;
  height: 2px;
  background: linear-gradient(90deg, transparent, #8a5a2b, #c9a24b, #f0d78c, #c9a24b, #8a5a2b, transparent) !important;
  background-size: 200% 100%;
}

.section-header p,
.page-hero p {
  color: #a49a86;
}

.page-hero {
  background:
    radial-gradient(ellipse at 50% 0%, rgba(201, 162, 75, .10), transparent 62%),
    linear-gradient(180deg, rgba(8, 12, 22, .6), transparent) !important;
  border-bottom: 1px solid rgba(201, 162, 75, .16) !important;
}

/* ---------- Kartlar ---------- */
.tool-card,
.service-card,
.feature-card,
.blog-card,
.news-card,
.team-card,
.analysis-card,
.editor-card,
.video-card,
.content-box,
.stat-box,
.tech-banner,
.learning-promo .feature-item {
  border-radius: 6px !important;
  background: linear-gradient(158deg, rgba(13, 18, 32, .94), rgba(5, 8, 15, .92)) !important;
  border: 1px solid rgba(201, 162, 75, .16) !important;
  box-shadow: 0 18px 54px rgba(0, 0, 0, .38), inset 0 1px rgba(240, 215, 140, .05) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.tool-card:hover,
.service-card:hover,
.feature-card:hover,
.blog-card:hover,
.news-card:hover,
.team-card:hover,
.stat-box:hover {
  border-color: rgba(201, 162, 75, .50) !important;
  box-shadow: 0 30px 74px rgba(0, 0, 0, .52), 0 0 46px rgba(201, 162, 75, .10), inset 0 1px rgba(240, 215, 140, .10) !important;
}

.tool-card h3,
.service-card h3,
.blog-card h3,
.news-card h3,
.team-card h3,
.feature-item h3 {
  color: #f2ead8;
}

.tool-card p,
.service-card p,
.blog-card p,
.news-card p,
.team-card p,
.feature-item p {
  color: #a49a86;
}

.tool-icon {
  border-radius: 4px !important;
  color: #f0d78c !important;
  background: linear-gradient(135deg, rgba(201, 162, 75, .18), rgba(31, 111, 92, .12)) !important;
  border: 1px solid rgba(201, 162, 75, .34) !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, .07);
}

.tool-brand {
  border-radius: 4px !important;
  border: 1px solid rgba(201, 162, 75, .40) !important;
  box-shadow: 0 4px 14px rgba(201, 162, 75, .18) !important;
}

.team-avatar {
  background: linear-gradient(135deg, #f0d78c, #c9a24b 48%, #8a5a2b) !important;
  box-shadow: 0 0 40px rgba(201, 162, 75, .28), inset 0 1px rgba(255, 255, 255, .4) !important;
  border: 2px solid rgba(240, 215, 140, .35) !important;
}

.team-role {
  background: rgba(201, 162, 75, .10) !important;
  border-color: rgba(201, 162, 75, .34) !important;
  color: #f0d78c !important;
}

.team-tags span {
  border-color: rgba(201, 162, 75, .16) !important;
  background: rgba(201, 162, 75, .05) !important;
  color: #b7ad97 !important;
}

.stat-box .num { color: #f0d78c !important; font-variant-numeric: tabular-nums; }

/* ---------- CTA / bant ---------- */
.cta-band {
  border-radius: 8px !important;
  background:
    radial-gradient(ellipse at 20% 0%, rgba(201, 162, 75, .14), transparent 58%),
    linear-gradient(135deg, rgba(13, 18, 32, .96), rgba(8, 12, 22, .96)) !important;
  border: 1px solid rgba(201, 162, 75, .30) !important;
  box-shadow: 0 26px 70px rgba(0, 0, 0, .40), inset 0 1px rgba(240, 215, 140, .08) !important;
}

.cta-band h2 { color: #f4eedd; }

/* ---------- Footer ---------- */
.site-footer {
  background: linear-gradient(180deg, rgba(4, 6, 13, .60), #04060d) !important;
  border-top: 1px solid rgba(201, 162, 75, .20) !important;
}

.footer-col h4 {
  color: #c9a24b !important;
  letter-spacing: 2px;
}

.footer-col a { color: #a49a86; }
.footer-col a:hover { color: #f0d78c; }

.footer-bottom {
  border-top: 1px solid rgba(201, 162, 75, .12);
  color: #8d8472;
}

/* ---------- Formlar ---------- */
.form-group input,
.form-group textarea,
.form-group select {
  background: rgba(8, 12, 22, .85) !important;
  border: 1px solid rgba(201, 162, 75, .18) !important;
  border-radius: 4px !important;
  color: #f2ead8 !important;
}
.form-group input:focus,
.form-group textarea:focus,
.form-group select:focus {
  border-color: rgba(201, 162, 75, .70) !important;
  box-shadow: 0 0 0 3px rgba(201, 162, 75, .10);
}

/* ---------- Dekoratif effektler ---------- */
.gx-orb {
  background: #c9a24b !important;
  opacity: .055 !important;
}
.gx-orb.orb-two {
  background: #1f6f5c !important;
}

.gx-scroll-progress span {
  background: linear-gradient(90deg, #8a5a2b, #c9a24b, #f0d78c, #1f6f5c) !important;
  box-shadow: 0 0 16px rgba(201, 162, 75, .45) !important;
}

.brand-badge {
  background: rgba(8, 12, 22, .55) !important;
  border: 1px solid rgba(201, 162, 75, .18) !important;
  color: #e8e2d2 !important;
}
.brand-badge:hover {
  border-color: rgba(201, 162, 75, .50) !important;
  box-shadow: 0 12px 34px rgba(201, 162, 75, .08) !important;
}

.tech-banner {
  background:
    radial-gradient(ellipse at 12% 0%, rgba(201, 162, 75, .12), transparent 55%),
    linear-gradient(135deg, rgba(13, 18, 32, .95), rgba(5, 8, 15, .95)) !important;
  border: 1px solid rgba(201, 162, 75, .28) !important;
}

/* ---------- Dil seçici konumu ---------- */
.nav-inner .g3-lang { margin-left: 10px; }
#gazanci-brand-bar .g3-lang { margin-left: 10px; }
#bar .g3-lang { margin-left: 10px; }

/* Geniş ekranlarda gezinme tek satırda kalsın */
@media (min-width: 1080px) {
  .nav-inner { padding-left: 20px; padding-right: 20px; }
  .nav-links { gap: 2px; row-gap: 0; }
  .nav-links a { font-size: .78rem; padding: 7px 8px; }
  .nav-cta { padding: 8px 13px !important; }
}

/* ---------- Mobil ---------- */
@media (max-width: 900px), (pointer: coarse) {
  .hero::after { opacity: .05; }
  .site-header { background: rgba(4, 6, 13, .98) !important; }
  .tool-card, .service-card, .feature-card, .blog-card, .news-card, .team-card,
  .analysis-card, .editor-card, .video-card, .content-box {
    box-shadow: 0 12px 34px rgba(0, 0, 0, .35), inset 0 1px rgba(240, 215, 140, .05) !important;
  }
}

/* ---------- Arapça / RTL ---------- */
html[dir="rtl"] .nav-inner { direction: rtl; }
html[dir="rtl"] .footer-inner { direction: rtl; }
html[dir="rtl"] .footer-bottom { direction: rtl; }
html[dir="rtl"] .g3-lang { margin-left: 0; margin-right: 10px; }