/* ═══════════════════════════════════════════════════════════════════════════
   ÖZTÜRK MEDİALAB — EDİTÖRYEL ÖNİZLEME
   Renk / font kaynağı: taste-editorial şablonu (opendesigner.io)
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── 0. FONT IMPORT ──────────────────────────────────────────────────────── */
@import url('https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=Inter+Tight:wght@400;500;600&family=JetBrains+Mono:wght@400;500&display=swap');

/* ── 1. TOKEN OVERRIDE ───────────────────────────────────────────────────── */
:root {
  /* Şablondan birebir */
  --canvas:   #FBFBFA;
  --surface:  #FFFFFF;
  --ink:      #1A1A19;
  --muted:    #787774;
  --hairline: #EAEAEA;

  /* Şablon semantik renkler */
  --pale-green-bg: #EDF3EC; --pale-green-fg: #346538;
  --pale-blue-bg:  #E1F3FE; --pale-blue-fg:  #1F6C9F;
  --pale-red-bg:   #FDEBEC; --pale-red-fg:   #9F2F2D;
  --pale-yellow-bg:#FBF3DB; --pale-yellow-fg:#956400;

  /* Mevcut site değişkenlerini şablon değerleriyle ezeriz */
  --bg-primary:    var(--canvas);
  --bg-secondary:  var(--canvas);
  --bg-card:       var(--surface);
  --bg-card-hover: var(--canvas);
  --bg-dark:       var(--ink);
  --gold:          var(--ink);
  --gold-light:    var(--muted);
  --gold-dark:     var(--ink);
  --gold-glow:     transparent;
  --text-primary:  var(--ink);
  --text-secondary:var(--ink);
  --text-muted:    var(--muted);
  --border-gold:   var(--hairline);
  --border-subtle: var(--hairline);
  --font-serif:    'Instrument Serif', 'Newsreader', Georgia, serif;
  --font-sans:     'Inter Tight', 'Switzer', system-ui, sans-serif;
  --font-mono:     'JetBrains Mono', 'Geist Mono', ui-monospace, monospace;
  --radius:        0px;
  --radius-sm:     0px;
  --transition:    0.2s cubic-bezier(0.16,1,0.3,1);
  --max-width:     1120px;
}

/* ── 2. TEMEL ────────────────────────────────────────────────────────────── */
html { scroll-behavior: smooth; }

body {
  background: var(--canvas);
  color: var(--ink);
  font-family: var(--font-sans);
  font-size: 16px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* Fade-up animasyonu — şablonun .reveal davranışı */
.fade-up { opacity: 0; transform: translateY(12px); transition: opacity 600ms cubic-bezier(0.16,1,0.3,1), transform 600ms cubic-bezier(0.16,1,0.3,1); }
.fade-up.visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .fade-up { opacity: 1; transform: none; transition: none; } }

.container { max-width: var(--max-width); margin: 0 auto; padding: 0 32px; }

/* Section header */
.section-header { text-align: center; max-width: 640px; margin: 0 auto 56px; }
.section-header h2 { color: var(--ink); margin-bottom: 12px; }
.section-header p { color: var(--muted); font-size: 14.5px; }

/* Şablondaki ◆ yerine hairline çizgi; ◆ işaretini gizleme yerine renklendirme */
.gold-divider { color: var(--hairline); }
.gold-divider span { font-size: 0.6rem; }

/* Eyebrow / label — şablonun .eyebrow pill stili */
p.label, .label, .section-eyebrow {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-family: var(--font-mono) !important;
  font-size: 11px !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: var(--muted) !important;
  padding: 4px 10px !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 999px !important;
  background: var(--surface) !important;
  margin-bottom: 18px !important;
}

/* ── 3. BUTTONS ──────────────────────────────────────────────────────────── */
.btn {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--font-sans) !important;
  font-size: 14px !important; font-weight: 500 !important;
  padding: 13px 22px !important;
  border-radius: 8px !important;
  cursor: pointer;
  transition: transform 200ms cubic-bezier(0.16,1,0.3,1), box-shadow 200ms ease;
  text-decoration: none;
}
.btn:active { transform: scale(0.98); }

.btn-gold, .btn-primary {
  background: var(--ink) !important;
  color: var(--canvas) !important;
  border: 1px solid var(--ink) !important;
}
.btn-gold:hover, .btn-primary:hover { background: #2A2A28 !important; }

.btn-outline, .btn-ghost {
  background: transparent !important;
  color: var(--ink) !important;
  border: 1px solid var(--hairline) !important;
}
.btn-outline:hover, .btn-ghost:hover { border-color: var(--ink) !important; }

/* ── 4. NAVİGASYON ───────────────────────────────────────────────────────── */
.navbar {
  background: rgba(251,251,250,0.88) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  border-bottom: 1px solid var(--hairline) !important;
  box-shadow: none !important;
}

/* Logo: efekt sıfırlama — şeffaf arka planlı rozet, hiçbir efekt eklenmez */
.nav-logo img,
.footer-brand .nav-logo img,
.footer-brand img,
.hero-logo {
  opacity: 1 !important;
  filter: none !important;
  mix-blend-mode: normal !important;
  -webkit-filter: none !important;
  background: none !important;
  border: none !important;
  box-shadow: none !important;
}

/* Logo alanı — canlı sitedeki CSS birebir, şablon stilinden muaf */
.nav-logo { gap: 12px !important; }
.nav-logo img { width: 64px !important; height: 64px !important; object-fit: contain !important; }
.nav-logo-text { line-height: 1.2 !important; }

.nav-logo-name,
.navbar .nav-logo-name {
  font-family: 'Playfair Display', Georgia, serif !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  color: var(--ink) !important;
  letter-spacing: normal !important;
  font-style: normal !important;
}

.nav-logo-sub,
.navbar .nav-logo-sub {
  font-family: 'Playfair Display', Georgia, serif !important;
  font-style: italic !important;
  font-size: 0.78rem !important;
  letter-spacing: 0.02em !important;
  background: none !important;
  -webkit-background-clip: unset !important;
  background-clip: unset !important;
  -webkit-text-fill-color: #8C6424 !important;
  color: #8C6424 !important;
  opacity: 1 !important;
}

.nav-links a {
  color: var(--ink) !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  letter-spacing: normal !important;
}
.nav-links a:hover { color: var(--muted) !important; }

/* Dil switcher: container arka planı şeffaf, yazılar görünür */
.lang-switcher {
  background: rgba(26,26,25,0.06) !important;
  border-color: var(--hairline) !important;
}
.lang-switcher button {
  color: var(--ink) !important;
  background: none !important;
  border: none !important;
  font-family: var(--font-mono) !important;
  font-size: 11px !important;
  letter-spacing: 0.1em !important;
}
.lang-switcher button.active {
  background: var(--ink) !important;
  color: var(--canvas) !important;
}
.lang-switcher button:hover:not(.active) { color: var(--muted) !important; }

.nav-toggle span { background: var(--ink) !important; transition: transform 0.3s ease, opacity 0.3s ease !important; }
.navbar .btn-outline {
  border-radius: 999px !important;
  padding: 8px 16px !important;
  font-size: 13px !important;
  letter-spacing: normal !important;
  border-color: var(--hairline) !important;
  color: var(--ink) !important;
}
.navbar .btn-outline:hover { border-color: var(--ink) !important; }

/* Hamburger → X animasyonu */
.nav-toggle.open span:nth-child(1) { transform: rotate(45deg) translate(5px, 5px) !important; }
.nav-toggle.open span:nth-child(2) { opacity: 0 !important; transform: scaleX(0) !important; }
.nav-toggle.open span:nth-child(3) { transform: rotate(-45deg) translate(5px, -5px) !important; }

/* Mobil menü öğeleri (dil & CTA) nav-links'te masaüstünde gizli */
li.nav-mobile-lang, li.nav-mobile-cta { display: none !important; }

@media (max-width: 768px) {
  /* Mobil logo: amblem 52px, isim ve motto göster */
  .nav-logo img { width: 52px !important; height: 52px !important; }
  .nav-logo-text { display: flex !important; flex-direction: column !important; min-width: 0 !important; }
  .nav-logo-name { font-size: 17px !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; }
  .nav-logo-sub { white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; }
  .nav-logo { max-width: calc(100% - 52px) !important; }
  /* Dil switcher'ı nav-right'tan gizle, hamburger kalsın */
  .nav-right .lang-switcher { display: none !important; }

  /* Kapalı menü */
  .nav-links { background: var(--canvas) !important; border-bottom: none !important; }

  /* Açık panel — header'ın altından başlar */
  .nav-links.open {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    position: fixed !important;
    top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 100vh !important;
    background: #FBFBFA !important;
    z-index: 10000 !important;
    padding-top: 112px !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-bottom: 32px !important;
    gap: 0 !important;
    overflow-y: auto !important;
    box-sizing: border-box !important;
  }
  .nav-links.open li {
    border-bottom: 1px solid var(--hairline) !important;
    list-style: none !important;
  }
  .nav-links.open li:last-child { border-bottom: none !important; }
  .nav-links.open a,
  .nav-links.open li > a {
    display: block !important;
    font-family: var(--font-sans) !important;
    font-size: 1rem !important;
    font-weight: 500 !important;
    color: var(--ink) !important;
    letter-spacing: normal !important;
    text-align: left !important;
    padding: 16px 24px !important;
    line-height: 1.4 !important;
  }
  .nav-links.open a:hover,
  .nav-links.open li > a:hover { color: var(--muted) !important; background: none !important; }

  /* Mobil CTA öğesi */
  .nav-links.open .nav-mobile-cta {
    border-bottom: none !important;
    padding: 20px 24px 8px !important;
    margin-top: 8px !important;
  }
  .nav-links.open .nav-mobile-cta .btn {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    font-family: var(--font-sans) !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    letter-spacing: normal !important;
    padding: 14px !important;
    border-radius: 8px !important;
    background: var(--ink) !important;
    color: var(--canvas) !important;
    border: 2px solid var(--ink) !important;
    cursor: pointer !important;
  }

  /* Mobil menü öğeleri mobilde göster */
  .nav-links.open li.nav-mobile-lang,
  .nav-links.open li.nav-mobile-cta { display: block !important; }

  /* Mobil menü: dil switcher öğesi (en üstte) */
  .nav-links.open .nav-mobile-lang {
    padding: 14px 24px !important;
  }
  .nav-links.open .nav-mobile-lang .lang-switcher {
    display: inline-flex !important;
  }
}

/* ── 5. HERO ─────────────────────────────────────────────────────────────── */
.hero {
  background: var(--canvas) !important;
  border-bottom: 1px solid var(--hairline) !important;
  padding-bottom: 88px !important;
}

/* Dekoratif öğeler gizle */
.hero-bg, .hero-bg-grid, .hero-lattice, .hero-scroll { display: none !important; }

.hero-content { max-width: 820px; }

/* Eyebrow — şablonun pill stili */
.hero-eyebrow {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-family: var(--font-mono) !important;
  font-size: 11px !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: var(--muted) !important;
  padding: 5px 12px !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 999px !important;
  background: var(--surface) !important;
  margin-bottom: 22px !important;
}
/* Eyebrow önündeki çizgi kaldır */
.hero-eyebrow::before { display: none !important; }

.hero-title {
  font-family: var(--font-serif) !important;
  font-size: clamp(48px, 7vw, 88px) !important;
  font-weight: 400 !important;
  line-height: 1.02 !important;
  letter-spacing: -0.025em !important;
  color: var(--ink) !important;
  margin: 0 0 24px !important;
}
/* Vurgulu <em> — altın ton */
.hero-title em {
  font-style: italic !important;
  color: #AA7A2D !important;
}

.hero-subtitle {
  font-size: 18.5px !important;
  color: var(--muted) !important;
  max-width: 52ch !important;
  margin-bottom: 36px !important;
  line-height: 1.55 !important;
}

.hero-note {
  font-family: var(--font-mono) !important;
  font-size: 12px !important;
  letter-spacing: 0.06em !important;
  color: #5C5A59 !important;
  margin-top: 16px !important;
  margin-bottom: 48px !important;
}

.hero-founder-card {
  background: var(--surface) !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 8px !important;
  padding: 16px 20px !important;
  max-width: 400px !important;
  box-shadow: none !important;
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
}
.hero-founder-card__name  { color: var(--ink) !important; font-weight: 500 !important; font-size: 14px !important; }
.hero-founder-card__role  { color: var(--muted) !important; font-size: 12px !important; }
.hero-founder-card__creds {
  font-family: var(--font-mono) !important;
  font-size: 10.5px !important;
  letter-spacing: 0.08em !important;
  color: var(--muted) !important;
}

/* ── 6. MARQUEE ──────────────────────────────────────────────────────────── */
.marquee-section {
  background: var(--canvas) !important;
  border-top: none !important;
  border-bottom: 1px solid var(--hairline) !important;
}
.marquee-item { color: var(--muted) !important; font-family: var(--font-mono) !important; font-size: 11px !important; letter-spacing: 0.1em !important; text-transform: uppercase !important; }
.marquee-sep  { color: var(--hairline) !important; }

/* ── 7. HİZMETLER ────────────────────────────────────────────────────────── */
#services {
  background: var(--canvas) !important;
  border-bottom: 1px solid var(--hairline) !important;
  padding: 88px 0 !important;
}

.services-grid {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 0 !important;
  border: 1px solid var(--hairline) !important;
  background: var(--hairline) !important;
}

.service-card {
  display: grid !important;
  grid-template-columns: 52px 1fr auto !important;
  align-items: start !important;
  gap: 28px !important;
  padding: 32px 28px !important;
  background: var(--surface) !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  transition: background 0.15s ease !important;
}
.service-card:hover { background: var(--canvas) !important; transform: none !important; }

.service-num {
  font-family: var(--font-mono) !important;
  font-size: 11px !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: var(--muted) !important;
  padding-top: 3px !important;
  background: none !important; border: none !important; border-radius: 0 !important;
  width: auto !important; height: auto !important; text-align: left !important;
}

.service-card h3 {
  font-family: var(--font-serif) !important;
  font-size: 20px !important; font-weight: 400 !important;
  color: var(--ink) !important;
  letter-spacing: -0.015em !important;
  margin-bottom: 6px !important;
}
.service-card p { font-size: 14px !important; color: var(--muted) !important; line-height: 1.6 !important; margin: 0 !important; }

.service-tag {
  font-family: var(--font-mono) !important;
  font-size: 10.5px !important; letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  padding: 3px 8px !important;
  background: var(--canvas) !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 999px !important;
  color: var(--muted) !important;
  white-space: nowrap;
  align-self: center;
}

@media (max-width: 640px) {
  .service-card {
    grid-template-columns: 40px 1fr !important;
    gap: 6px 12px !important;
  }
  .service-card p {
    grid-column: 1 / -1 !important;
    margin-top: 6px !important;
  }
  .service-tag {
    display: block !important;
    grid-column: 1 / -1 !important;
    margin-top: 8px !important;
  }
}

/* ── 8. STATS ────────────────────────────────────────────────────────────── */
.stats-bar {
  background: var(--canvas) !important;
  border-top: 1px solid var(--hairline) !important;
  border-bottom: 1px solid var(--hairline) !important;
  padding: 88px 0 !important;
}
.stats-grid {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 0 !important;
  border: 1px solid var(--hairline) !important;
  background: var(--hairline) !important;
}
@media (min-width: 768px) { .stats-grid { grid-template-columns: repeat(4, 1fr) !important; } }
.stat-item {
  text-align: left !important;
  background: var(--surface) !important;
  padding: 32px 28px !important;
}
.stat-number {
  font-family: var(--font-serif) !important;
  font-size: clamp(2.4rem, 5vw, 3.8rem) !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  color: var(--ink) !important;
}
.stat-suffix { font-family: var(--font-serif) !important; font-size: 1.6rem !important; color: var(--muted) !important; }
.stat-label {
  font-family: var(--font-mono) !important;
  font-size: 11px !important; letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  color: var(--muted) !important;
  margin-top: 8px !important;
}

/* ── 9. MANİFESTO ────────────────────────────────────────────────────────── */
.manifesto {
  background: var(--canvas) !important;
  border-bottom: 1px solid var(--hairline) !important;
  padding: 88px 0 !important;
}
.manifesto-inner { display: grid; grid-template-columns: 1fr; gap: 64px; }
@media (min-width: 768px) { .manifesto-inner { grid-template-columns: 1fr 1fr; gap: 80px; align-items: start; } }

.manifesto-text h2 {
  font-family: var(--font-serif) !important;
  font-size: clamp(28px, 4vw, 44px) !important;
  font-weight: 400 !important;
  letter-spacing: -0.02em !important;
  color: var(--ink) !important;
  margin-bottom: 16px !important;
  line-height: 1.1 !important;
}
.manifesto-text p { color: var(--muted) !important; font-size: 14.5px !important; margin-bottom: 12px !important; line-height: 1.6 !important; }

.manifesto-pillars { display: flex; flex-direction: column; gap: 0; border: 1px solid var(--hairline); background: var(--hairline); }
.pillar {
  display: flex !important; gap: 20px !important;
  padding: 24px 24px !important;
  background: var(--surface) !important;
  border: none !important; border-radius: 0 !important; box-shadow: none !important;
}
.pillar:hover { background: var(--canvas) !important; transform: none !important; }
.pillar-num {
  font-family: var(--font-mono) !important;
  font-size: 11px !important; letter-spacing: 0.12em !important; text-transform: uppercase !important;
  color: var(--muted) !important;
  width: 32px !important; flex-shrink: 0 !important; padding-top: 3px !important;
  background: none !important; border: none !important; border-radius: 0 !important;
}
.pillar-content h4 { font-size: 14px !important; font-weight: 600 !important; color: var(--ink) !important; margin-bottom: 4px !important; letter-spacing: -0.005em !important; }
.pillar-content p  { font-size: 13.5px !important; color: var(--muted) !important; line-height: 1.6 !important; margin: 0 !important; }

/* ── 10. ALINTI ──────────────────────────────────────────────────────────── */
.quote-section {
  background: var(--canvas) !important;
  border-bottom: 1px solid var(--hairline) !important;
  padding: 88px 0 !important;
}
.quote-text {
  font-family: var(--font-serif) !important;
  font-size: clamp(28px, 4vw, 48px) !important;
  font-weight: 400 !important;
  font-style: italic !important;
  color: var(--ink) !important;
  line-height: 1.15 !important;
  max-width: 800px !important;
  margin-bottom: 20px !important;
  border: none !important; padding: 0 !important; background: none !important;
  letter-spacing: -0.02em !important;
}
.quote-author {
  font-family: var(--font-mono) !important;
  font-size: 11px !important; letter-spacing: 0.1em !important; text-transform: uppercase !important;
  color: var(--muted) !important;
}

/* ── 11. KURUCU ──────────────────────────────────────────────────────────── */
.founder {
  background: var(--canvas) !important;
  border-bottom: 1px solid var(--hairline) !important;
  padding: 88px 0 !important;
}
.founder-inner { display: flex; flex-direction: column; gap: 0; }
/* Mobil sıra: fotoğraf(1) → içerik(2) → eğitim listesi(3) → buton(4) */
.founder-photo-wrap  { order: 1; }
.founder-content     { order: 2; margin-top: 32px; }
.founder-creds-mobile { order: 3; width: 100%; margin-top: 24px; }
.founder-cta-mobile  { order: 4; width: 100%; margin-top: 24px; }
/* Credentials: fotoğrafın içindeki gizlendi, yeni sibling'de gösterildi */
.founder-credentials { display: none; }
.founder-creds-mobile .founder-credentials { display: block; margin-top: 0; width: 100%; }
/* Mobilde founder-content içindeki buton gizle, ayrı founder-cta-mobile göster */
@media (max-width: 767px) {
  .founder-cta-btn { display: none !important; }
  .founder-cta-mobile { display: block; }
}
@media (min-width: 768px) {
  .founder-inner {
    display: grid;
    grid-template-columns: 280px 1fr;
    grid-template-rows: auto auto;
    column-gap: 72px;
    row-gap: 0;
    align-items: start;
  }
  .founder-photo-wrap  { grid-column: 1; grid-row: 1; order: unset; }
  .founder-creds-mobile { grid-column: 1; grid-row: 2; margin-top: 0; width: auto; order: unset; }
  .founder-content     { grid-column: 2; grid-row: 1 / span 2; margin-top: 0; order: unset; }
  .founder-credentials { display: none; }
  .founder-creds-mobile .founder-credentials { display: block; }
  .founder-cta-btn  { display: block !important; }
  .founder-cta-mobile { display: none !important; }
}

.founder-photo { width: 100%; max-width: 280px; aspect-ratio: 3/4; object-fit: cover; object-position: top; border-radius: 0 !important; }

.founder-credentials { margin-top: 16px; }
.credential {
  display: flex; align-items: flex-start; gap: 12px;
  padding: 12px 0;
  border-bottom: 1px solid var(--hairline) !important;
  font-size: 13px; color: var(--muted);
  background: none !important; border-radius: 0 !important; border-left: none !important;
}
.credential:first-child { border-top: 1px solid var(--hairline); }
.credential-dot { width: 4px; height: 4px; border-radius: 50%; background: var(--muted); flex-shrink: 0; margin-top: 7px; }

.founder-content h2 {
  font-family: var(--font-serif) !important;
  font-size: clamp(28px, 4vw, 44px) !important;
  font-weight: 400 !important; letter-spacing: -0.025em !important;
  color: var(--ink) !important; margin-bottom: 4px !important; line-height: 1.05 !important;
}
.founder-title {
  font-family: var(--font-mono) !important;
  font-size: 11px !important; letter-spacing: 0.12em !important; text-transform: uppercase !important;
  color: var(--muted) !important; display: block; margin-bottom: 24px !important;
}

.founder-quote {
  font-family: var(--font-serif) !important;
  font-style: italic !important;
  font-size: 17px !important;
  color: var(--ink) !important;
  border-left: 2px solid var(--hairline) !important;
  padding-left: 18px !important;
  margin-bottom: 22px !important;
  background: none !important; border-radius: 0 !important;
  line-height: 1.55 !important;
}

.founder-content > p { font-size: 14.5px !important; color: var(--muted) !important; margin-bottom: 12px !important; line-height: 1.6 !important; }

.skills-grid { display: flex !important; flex-wrap: wrap !important; gap: 6px !important; margin-top: 24px; }
.skill-item {
  font-family: var(--font-mono) !important;
  font-size: 10.5px !important; letter-spacing: 0.08em !important; text-transform: uppercase !important;
  padding: 3px 8px !important;
  background: var(--canvas) !important; border: 1px solid var(--hairline) !important;
  color: var(--muted) !important; border-radius: 999px !important;
}

/* ── 12. SÜREÇ ───────────────────────────────────────────────────────────── */
#process {
  background: var(--canvas) !important;
  border-bottom: 1px solid var(--hairline) !important;
  padding: 88px 0 !important;
}
.process-steps { display: flex; flex-direction: column; border: 1px solid var(--hairline); background: var(--hairline); }
.process-step {
  display: grid !important; grid-template-columns: 52px 1fr !important; gap: 28px !important;
  padding: 32px 28px !important;
  background: var(--surface) !important;
  border: none !important; border-radius: 0 !important; box-shadow: none !important;
}
.process-step:hover { background: var(--canvas) !important; }
.step-num {
  font-family: var(--font-mono) !important;
  font-size: 11px !important; font-weight: 500 !important; letter-spacing: 0.12em !important;
  color: var(--muted) !important;
  width: 36px !important; height: 36px !important;
  display: flex; align-items: center; justify-content: center;
  border: 1px solid var(--hairline) !important;
  background: var(--canvas) !important; border-radius: 0 !important;
  flex-shrink: 0 !important;
}
.step-line { display: none !important; }
.step-right h3 {
  font-family: var(--font-serif) !important;
  font-size: 20px !important; font-weight: 400 !important;
  color: var(--ink) !important; margin-bottom: 8px !important; letter-spacing: -0.015em !important;
}
.step-right p  { font-size: 14px !important; color: var(--muted) !important; line-height: 1.6 !important; margin: 0 !important; }

/* ── 13. SSS ─────────────────────────────────────────────────────────────── */
#faq {
  background: var(--canvas) !important;
  border-top: none !important;
  border-bottom: 1px solid var(--hairline) !important;
  padding: 88px 0 !important;
}
.faq-list { max-width: 720px; margin: 0 auto; }
.faq-item {
  background: transparent !important; border: none !important;
  border-bottom: 1px solid var(--hairline) !important; border-radius: 0 !important;
}
.faq-item:first-child { border-top: 1px solid var(--hairline); }
.faq-question {
  width: 100%; display: flex; justify-content: space-between; align-items: center;
  padding: 20px 0 !important; background: none !important; border: none !important;
  text-align: left;
  font-family: var(--font-serif) !important;
  font-size: 17px !important; font-weight: 400 !important;
  color: var(--ink) !important; cursor: pointer; gap: 16px;
  transition: color 0.15s ease;
}
.faq-question:hover { color: var(--muted) !important; }
.faq-icon { font-size: 1rem !important; color: var(--muted) !important; flex-shrink: 0; transition: transform 0.2s ease; font-family: var(--font-mono) !important; }
.faq-item.open .faq-icon { transform: rotate(45deg); }
.faq-answer { max-height: 0; overflow: hidden; transition: max-height .4s ease; }
.faq-item.open .faq-answer { max-height: 500px; }
.faq-answer-inner { font-size: 14px !important; color: var(--muted) !important; line-height: 1.7 !important; padding: 0 0 20px !important; }

/* ── 14. MARKALAR ────────────────────────────────────────────────────────── */
#brands {
  background: var(--canvas) !important;
  padding: 88px 0 !important;
  border-top: 1px solid var(--hairline) !important;
  border-bottom: 1px solid var(--hairline) !important;
}
#brands .section-eyebrow, #brands p.label { color: var(--muted) !important; }
#brands .section-title, #brands h2 { color: var(--ink) !important; }
#brands span[style] { color: var(--muted) !important; }

/* ── 15. İLETİŞİM & FORM ─────────────────────────────────────────────────── */
.contact {
  background: var(--canvas) !important;
  border-bottom: 1px solid var(--hairline) !important;
  padding: 88px 0 !important;
}
.contact-inner { display: grid; grid-template-columns: 1fr; gap: 64px; }
@media (min-width: 768px) { .contact-inner { grid-template-columns: 1fr 1fr; gap: 72px; align-items: start; } }
.contact-info h2 {
  font-family: var(--font-serif) !important;
  font-size: clamp(24px, 4vw, 40px) !important; font-weight: 400 !important;
  letter-spacing: -0.02em !important; color: var(--ink) !important;
  margin-bottom: 12px !important; line-height: 1.1 !important;
}
.contact-info p { color: var(--muted) !important; font-size: 14.5px !important; line-height: 1.6 !important; }

.contact-detail {
  display: flex; align-items: center; gap: 14px;
  padding: 16px 16px !important;
  overflow: hidden !important;
  border-bottom: 1px solid var(--hairline) !important;
  text-decoration: none; color: var(--ink) !important;
  background: none !important; border-radius: 0 !important;
  font-size: 14px;
  box-shadow: none !important;
  transition: color 0.15s ease, border-color 0.15s ease;
}
.contact-detail:first-child { border-top: 1px solid var(--hairline); }
.contact-detail:hover { color: var(--muted) !important; }
/* Hover efekti yalnız fare cihazlarda */
@media (hover: hover) {
  .contact-detail:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15) !important;
  }
}
/* Dokunmatik cihazlarda kalıcı hover/gölge sıfırla */
@media (hover: none) {
  .contact-detail:hover, .contact-detail:focus {
    transform: none !important;
    box-shadow: none !important;
    border-color: var(--hairline) !important;
    color: var(--ink) !important;
  }
}
.contact-detail-icon { color: var(--muted) !important; }
.contact-detail-text strong { display: block; font-family: var(--font-mono) !important; font-size: 10px !important; letter-spacing: 0.12em !important; text-transform: uppercase !important; color: var(--muted) !important; margin-bottom: 2px !important; }

.contact-form {
  background: var(--surface) !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 0 !important;
  padding: 32px !important;
  box-shadow: none !important;
}

/* Form iç öğeler */
.oml-contact-form { background: transparent !important; }
.oml-form-title { font-family: var(--font-serif) !important; color: var(--ink) !important; font-size: 22px !important; font-weight: 400 !important; letter-spacing: -0.015em !important; }
.oml-form-subtitle { color: var(--muted) !important; font-size: 13.5px !important; }
.oml-scarcity-banner {
  background: var(--pale-yellow-bg) !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 8px !important;
  color: var(--pale-yellow-fg) !important;
  font-family: var(--font-mono) !important;
  font-size: 11px !important;
}

.oml-contact-form .form-group label {
  font-family: var(--font-mono) !important;
  font-size: 10.5px !important; letter-spacing: 0.1em !important; text-transform: uppercase !important;
  color: var(--muted) !important;
}

/* Form bölüm başlıkları — pill yerine düz metin (oml-sched-label gibi) */
.oml-contact-form .form-group p.label {
  display: block !important;
  background: none !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin-bottom: 8px !important;
}

/* Gün seçim kartları — sadece letter-spacing ve padding küçült (yazı tipi/stil değişmez) */
.oml-contact-form .form-group label.oml-day-card {
  letter-spacing: 0 !important;
  padding: 8px 4px !important;
}
.oml-contact-form .form-group label.oml-day-card.selected {
  color: var(--canvas) !important;
}
.oml-day-name {
  font-size: 10.5px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  line-height: 1.3 !important;
}
.oml-day-date {
  font-size: 9px !important;
  letter-spacing: 0 !important;
  line-height: 1.3 !important;
}
.oml-choice-card.selected .oml-day-date { color: var(--canvas) !important; }

.oml-contact-form input[type="text"],
.oml-contact-form input[type="email"],
.oml-contact-form input[type="tel"],
.oml-contact-form textarea {
  background: var(--canvas) !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 0 !important;
  color: var(--ink) !important;
  font-family: var(--font-sans) !important;
  font-size: 14px !important;
}
.oml-contact-form input::placeholder, .oml-contact-form textarea::placeholder { color: var(--muted) !important; }
.oml-contact-form input:focus, .oml-contact-form textarea:focus {
  border-color: var(--ink) !important;
  box-shadow: none !important; outline: none;
}

.oml-choice-card {
  background: var(--canvas) !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 8px !important;
  color: var(--ink) !important;
  font-size: 13.5px !important;
  box-shadow: none !important;
}
.oml-choice-card:hover { border-color: var(--ink) !important; background: var(--canvas) !important; }
.oml-choice-card.selected { background: var(--ink) !important; border-color: var(--ink) !important; color: var(--canvas) !important; }

.oml-char-count { color: var(--muted) !important; font-family: var(--font-mono) !important; font-size: 10px !important; }

.oml-contact-form button[type="submit"] {
  background: var(--ink) !important; color: var(--canvas) !important;
  border: 1px solid var(--ink) !important;
  border-radius: 8px !important;
  font-family: var(--font-sans) !important;
  font-size: 14px !important; font-weight: 500 !important;
}
.oml-contact-form button[type="submit"]:hover { background: #2A2A28 !important; }

.oml-error-msg { color: var(--pale-red-fg) !important; background: none !important; font-size: 12px !important; }

.form-success, .oml-form-success {
  background: var(--pale-green-bg) !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 8px !important;
  color: var(--ink) !important;
}
.form-success h3, .oml-form-success h3 { color: var(--ink) !important; font-family: var(--font-serif) !important; }
.form-success p, .oml-form-success p { color: var(--muted) !important; font-size: 14px !important; }

.oml-trust-line { color: var(--muted) !important; font-family: var(--font-mono) !important; font-size: 10.5px !important; letter-spacing: 0.06em !important; }

/* Modal */
.oml-modal-overlay { background: rgba(26,26,25,0.5) !important; }
.oml-modal {
  background: var(--canvas) !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}
/* × rail: modal kaydırılırken × daima üstte kalır */
.oml-close-rail {
  position: sticky;
  top: 0;
  height: 0;
  overflow: visible;
  z-index: 10;
}
.oml-modal-close {
  color: var(--muted) !important;
  /* tıklama alanı ≥44×44 px */
  padding: 12px 16px !important;
  z-index: 10 !important;
}
.oml-modal-close:hover { color: var(--ink) !important; }

/* ── POPUP FORM: kompakt boşluk — ilk hal sığsın (inline formlara dokunmaz) ── */
.oml-modal-overlay .oml-modal {
  padding: 20px 24px !important;
}
.oml-modal-overlay .form-group { margin-bottom: 8px !important; }
.oml-modal-overlay .form-row { gap: 10px !important; margin-bottom: 0 !important; }
.oml-modal-overlay .scarcity-note { margin-top: 0 !important; margin-bottom: 2px !important; }
.oml-modal-overlay h3 { margin-top: 0 !important; margin-bottom: 2px !important; }
.oml-modal-overlay .form-sub { margin-top: 0 !important; margin-bottom: 8px !important; }
.oml-modal-overlay .oml-contact-form textarea { min-height: 60px !important; }

/* ── POPUP FORM: 768px yüksekliğinde ekstra kompakt (1366x768 için) ── */
@media (max-height: 768px) {
  .oml-modal-overlay [data-oml-form] { padding-top: 0 !important; }
  .oml-modal-overlay .oml-contact-form .form-group p.label { margin-bottom: 4px !important; }
  .oml-modal-overlay .oml-contact-form textarea { min-height: 48px !important; height: 48px !important; }
}

/* ── POPUP FORM: sticky Gönder butonu ── */
.oml-modal-overlay .oml-form-footer {
  position: sticky;
  bottom: 0;
  background: var(--canvas);
  padding-top: 10px;
  z-index: 1;
}

/* ── 16. BLOG ────────────────────────────────────────────────────────────── */
#blog {
  background: var(--canvas) !important;
  border-top: 1px solid var(--hairline) !important;
  border-bottom: 1px solid var(--hairline) !important;
  padding: 88px 0 !important;
}

.blog-grid {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 0 !important;
  border: 1px solid var(--hairline) !important;
  background: var(--hairline) !important;
}
@media (min-width: 768px) { .blog-grid { grid-template-columns: repeat(3,1fr) !important; } }

.blog-card {
  background: var(--surface) !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 28px !important;
  margin: 0 !important;
}
.blog-card:hover { background: var(--canvas) !important; }

.blog-tag {
  font-family: var(--font-mono) !important;
  font-size: 10.5px !important; letter-spacing: 0.1em !important; text-transform: uppercase !important;
  color: var(--muted) !important; display: block; margin-bottom: 12px !important;
}
.blog-title {
  font-family: var(--font-serif) !important;
  font-size: 20px !important; font-weight: 400 !important;
  line-height: 1.25 !important; letter-spacing: -0.01em !important;
  color: var(--ink) !important; margin-bottom: 10px !important;
}
.blog-excerpt { font-size: 13.5px !important; color: var(--muted) !important; line-height: 1.65 !important; margin-bottom: 18px !important; }
.blog-read-more {
  font-family: var(--font-sans) !important;
  font-size: 13px !important; font-weight: 500 !important;
  color: var(--ink) !important; text-decoration: none !important;
  display: inline-flex; align-items: center; gap: 4px;
}
.blog-read-more:hover { color: var(--muted) !important; }

/* ── 17. MOTTO ───────────────────────────────────────────────────────────── */
.motto-section {
  background: var(--canvas) !important;
  border-bottom: 1px solid var(--hairline) !important;
  padding: 88px 0 !important;
  text-align: left;
}
.motto-heading {
  font-family: var(--font-serif) !important;
  font-size: clamp(48px, 8vw, 88px) !important;
  font-weight: 400 !important;
  line-height: 1.0 !important;
  letter-spacing: -0.025em !important;
  color: var(--ink) !important;
  margin: 16px 0 !important;
}
.motto-translate {
  font-family: var(--font-serif) !important;
  font-style: italic !important;
  color: var(--muted) !important;
  font-size: 18px !important;
  margin-bottom: 24px !important;
}
.motto-divider { color: var(--hairline) !important; }
.motto-body {
  max-width: 560px;
  font-size: 14.5px !important;
  color: var(--muted) !important;
  line-height: 1.7 !important;
  margin-bottom: 16px !important;
}
.motto-closing {
  font-family: var(--font-serif) !important;
  font-style: italic !important;
  color: var(--ink) !important;
  font-size: 17px !important;
}

/* ── 18. CTA ŞERİDİ ──────────────────────────────────────────────────────── */
.cta-strip {
  background: var(--ink) !important;
  padding: 88px 0 !important;
  border-bottom: none !important;
}
.cta-strip-content { max-width: 640px; margin: 0 auto; text-align: center; }
.cta-strip-content .label {
  background: transparent !important;
  border-color: rgba(251, 251, 250, 0.25) !important;
  color: rgba(251, 251, 250, 0.75) !important;
  opacity: 1 !important;
}
.cta-strip-title {
  font-family: var(--font-serif) !important;
  font-size: clamp(28px, 5vw, 52px) !important;
  font-weight: 400 !important;
  letter-spacing: -0.025em !important;
  color: var(--canvas) !important;
  margin-bottom: 12px !important;
  line-height: 1.05 !important;
}
.cta-strip-divider { color: rgba(251,251,250,.2) !important; }
.cta-strip-sub { font-size: 14.5px !important; color: rgba(251,251,250,.55) !important; margin-bottom: 32px !important; line-height: 1.6 !important; }
.cta-strip .scarcity-note { font-family: var(--font-mono) !important; font-size: 11px !important; letter-spacing: 0.06em !important; color: rgba(251,251,250,.60) !important; line-height: 1.6 !important; margin-top: 24px !important; }

/* CTA strip butonu — canvas üzerine yani ters renkler */
.cta-strip .btn-gold {
  background: var(--canvas) !important;
  color: var(--ink) !important;
  border: 1px solid var(--canvas) !important;
  border-radius: 8px !important;
}
.cta-strip .btn-gold:hover { background: #FFFFFF !important; }

/* ── 19. FOOTER ──────────────────────────────────────────────────────────── */
footer {
  background: var(--canvas) !important;
  border-top: 1px solid var(--hairline) !important;
  padding: 48px 0 32px !important;
  padding-bottom: 88px !important;
}
.footer-inner { display: grid; grid-template-columns: 1fr; gap: 48px; margin-bottom: 40px; }
@media (min-width: 768px) { .footer-inner { grid-template-columns: 1fr 1fr 1fr; gap: 40px; } }
/* Footer logo alanı — canlı sitedeki CSS birebir */
.footer-brand .nav-logo { gap: 12px !important; }
.footer-brand .nav-logo img { width: 64px !important; height: 64px !important; object-fit: contain !important; }
.footer-brand .nav-logo-text { line-height: 1.2 !important; }

.footer-brand .nav-logo-name {
  font-family: 'Playfair Display', Georgia, serif !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  color: var(--ink) !important;
  letter-spacing: normal !important;
  font-style: normal !important;
}

.footer-brand .nav-logo-sub {
  font-family: 'Playfair Display', Georgia, serif !important;
  font-style: italic !important;
  font-size: 0.78rem !important;
  letter-spacing: 0.02em !important;
  background: none !important;
  -webkit-background-clip: unset !important;
  background-clip: unset !important;
  -webkit-text-fill-color: #8C6424 !important;
  color: #8C6424 !important;
  opacity: 1 !important;
}
.footer-brand > p { font-size: 13px; color: var(--muted) !important; margin-top: 10px; }
.footer-col h4 {
  font-family: var(--font-mono) !important;
  font-size: 10.5px !important; letter-spacing: 0.14em !important; text-transform: uppercase !important;
  color: var(--muted) !important; margin-bottom: 16px !important; font-weight: 500 !important;
}
.footer-col a { font-size: 13.5px !important; color: var(--muted) !important; text-decoration: none; transition: color .15s ease; }
.footer-col a:hover { color: var(--ink) !important; }
.footer-contact-link { display: flex; align-items: center; gap: 8px; }
.footer-bottom {
  display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px;
  border-top: 1px solid var(--hairline) !important;
  padding-top: 20px !important;
}
.footer-bottom p { font-family: var(--font-mono) !important; font-size: 11px !important; color: var(--muted) !important; letter-spacing: 0.04em !important; }
.footer-bottom a { color: var(--muted) !important; text-decoration: none; font-family: var(--font-mono) !important; font-size: 11px !important; }
.footer-bottom a:hover { color: var(--ink) !important; }
.footer-motto { font-family: var(--font-serif) !important; font-style: italic !important; font-size: 13px !important; color: var(--muted) !important; }
.footer-deco { display: none !important; }

/* ── 20. ÇEREZ POPUP ─────────────────────────────────────────────────────── */
#cookieConsent {
  background: var(--ink) !important;
  border-top: 1px solid rgba(251,251,250,.12) !important;
  color: rgba(251,251,250,.7) !important;
}
#cookieAccept  { background: var(--canvas) !important; color: var(--ink) !important; border-radius: 8px !important; }
#cookieDecline { border-color: rgba(251,251,250,.2) !important; color: rgba(251,251,250,.5) !important; border-radius: 8px !important; background: transparent !important; }

/* ── 21. WHATSAPP FLOAT ──────────────────────────────────────────────────── */
.whatsapp-float {
  border-radius: 8px !important;
  background: var(--ink) !important;
  color: var(--canvas) !important;
  border-color: var(--ink) !important;
}
.whatsapp-float:hover {
  background: #2A2A28 !important;
  color: var(--canvas) !important;
}
.whatsapp-float svg { fill: currentColor !important; }
.whatsapp-float__text { font-family: var(--font-sans) !important; font-size: 13px !important; color: var(--canvas) !important; }

/* ── 22. SEKSIYON BAŞLIK ORTAK ────────────────────────────────────────────── */
h2 { font-family: var(--font-serif) !important; }

/* ── 23. DÜZELTMELER — 1 Ekim 2026 ─────────────────────────────────────── */
/* Task 7: "1'e 1" iç boşluk — metin değişmez, yalnızca kelimeler arası boşluk */
.stat-number[data-i18n="stats_one_on_one"] { word-spacing: 0.25em !important; }

/* Task 8: Portföy — mobilde iki logo küçük ve yan yana */
@media (max-width: 600px) {
  #brands .fade-up { gap: 24px !important; }
  #brands .fade-up > a > div { width: 96px !important; height: 96px !important; }
  .hero-title { font-size: 52px !important; line-height: 1.05 !important; }
  .cta-strip .scarcity-note { padding-left: 20px !important; padding-right: 20px !important; }
}