/* aeo.css — AEO/GEO bileşen stilleri (breadcrumb, özet, FAQ, AI-paylaş/cite)
   Tipografik dil: eyebrow + hairline + sade metin. Renkli callout yok.
   currentColor tabanlı; hem koyu (case) hem açık (servis) sayfalarda çalışır. */

/* --- Breadcrumb --- */
.breadcrumb {
  margin: 24px 0;
  font-size: 13px;
  letter-spacing: 0.04em;
  opacity: 0.75;
}
.breadcrumb__list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.breadcrumb__item {
  display: flex;
  align-items: center;
  gap: 8px;
}
.breadcrumb__item + .breadcrumb__item::before {
  content: "/";
  opacity: 0.5;
}
.breadcrumb__item a {
  color: inherit;
  text-decoration: none;
}
.breadcrumb__item a:hover {
  text-decoration: underline;
}
.breadcrumb__item [aria-current="page"] {
  opacity: 0.6;
}

/* --- Özet / TL;DR --- */
.aeo-summary {
  margin: 48px 0;
  padding-top: 24px;
  border-top: 1px solid;
  border-color: rgba(128, 128, 128, 0.28);
}
.aeo-summary__eyebrow {
  display: block;
  font-size: 12px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  opacity: 0.6;
  margin-bottom: 16px;
}
.aeo-summary__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 12px;
}
.aeo-summary__list li {
  position: relative;
  padding-left: 22px;
  font-size: 18px;
  line-height: 1.5;
}
.aeo-summary__list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.7em;
  width: 8px;
  height: 1px;
  background: currentColor;
  opacity: 0.5;
}

/* --- FAQ --- */
.aeo-faq {
  margin: 56px 0;
}
.aeo-faq__title {
  font-size: 28px;
  margin: 0 0 20px;
}
.aeo-faq__list {
  border-top: 1px solid;
  border-color: rgba(128, 128, 128, 0.28);
}
.aeo-faq__item {
  border-bottom: 1px solid;
  border-color: rgba(128, 128, 128, 0.28);
}
/* summary'yi flex yapmak Safari dahil tüm tarayıcılarda native marker'ı kaldırır */
.aeo-faq__q {
  cursor: pointer;
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 20px 4px 20px 0;
  font-size: 19px;
  line-height: 1.4;
  -webkit-tap-highlight-color: transparent;
  user-select: none;
  outline: none;
  transition: color 0.2s ease;
}
/* Native marker / disclosure üçgenini tüm motorlarda gizle */
.aeo-faq__q::-webkit-details-marker { display: none; }
.aeo-faq__q::marker { content: ""; font-size: 0; }
/* Tıklama/odakta KUTU YOK — global ":focus{box-shadow}" kuralını da ez (kutunun gerçek kaynağı) */
.aeo-faq__q:focus,
.aeo-faq__q:focus-visible { outline: none; box-shadow: none; }
.aeo-faq__item:focus,
.aeo-faq__item:focus-within { outline: none; box-shadow: none; }
/* +/- işareti (flex öğesi, absolute değil) */
.aeo-faq__q::after {
  content: "+";
  flex-shrink: 0;
  font-size: 24px;
  line-height: 1;
  opacity: 0.6;
  transition: opacity 0.2s ease, color 0.2s ease;
}
.aeo-faq__item[open] .aeo-faq__q::after { content: "–"; opacity: 1; color: #794BFC; }
/* Hover + açık durumda mor metin */
.aeo-faq__q:hover { color: #794BFC; }
.aeo-faq__item[open] > .aeo-faq__q { color: #794BFC; }
/* Cevap + açılış animasyonu (native <details> anlık açılır → fade+slide ile yumuşat) */
.aeo-faq__a {
  padding: 0 36px 24px 0;
  font-size: 17px;
  line-height: 1.6;
  opacity: 0.85;
}
.aeo-faq__item[open] .aeo-faq__a { animation: aeoFaqIn 0.34s cubic-bezier(0.22, 1, 0.36, 1); }
@keyframes aeoFaqIn {
  from { opacity: 0; transform: translateY(-8px); }
  to { opacity: 0.85; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
  .aeo-faq__item[open] .aeo-faq__a { animation: none; }
}

/* --- AI paylaş / cite --- */
.aeo-share {
  margin: 48px 0;
  padding-top: 24px;
  border-top: 1px solid;
  border-color: rgba(128, 128, 128, 0.28);
}
.aeo-share__eyebrow {
  display: block;
  font-size: 12px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  opacity: 0.6;
  margin-bottom: 16px;
}
.aeo-share__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}
.aeo-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 18px;
  font-size: 14px;
  letter-spacing: 0.02em;
  color: inherit;
  background: transparent;
  border: 1px solid;
  border-color: rgba(128, 128, 128, 0.45);
  border-radius: 999px;
  cursor: pointer;
  text-decoration: none;
  transition: border-color 0.2s ease, background-color 0.2s ease;
}
.aeo-btn:hover {
  border-color: currentColor;
  background-color: rgba(128, 128, 128, 0.12);
}
.aeo-btn.is-copied {
  border-color: currentColor;
}

/* --- Dil seçici (menü) --- */
/* Menü aralıklarını sıkılaştır (öğe sayısı arttı) */
.site-menu__scroller ul {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
}
.site-menu__scroller ul li {
  margin-bottom: 14px;
  line-height: 1.1;
  font-size: 26px;
}

/* Dil seçici: panelin dibine sabitlen + büyük menü stilinden ayrış (inline TR / EN) */
.site-menu__scroller ul li.lang-switch {
  margin-top: auto;        /* öğeleri yukarıda tut, dil seçiciyi dibe it */
  margin-bottom: 0;
  padding-top: 22px;
  font-size: 15px;
  letter-spacing: 0.04em;
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
.lang-switch .lang-switch__item {
  display: inline;
  width: auto;
  opacity: 0.4;
  text-decoration: none;
  color: #121212;
  text-align: right;
}
.lang-switch .lang-switch__item.is-active { opacity: 1; font-weight: 600; }
.lang-switch .lang-switch__item:hover { opacity: 1; }
.lang-switch .lang-switch__sep { opacity: 0.35; margin: 0 8px; }
/* nav hover davranışını dil seçicide iptal et (sağa-sola kayma + nokta) */
.site-menu__scroller ul li.lang-switch::before { display: none; }
.site-menu__scroller ul li.lang-switch:hover a { padding-right: 0; }

/* --- Erişilebilirlik: skip-link + focus görünürlüğü --- */
.skip-link {
  position: absolute;
  left: 12px;
  top: -48px;
  z-index: 10000;
  padding: 10px 18px;
  background: #0b0b0f;
  color: #fff;
  border-radius: 0 0 8px 8px;
  text-decoration: none;
  transition: top 0.18s ease;
}
.skip-link:focus { top: 0; outline: 2px solid #fff; outline-offset: 2px; }

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.001ms;
    animation-iteration-count: 1;
    transition-duration: 0.001ms;
    scroll-behavior: auto;
  }
  [data-aos] { opacity: 1; transform: none; }
}

/* --- Çerez onayı --- */
.cookie-consent {
  position: fixed;
  left: 16px;
  right: 16px;
  bottom: 16px;
  z-index: 9999;
  max-width: 720px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px;
  padding: 16px 20px;
  background: #0b0b0f;
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 12px;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.35);
}
.cookie-consent[hidden] { display: none; }
.cookie-consent__text { margin: 0; flex: 1 1 280px; font-size: 14px; line-height: 1.5; }
.cookie-consent__text a { color: #fff; text-decoration: underline; }
.cookie-consent__accept {
  flex: 0 0 auto;
  padding: 10px 22px;
  font: inherit;
  font-size: 14px;
  color: #0b0b0f;
  background: #fff;
  border: 1px solid #fff;
  border-radius: 999px;
  cursor: pointer;
}
.cookie-consent__accept:hover { background: rgba(255, 255, 255, 0.85); }

/* --- Politika sayfaları: hero + düz yazı --- */
/* Yasal sayfalar (gizlilik / çerez) — sitenin temiz koyu hero + okunur prose dili.
   Eski bg-görselli hero (alakasız ekran görüntüsü) kaldırıldı. */
.page-legal { font-family: 'Graphik', sans-serif; background: #f6f6f6; color: #121212; }
.policy-hero { background: #000; color: #fff; padding: 150px 0 60px; }
.policy-hero .svc-eyebrow { color: #b89bff; }
.policy-hero__title { font-size: clamp(32px, 5vw, 58px); font-weight: 500; line-height: 1.06; letter-spacing: -0.03em; margin: 16px 0 0; }
.policy-hero__updated { margin: 18px 0 0; font-size: 14px; letter-spacing: .02em; color: rgba(255,255,255,.55); }
.policy-body { padding: 64px 0 100px; }
.policy-prose { max-width: 760px; margin: 0 auto; }
.policy-prose p { font-size: 17px; line-height: 1.8; color: #2b2b2b; margin: 0 0 20px; }
.policy-prose p:first-child { font-size: 15px; color: #6a6a6a; background: #efeeec; border-radius: 10px; padding: 14px 18px; }
.policy-prose h2 { font-size: clamp(20px,2vw,26px); font-weight: 600; letter-spacing: -0.01em; color: #111; margin: 40px 0 14px; }
.policy-prose em { color: #8a8a8a; font-style: italic; }
.policy-prose a { color: #794BFC; text-decoration: underline; text-underline-offset: 2px; }
.policy-prose ul { margin: 0 0 20px; padding-left: 20px; }
.policy-prose li { font-size: 17px; line-height: 1.7; color: #2b2b2b; margin-bottom: 8px; }
@media (max-width: 768px) { .policy-hero { padding: 110px 0 48px; } .policy-body { padding: 48px 0 72px; } }

/* --- Hakkımızda hero metin kolonu: h1 + alıntılanabilir tanım --- */
#promo-about .row .col.promo-about__text {
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 26px;
}
#promo-about .row .col.promo-about__text h1.promo-text {
  color: #fff;
  font-family: 'Graphik', sans-serif;
  font-size: 56px;
  font-weight: 400;
  line-height: 60px;
  letter-spacing: -1.12px;
  margin: 0;
}
#promo-about .row .col.promo-about__text .hero-definition {
  color: rgba(255, 255, 255, 0.7);
  font-family: 'Graphik', sans-serif;
  font-size: 19px;
  font-weight: 400;
  line-height: 1.55;
  letter-spacing: 0;
  max-width: 540px;
  margin: 0;
}
@media (max-width: 768px) {
  #promo-about .row .col.promo-about__text h1.promo-text { font-size: 34px; line-height: 38px; }
  #promo-about .row .col.promo-about__text .hero-definition { font-size: 16px; }
}

/* --- Hakkımızda hero görseli: yumuşak kenar + radius + gölge --- */
#about-promo-image {
  border-radius: 20px;
  border: 1px solid rgba(255, 255, 255, 0.09);
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.55), 0 0 70px rgba(124, 92, 255, 0.12);
}

/* --- Hakkımızda ek bölümleri — site tasarım diline uyumlu (Graphik, koyu/açık ritmi) --- */
#about-manifesto, #about-vision, #about-values,
#about-stats, #about-testimonial, #about-faq, #about-cta {
  padding: 110px 0;
  font-family: 'Graphik', sans-serif;
}
/* Koyu bölümler */
#about-manifesto, #about-values, #about-testimonial {
  background: #000;
  color: #fff;
}
/* Kapanış CTA — marka moru */
#about-cta {
  background: #794BFC;
  color: #fff;
}
/* Açık bölümler */
#about-vision, #about-stats, #about-faq {
  background: #f6f6f6;
  color: #121212;
}

.about-eyebrow {
  display: block;
  font-family: 'Graphik', sans-serif;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  opacity: 0.45;
  margin-bottom: 28px;
}

/* Manifesto — iki kolon: solda büyük lead, sağda küçük destek */
#about-manifesto .row { display: flex; gap: 140px; align-items: flex-start; }
#about-manifesto .row .col:first-child { flex: 1.25; }
#about-manifesto .row .col:last-child { flex: 1; }
.about-manifesto__lead {
  font-family: 'Graphik', sans-serif;
  font-size: clamp(24px, 2.8vw, 38px);
  font-weight: 500;
  line-height: 1.22;
  letter-spacing: -0.02em;
  margin: 0;
}
.about-manifesto__support {
  font-family: 'Graphik', sans-serif;
  font-size: 19px;
  font-weight: 400;
  line-height: 1.65;
  letter-spacing: -0.01em;
  opacity: 0.66;
  margin: 0;
}

/* Vizyon — iki kolon, sitenin section-title/text dili */
#about-vision .row { display: flex; gap: 140px; }
#about-vision .row .col { flex: 1; }
#about-vision .section-title {
  color: #121212;
  font-size: clamp(28px, 3.4vw, 40px);
  font-weight: 500;
  line-height: 1.15;
  letter-spacing: -0.64px;
}
#about-vision .section-text { color: #121212; font-size: 20px; line-height: 28px; }

/* Değerler — koyu zemin, Graphik */
#about-values .section-title { color: #fff; }
.about-values__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 56px 80px;
  margin-top: 56px;
}
.about-value__title {
  font-family: 'Graphik', sans-serif;
  font-size: 24px;
  font-weight: 500;
  letter-spacing: -0.4px;
  margin: 0 0 12px;
  color: #fff;
}
.about-value__text {
  font-family: 'Graphik', sans-serif;
  font-size: 17px;
  line-height: 1.6;
  opacity: 0.62;
  margin: 0;
}

/* Sayılar — büyük Graphik rakamlar */
.about-stats__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  margin-top: 48px;
}
.about-stat { border-top: 1px solid rgba(18, 18, 18, 0.18); padding-top: 28px; }
.about-stat__no {
  font-family: 'Graphik', sans-serif;
  font-size: clamp(48px, 7vw, 84px);
  font-weight: 500;
  line-height: 1;
  letter-spacing: -0.03em;
  color: #121212;
}
.about-stat__label { margin-top: 14px; font-size: 16px; opacity: 0.6; }

/* Öne çıkan yorum — koyu zemin, büyük alıntı */
.about-testimonial__quote {
  max-width: 980px;
  font-family: 'Graphik', sans-serif;
  font-size: clamp(26px, 3.4vw, 42px);
  font-weight: 500;
  line-height: 1.35;
  letter-spacing: -0.02em;
  margin: 0;
  color: #fff;
}
.about-testimonial__author { margin-top: 32px; font-size: 17px; opacity: 0.55; }

/* SSS — açık zemin */
/* SSS — Awwwards: iki kolon (sticky başlık + numaralı akordeon) */
#about-faq .aeo-faq {
  margin: 0;
  display: grid;
  grid-template-columns: 0.85fr 1.55fr;
  gap: 40px 90px;
}
#about-faq .aeo-faq__title {
  font-family: 'Graphik', sans-serif;
  font-size: clamp(30px, 3.6vw, 48px);
  font-weight: 500;
  line-height: 1.05;
  letter-spacing: -0.04em;
  margin: 0;
  align-self: start;
}
#about-faq .aeo-faq__list {
  border-top: 1px solid rgba(18, 18, 18, 0.16);
  counter-reset: faq;
}
#about-faq .aeo-faq__item {
  border-bottom: 1px solid rgba(18, 18, 18, 0.16);
  transition: border-color 0.3s ease;
}
#about-faq .aeo-faq__item[open] { border-color: rgba(18, 18, 18, 0.4); }

#about-faq .aeo-faq__q {
  counter-increment: faq;
  list-style: none;
  cursor: pointer;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 24px;
  padding: 30px 4px;
  font-family: 'Graphik', sans-serif;
  font-size: clamp(19px, 1.7vw, 24px);
  font-weight: 500;
  line-height: 1.25;
  letter-spacing: -0.02em;
  color: #121212;
  transition: color 0.25s ease, padding-left 0.3s cubic-bezier(.25,.46,.45,.94);
}
#about-faq .aeo-faq__q::-webkit-details-marker { display: none; }
#about-faq .aeo-faq__q::marker { content: ""; }
/* tıklamada kutu/çerçeve gösterme; yalnızca klavyeyle ince fokus */
#about-faq .aeo-faq__q { -webkit-tap-highlight-color: transparent; user-select: none; outline: none; box-shadow: none; }
#about-faq .aeo-faq__q:focus { outline: none; box-shadow: none; }
#about-faq .aeo-faq__q:focus-visible { outline: 2px solid #794BFC; outline-offset: 6px; border-radius: 4px; box-shadow: none; }
/* sıra numarası 01, 02 ... */
#about-faq .aeo-faq__q::before {
  content: counter(faq, decimal-leading-zero);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0;
  color: #794BFC;
  opacity: 0.85;
  font-variant-numeric: tabular-nums;
  padding-top: 2px;
}
/* dairesel + / dönen × işareti */
#about-faq .aeo-faq__q::after {
  content: "+";
  width: 38px;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  font-weight: 400;
  line-height: 1;
  color: #121212;
  border: 1px solid rgba(18, 18, 18, 0.3);
  border-radius: 50%;
  transition: transform 0.35s cubic-bezier(.25,.46,.45,.94), background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease;
}
#about-faq .aeo-faq__item[open] .aeo-faq__q::after {
  content: "+";
  transform: rotate(135deg);
  background: #121212;
  color: #fff;
  border-color: #121212;
}
#about-faq .aeo-faq__q:hover { padding-left: 12px; }
#about-faq .aeo-faq__q:hover::after { border-color: #121212; }

#about-faq .aeo-faq__a {
  padding: 0 70px 32px 0;
  font-family: 'Graphik', sans-serif;
  font-size: 17px;
  line-height: 1.7;
  color: rgba(18, 18, 18, 0.66);
  animation: aboutFaqIn 0.4s cubic-bezier(.25,.46,.45,.94);
}
@keyframes aboutFaqIn {
  from { opacity: 0; transform: translateY(-8px); }
  to   { opacity: 1; transform: translateY(0); }
}
@media (max-width: 900px) {
  #about-faq .aeo-faq { grid-template-columns: 1fr; gap: 28px; }
  #about-faq .aeo-faq__title { position: static; }
  #about-faq .aeo-faq__q { gap: 16px; padding: 24px 2px; }
  #about-faq .aeo-faq__q::after { width: 32px; height: 32px; font-size: 19px; }
  #about-faq .aeo-faq__a { padding-right: 0; }
}

/* Kapanış CTA — koyu zemin */
.about-cta__title {
  font-family: 'Graphik', sans-serif;
  font-size: clamp(38px, 5.5vw, 64px);
  font-weight: 500;
  letter-spacing: -0.03em;
  margin: 0 0 18px;
  color: #fff;
}
.about-cta__text { font-size: 19px; opacity: 0.7; margin: 0 0 36px; max-width: 560px; }
.about-cta__actions { display: flex; gap: 14px; flex-wrap: wrap; }
.about-cta__btn {
  display: inline-flex;
  padding: 15px 34px;
  border: 1px solid #fff;
  border-radius: 999px;
  color: #fff;
  text-decoration: none;
  font-family: 'Graphik', sans-serif;
  font-size: 16px;
  transition: background-color 0.25s ease, color 0.25s ease;
}
.about-cta__btn--primary { background: #fff; color: #794BFC; border-color: #fff; }
.about-cta__btn--primary:hover { background: rgba(255, 255, 255, 0.88); }
.about-cta__btn:not(.about-cta__btn--primary):hover { background: rgba(255, 255, 255, 0.12); }

@media (max-width: 768px) {
  #about-manifesto, #about-vision, #about-values,
  #about-stats, #about-testimonial, #about-faq, #about-cta { padding: 64px 0; }
  #about-vision .row,
  #about-manifesto .row { flex-direction: column; gap: 28px; }
  .about-values__grid { grid-template-columns: 1fr; gap: 32px; }
  .about-stats__grid { grid-template-columns: repeat(2, 1fr); gap: 36px 20px; }
}

/* --- 404 --- */
#error-404 { padding: 120px 0; }
.error-404__code {
  font-size: clamp(72px, 14vw, 180px);
  line-height: 1;
  font-weight: 700;
  opacity: 0.12;
  margin-bottom: 8px;
}
.error-404__links {
  list-style: none;
  margin: 28px 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}
.error-404__links a {
  display: inline-flex;
  padding: 10px 18px;
  border: 1px solid;
  border-color: rgba(128, 128, 128, 0.45);
  border-radius: 999px;
  color: inherit;
  text-decoration: none;
}
.error-404__links a:hover { border-color: currentColor; }

/* --- İletişim formu --- */
.contact-hp {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}
.contact-form__title,
.contact-info__title { font-size: 24px; margin: 0 0 24px; }
.contact-form__field { margin-bottom: 18px; }
.contact-form__field label,
.contact-form__consent label { display: block; font-size: 14px; margin-bottom: 8px; }
.contact-form__field input,
.contact-form__field textarea {
  width: 100%;
  padding: 12px 14px;
  font: inherit;
  color: inherit;
  background: transparent;
  border: 1px solid rgba(128, 128, 128, 0.45);
  border-radius: 8px;
}
.contact-form__field input:focus,
.contact-form__field textarea:focus { outline: none; border-color: currentColor; }
.contact-form__consent { display: flex; gap: 10px; margin: 8px 0 24px; font-size: 14px; }
.contact-form__consent label { display: flex; gap: 10px; align-items: flex-start; margin: 0; }
.contact-form__consent input { margin-top: 3px; }
.contact-form__consent a { color: inherit; }
.contact-form__submit {
  display: inline-flex;
  padding: 13px 28px;
  font: inherit;
  color: inherit;
  background: transparent;
  border: 1px solid currentColor;
  border-radius: 999px;
  cursor: pointer;
  transition: background-color 0.2s ease;
}
.contact-form__submit:hover { background-color: rgba(128, 128, 128, 0.12); }
.contact-form__note { padding: 14px 16px; border-radius: 8px; margin-bottom: 20px; border: 1px solid; }
.contact-form__note--ok { border-color: rgba(40, 160, 90, 0.6); }
.contact-form__note--err { border-color: rgba(200, 60, 60, 0.6); }
.contact-info__list { list-style: none; padding: 0; margin: 0 0 28px; display: grid; gap: 8px; font-size: 18px; }
.contact-info__list a { color: inherit; text-decoration: none; }
.contact-info__list a:hover { text-decoration: underline; }
.contact-info__office { font-size: 14px; opacity: 0.7; margin: 0 0 6px; text-transform: uppercase; letter-spacing: 0.1em; }

@media (max-width: 768px) {
  .aeo-summary__list li { font-size: 16px; }
  .aeo-faq__title { font-size: 24px; }
  .aeo-faq__q { font-size: 17px; }
}

/* ===== Hizmetler hub — yeniden tasarım (koyu hero + numaralı liste + mor CTA) ===== */
#page-services { font-family: 'Graphik', sans-serif; }

/* Hero — koyu, iki kolon (metin + görsel) */
#services-hero {
  background: #000;
  color: #fff;
  padding: 150px 0 100px;
}
.svc-hero__grid {
  display: flex;
  align-items: center;
  gap: 80px;
}
.svc-hero__text { flex: 1.05; }
.svc-hero__media { flex: 1; }
.svc-hero__media img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 20px;
  border: 1px solid rgba(255, 255, 255, 0.09);
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.55), 0 0 70px rgba(124, 92, 255, 0.12);
}
.svc-eyebrow {
  display: block;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  opacity: 0.45;
  margin-bottom: 28px;
}
.svc-hero__title {
  font-size: clamp(32px, 3.6vw, 54px);
  font-weight: 500;
  line-height: 1.07;
  letter-spacing: -0.03em;
  margin: 0 0 24px;
}
.svc-hero__lead {
  font-size: clamp(17px, 1.4vw, 20px);
  line-height: 1.6;
  opacity: 0.66;
  max-width: 520px;
  margin: 0;
}

/* Görselli kart grid — açık */
#services-index {
  background: #f6f6f6;
  color: #121212;
  padding: 90px 0 100px;
}
/* 60/40 split: solda liste, sağda sticky WebGL canvas */
.svc-split { display: flex; gap: 64px; align-items: flex-start; }
.svc-split__list { flex: 0 0 58%; max-width: 58%; }
.svc-split__canvas {
  flex: 1;
  position: sticky;
  top: 96px;
  align-self: flex-start;
}
.svc-canvas-wrap {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: 22px;
  overflow: hidden;
  background: radial-gradient(120% 120% at 32% 22%, #3a2188 0%, #1c0f44 55%, #120a2e 100%);
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.45), 0 0 90px rgba(124, 92, 255, 0.18) inset;
}
#svc-particles { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }

/* Hizmet listesi (sol) */
.svc-list { display: block; }
.svc-row {
  display: flex;
  align-items: flex-start;
  gap: 28px;
  padding: 30px 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
  text-decoration: none;
  color: inherit;
  position: relative;
  transition: padding-left 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}
.svc-row:first-child { border-top: 1px solid rgba(0, 0, 0, 0.12); }
.svc-row__no {
  flex-shrink: 0;
  min-width: 38px;
  padding-top: 8px;
  font-size: 15px;
  font-weight: 500;
  color: #794BFC;
  font-variant-numeric: tabular-nums;
  opacity: 0.55;
  transition: opacity 0.25s ease;
}
.svc-row__body { flex: 1; display: block; }
.svc-row__title {
  display: block;
  font-size: clamp(22px, 2vw, 31px);
  font-weight: 500;
  line-height: 1.12;
  letter-spacing: -0.02em;
  margin-bottom: 10px;
  transition: color 0.25s ease;
}
.svc-row__excerpt {
  display: block;
  font-size: 17px;
  line-height: 1.5;
  color: #565656;
  max-width: 520px;
}
.svc-row__note {
  display: block;
  font-size: 14.5px;
  line-height: 1.5;
  color: #8a8a8a;
  margin-top: 8px;
  max-width: 520px;
}
.svc-row__badge {
  display: inline-block;
  vertical-align: middle;
  margin-left: 12px;
  padding: 3px 10px;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #794BFC;
  background: rgba(121, 75, 252, 0.10);
  border: 1px solid rgba(121, 75, 252, 0.30);
  border-radius: 999px;
}
.svc-row--featured .svc-row__no { opacity: 1; }
.svc-row__thumb { display: none; }
/* Aktif / hover satır */
.svc-row.is-active .svc-row__no,
.svc-row:hover .svc-row__no { opacity: 1; }
.svc-row.is-active .svc-row__title,
.svc-row:hover .svc-row__title { color: #794BFC; }
.svc-row:hover { padding-left: 16px; }
.svc-row:focus-visible { outline: 2px solid #794BFC; outline-offset: 6px; }

/* Fallback: WebGL yok (svc-no-canvas) → canvas gizle, satır thumbnail'larını göster */
.svc-no-canvas .svc-split { display: block; }
.svc-no-canvas .svc-split__list { max-width: 100%; }
.svc-no-canvas .svc-split__canvas { display: none; }
.svc-no-canvas .svc-row { flex-wrap: wrap; }
.svc-no-canvas .svc-row__thumb {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 14px;
  margin-top: 18px;
  order: 3;
}

/* CTA — marka moru */
#services-cta {
  background: #794BFC;
  color: #fff;
  padding: 110px 0;
}
.svc-cta__title {
  font-size: clamp(28px, 3.4vw, 46px);
  font-weight: 500;
  line-height: 1.1;
  letter-spacing: -0.02em;
  margin: 0 0 16px;
  max-width: 18ch;
}
.svc-cta__text {
  font-size: 19px;
  line-height: 1.6;
  opacity: 0.85;
  max-width: 540px;
  margin: 0 0 36px;
}
.svc-cta__actions { display: flex; gap: 14px; flex-wrap: wrap; }
.svc-cta__btn {
  display: inline-flex;
  padding: 14px 28px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.5);
  color: #fff;
  text-decoration: none;
  font-size: 16px;
  font-family: 'Graphik', sans-serif;
  transition: background 0.25s ease, color 0.25s ease;
}
.svc-cta__btn--primary { background: #fff; color: #794BFC; border-color: #fff; }
.svc-cta__btn--primary:hover { background: rgba(255, 255, 255, 0.88); }
.svc-cta__btn:not(.svc-cta__btn--primary):hover { background: rgba(255, 255, 255, 0.12); }

/* Tablet */
@media (max-width: 1024px) {
  .svc-split { gap: 40px; }
  .svc-split__list { flex-basis: 54%; max-width: 54%; }
  .svc-hero__grid { gap: 48px; }
}
/* Mobil — hero dikey, split tek kolon, canvas yerine thumbnail */
@media (max-width: 900px) {
  #services-hero { padding: 120px 0 56px; }
  #services-index { padding: 56px 0 72px; }
  #services-cta { padding: 72px 0; }
  .svc-hero__grid { flex-direction: column; align-items: stretch; gap: 36px; }
  .svc-split { display: block; }
  .svc-split__list { max-width: 100%; }
  .svc-split__canvas { display: none; }
  .svc-row { flex-wrap: wrap; padding: 26px 0; }
  .svc-row__excerpt { font-size: 16px; }
  .svc-row__thumb {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 14px;
    margin-top: 18px;
    order: 3;
  }
}

/* ===== Hizmet DETAY sayfası (service.php) ===== */
#page-service { font-family: 'Graphik', sans-serif; }

/* Hero — koyu */
.svcd-hero { background: #000; color: #fff; padding: 150px 0 92px; }
.svcd-hero .breadcrumb,
.svcd-hero .breadcrumb a,
.svcd-hero .breadcrumb span { color: rgba(255, 255, 255, 0.55); }
.svcd-hero .breadcrumb a:hover { color: #fff; }
/* İki kolon: solda metin, sağda siyah WebGL ikon canvas'ı */
.svcd-hero__grid { display: flex; align-items: stretch; gap: 64px; }
.svcd-hero__text { flex: 1.1; min-width: 0; display: flex; flex-direction: column; justify-content: center; }
.svcd-hero__media {
  flex: 1;
  position: relative;
  min-height: 440px;
  background: #000;
}
.svcd-hero__media.is-hidden { display: none; }
#svc-particles { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.svcd-hero__title {
  font-size: clamp(34px, 4.6vw, 62px);
  font-weight: 500;
  line-height: 1.05;
  letter-spacing: -0.03em;
  margin: 18px 0 22px;
  max-width: 18ch;
}
.svcd-hero__lead {
  font-size: clamp(18px, 1.6vw, 22px);
  line-height: 1.55;
  opacity: 0.68;
  max-width: 640px;
  margin: 0 0 34px;
}
.svcd-hero__cta {
  display: inline-flex;
  align-self: flex-start;   /* flex column içinde butonu içeriğe sığdır (full-width olmasın) */
  padding: 14px 30px;
  border-radius: 999px;
  background: #794BFC;
  color: #fff;
  text-decoration: none;
  font-size: 16px;
  transition: background 0.25s ease;
}
.svcd-hero__cta:hover { background: #8a61ff; }

/* Bölüm taban */
.svcd-section { padding: 92px 0; }
.svcd-h2 {
  font-size: clamp(26px, 2.6vw, 38px);
  font-weight: 500;
  line-height: 1.12;
  letter-spacing: -0.02em;
  margin: 6px 0 40px;
}

/* Genel bakış — açık, iki kolon (gövde + özet) */
.svcd-overview { background: #f6f6f6; color: #121212; }
.svcd-overview .row { display: flex; gap: 72px; align-items: flex-start; }
.svcd-overview .row .col:first-child { flex: 1.35; min-width: 0; }
.svcd-overview .row .col:last-child { flex: 1; min-width: 0; }
.svcd-overview__body { font-size: clamp(19px, 1.6vw, 23px); line-height: 1.55; letter-spacing: -0.01em; }
.svcd-overview__body p { margin: 0; }
/* ÖZET (TL;DR) — temiz kart */
.svcd-overview .aeo-summary {
  margin: 0;
  padding: 32px 34px;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 18px;
}
.svcd-overview .aeo-summary__eyebrow { color: #794BFC; opacity: 1; font-weight: 500; margin-bottom: 20px; }
.svcd-overview .aeo-summary__list { gap: 16px; }
.svcd-overview .aeo-summary__list li { padding-left: 26px; font-size: 16px; line-height: 1.55; color: #3a3a3a; }
.svcd-overview .aeo-summary__list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.45em;
  width: 13px;
  height: 7px;
  border-left: 2px solid #794BFC;
  border-bottom: 2px solid #794BFC;
  background: none;
  transform: rotate(-45deg);
}

/* Neler dahil — beyaz, iki kolon checklist */
.svcd-includes { background: #fff; color: #121212; }
.svcd-includes__grid {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(2, 1fr); column-gap: 56px;
}
.svcd-includes__grid li {
  position: relative;
  padding: 16px 0 16px 34px;
  font-size: 18px;
  line-height: 1.45;
  border-top: 1px solid rgba(0, 0, 0, 0.10);
}
.svcd-includes__grid li::before {
  content: '';
  position: absolute; left: 0; top: 22px;
  width: 16px; height: 9px;
  border-left: 2px solid #794BFC; border-bottom: 2px solid #794BFC;
  transform: rotate(-45deg);
}

/* Yaklaşımımız — açık, 4 adım */
.svcd-approach { background: #f6f6f6; color: #121212; }
.svcd-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 36px; }
.svcd-step__no { font-size: 14px; font-weight: 500; color: #794BFC; margin-bottom: 16px; font-variant-numeric: tabular-nums; }
.svcd-step__title { font-size: 19px; font-weight: 500; line-height: 1.2; margin: 0 0 10px; }
.svcd-step__text { font-size: 15.5px; line-height: 1.55; color: #565656; margin: 0; }

/* SSS — beyaz */
.svcd-faq { background: #fff; color: #121212; }
.svcd-faq .aeo-faq { margin: 0; }

/* CTA — mor (svc-cta__ iç sınıfları yeniden kullanılıyor) */
.svcd-cta { background: #794BFC; color: #fff; padding: 110px 0; }

/* AI paylaş şeridi */
.svcd-share { background: #fff; padding: 0 0 90px; }

@media (max-width: 900px) {
  .svcd-hero { padding: 120px 0 64px; }
  .svcd-hero__grid { flex-direction: column; gap: 0; }
  .svcd-hero__media { display: none; }
  .svcd-section { padding: 64px 0; }
  .svcd-cta { padding: 72px 0; }
  .svcd-overview .row { flex-direction: column; gap: 36px; }
  .svcd-includes__grid { grid-template-columns: 1fr; column-gap: 0; }
  .svcd-steps { grid-template-columns: repeat(2, 1fr); gap: 28px; }
}

/* Hizmetler hub — alıntılanabilir tanım + SSS */
.svc-index__def {
  font-size: clamp(20px, 2vw, 27px);
  line-height: 1.42;
  letter-spacing: -0.01em;
  color: #121212;
  max-width: 900px;
  margin: 0 0 54px;
}
#services-faq { background: #fff; color: #121212; padding: 24px 0 100px; }

/* Hizmet detay — ilgili işler + ilgili hizmetler */
.svcd-related { background: #f6f6f6; color: #121212; }
.svcd-works { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0 56px; }
.svcd-work {
  display: flex; align-items: center; justify-content: space-between; gap: 20px;
  padding: 20px 0; border-top: 1px solid rgba(0, 0, 0, 0.12);
  text-decoration: none; color: inherit;
  transition: padding-left 0.35s cubic-bezier(0.22, 1, 0.36, 1);
}
.svcd-work__name { font-size: 20px; font-weight: 500; letter-spacing: -0.01em; }
.svcd-work__arrow {
  flex-shrink: 0; width: 40px; height: 40px; border-radius: 50%;
  border: 1px solid rgba(0, 0, 0, 0.2); color: #121212;
  display: flex; align-items: center; justify-content: center;
  transition: background 0.25s ease, border-color 0.25s ease, color 0.25s ease, transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
}
.svcd-work__arrow svg { width: 18px; height: 18px; }
.svcd-work:hover { padding-left: 12px; }
.svcd-work:hover .svcd-work__arrow { background: #794BFC; border-color: #794BFC; color: #fff; transform: rotate(-45deg); }
.svcd-relsvc { margin-top: 48px; }
.svcd-relsvc__label { display: block; font-size: 13px; letter-spacing: 0.14em; text-transform: uppercase; opacity: 0.5; margin-bottom: 16px; }
.svcd-relsvc__chips { display: flex; flex-wrap: wrap; gap: 12px; }
.svcd-chip {
  display: inline-flex; padding: 10px 20px; border-radius: 999px;
  border: 1px solid rgba(0, 0, 0, 0.18); color: #121212; text-decoration: none; font-size: 15px;
  transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}
.svcd-chip:hover { background: #794BFC; border-color: #794BFC; color: #fff; }

@media (max-width: 900px) { .svcd-works { grid-template-columns: 1fr; } }

/* ===== İletişim — survey tadında lead formu ===== */
#page-contact { font-family: 'Graphik', sans-serif; }

/* Hero — koyu */
.ct-hero { background: #000; color: #fff; padding: 150px 0 88px; }
.ct-hero .breadcrumb,
.ct-hero .breadcrumb a,
.ct-hero .breadcrumb span { color: rgba(255, 255, 255, 0.55); }
.ct-hero .breadcrumb a:hover { color: #fff; }
.ct-hero .svc-eyebrow { color: #fff; }
.ct-hero__title { font-size: clamp(34px, 4.4vw, 56px); font-weight: 500; line-height: 1.06; letter-spacing: -0.03em; margin: 12px 0 22px; max-width: 16ch; }
.ct-hero__lead { font-size: clamp(18px, 1.5vw, 21px); line-height: 1.55; opacity: 0.7; max-width: 620px; margin: 0; }

/* Survey gövdesi — açık, dar kolon */
.ct-survey { background: #f6f6f6; color: #121212; padding: 76px 0 100px; }
.ct-survey .container { max-width: 880px; }
.svy-form { display: block; }

/* Adım (fieldset) */
.svy-step { border: 0; margin: 0; padding: 36px 0; border-top: 1px solid rgba(0, 0, 0, 0.10); }
.svy-step:first-of-type { border-top: 0; padding-top: 4px; }
.svy-step__head { display: flex; align-items: baseline; gap: 16px; margin-bottom: 4px; }
.svy-step__no { font-size: 14px; font-weight: 500; color: #794BFC; font-variant-numeric: tabular-nums; }
.svy-step__title { font-size: clamp(20px, 2vw, 26px); font-weight: 500; letter-spacing: -0.02em; padding: 0; }
.svy-step__hint { font-size: 15px; color: #777; margin: 0 0 18px 38px; }

/* Seçilebilir chip'ler (checkbox/radio) */
.svy-chips { display: flex; flex-wrap: wrap; gap: 12px; margin-left: 38px; }
.svy-chip { position: relative; cursor: pointer; }
.svy-chip input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.svy-chip span {
  display: inline-flex; align-items: center;
  padding: 11px 20px; border-radius: 999px;
  border: 1px solid rgba(0, 0, 0, 0.2); background: #fff;
  font-size: 15.5px; line-height: 1; transition: background 0.18s ease, border-color 0.18s ease, color 0.18s ease;
}
.svy-chip:hover span { border-color: #794BFC; }
.svy-chip input:checked + span { background: #794BFC; border-color: #794BFC; color: #fff; }
.svy-chip input:focus-visible + span { outline: 2px solid #794BFC; outline-offset: 3px; }

/* Alanlar */
.svy-step .contact-form__field { margin: 0 0 0 38px; }
.svy-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px 24px; margin-left: 38px; }
.svy-grid .contact-form__field { margin: 0; }

/* Onay + gönder */
.svy-form .contact-form__consent { margin: 28px 0 0 38px; }
.svy-submit {
  margin: 28px 0 0 38px;
  background: #794BFC; color: #fff; border-color: #794BFC; padding: 15px 34px; font-size: 16px;
}
.svy-submit:hover { background: #8a61ff; }

/* Doğrudan iletişim */
/* Doğrudan iletişim (NAP) */
.ct-direct { margin-top: 56px; padding-top: 32px; border-top: 1px solid rgba(0, 0, 0, 0.10); }
.ct-direct__label { display: block; font-size: 13px; letter-spacing: 0.14em; text-transform: uppercase; color: #794BFC; margin-bottom: 14px; }
.ct-direct__answer { font-size: 18px; line-height: 1.55; max-width: 640px; margin: 0 0 28px; }
.ct-direct__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; margin-bottom: 26px; }
.ct-direct__k { display: block; font-size: 13px; color: #888; margin-bottom: 8px; }
.ct-direct__item a { display: block; color: #121212; text-decoration: none; }
.ct-direct__item a:hover { color: #794BFC; }
.ct-direct__item address { font-style: normal; line-height: 1.5; color: #333; }
.ct-direct__links { display: flex; flex-wrap: wrap; gap: 22px; margin: 0; }
.ct-direct__links a { color: #121212; text-decoration: none; border-bottom: 1px solid rgba(121, 75, 252, 0.45); padding-bottom: 1px; }
.ct-direct__links a:hover { color: #794BFC; }

/* İletişim SSS */
.ct-faq { margin-top: 56px; padding-top: 4px; border-top: 1px solid rgba(0, 0, 0, 0.10); }
.ct-faq .aeo-faq { margin: 16px 0 0; }

@media (max-width: 768px) {
  .ct-hero { padding: 120px 0 56px; }
  .ct-survey { padding: 56px 0 72px; }
  .svy-step__hint, .svy-chips,
  .svy-step .contact-form__field, .svy-form .contact-form__consent, .svy-submit { margin-left: 0; }
  .svy-grid { grid-template-columns: 1fr; margin-left: 0; }
  .ct-direct__grid { grid-template-columns: 1fr; gap: 22px; }
}

/* ===== Kariyer (liste + rol detay) ===== */
#page-career, #page-career-role { font-family: 'Graphik', sans-serif; }
.cr-hero { background: #000; color: #fff; padding: 150px 0 92px; }
.cr-hero .breadcrumb, .cr-hero .breadcrumb a, .cr-hero .breadcrumb span { color: rgba(255,255,255,.55); }
.cr-hero .breadcrumb a:hover { color: #fff; }
.cr-hero .svc-eyebrow { color: #fff; }
.cr-hero__title { font-size: clamp(34px,4.6vw,62px); font-weight: 500; line-height: 1.05; letter-spacing: -0.03em; margin: 16px 0 22px; max-width: 18ch; }
.cr-hero__lead { font-size: clamp(18px,1.6vw,21px); line-height: 1.55; opacity: .7; max-width: 680px; margin: 0; }
.cr-hero__meta { display: flex; flex-wrap: wrap; gap: 8px 18px; margin: 18px 0 0; font-size: 15px; opacity: .7; }
.cr-hero__meta span + span::before { content: "·"; margin-right: 18px; opacity: .6; }
.cr-hero__cta { display: inline-flex; margin-top: 30px; padding: 14px 30px; border-radius: 999px; background: #794BFC; color: #fff; text-decoration: none; font-size: 16px; transition: background .25s ease; }
.cr-hero__cta:hover { background: #8a61ff; }

.cr-list { background: #f6f6f6; color: #121212; padding: 90px 0 100px; }
.cr-list__h { font-size: clamp(26px,2.6vw,38px); font-weight: 500; letter-spacing: -0.02em; margin: 0 0 36px; }
.cr-role { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 30px 0; border-top: 1px solid rgba(0,0,0,.12); text-decoration: none; color: inherit; transition: padding-left .4s cubic-bezier(.22,1,.36,1); }
.cr-role:last-child { border-bottom: 1px solid rgba(0,0,0,.12); }
.cr-role__title { display: block; font-size: clamp(22px,2vw,30px); font-weight: 500; letter-spacing: -0.02em; margin-bottom: 6px; transition: color .25s ease; }
.cr-role__loc { font-size: 15px; color: #666; }
.cr-role__arrow { flex-shrink: 0; width: 46px; height: 46px; border-radius: 50%; border: 1px solid rgba(0,0,0,.2); color: #121212; display: flex; align-items: center; justify-content: center; transition: background .25s ease, border-color .25s ease, color .25s ease, transform .4s cubic-bezier(.22,1,.36,1); }
.cr-role__arrow svg { width: 20px; height: 20px; }
.cr-role:hover { padding-left: 16px; }
.cr-role:hover .cr-role__title { color: #794BFC; }
.cr-role:hover .cr-role__arrow { background: #794BFC; border-color: #794BFC; color: #fff; transform: rotate(-45deg); }

.cr-body { background: #fff; color: #121212; padding: 80px 0 88px; }
.cr-body .container { max-width: 860px; }
.cr-body__intro { font-size: clamp(19px,1.6vw,23px); line-height: 1.55; letter-spacing: -0.01em; margin: 0 0 8px; }
.cr-body h2 { font-size: clamp(21px,1.9vw,27px); font-weight: 500; letter-spacing: -0.02em; margin: 44px 0 16px; }
.cr-body p { font-size: 18px; line-height: 1.6; color: #333; margin: 0 0 16px; }
.cr-body ul { margin: 0 0 8px; padding-left: 22px; }
.cr-body li { font-size: 17px; line-height: 1.6; color: #333; margin-bottom: 10px; }
.cr-body a { color: #794BFC; }
.cr-related { background: #f6f6f6; color: #121212; padding: 60px 0 80px; }
.cr-related__h { font-size: 13px; letter-spacing: .14em; text-transform: uppercase; color: #888; margin: 0 0 18px; }
.cr-related__chips { display: flex; flex-wrap: wrap; gap: 12px; }
.cr-chip { display: inline-flex; padding: 10px 20px; border-radius: 999px; border: 1px solid rgba(0,0,0,.18); color: #121212; text-decoration: none; font-size: 15px; transition: background .2s ease, border-color .2s ease, color .2s ease; }
.cr-chip:hover { background: #794BFC; border-color: #794BFC; color: #fff; }

/* ===== Blog (liste) ===== */
#page-blog { font-family: 'Graphik', sans-serif; }
.bl-hero { background: #000; color: #fff; padding: 150px 0 80px; }
.bl-hero .svc-eyebrow { color: #fff; }
.bl-hero__title { font-size: clamp(34px,4.6vw,62px); font-weight: 500; line-height: 1.05; letter-spacing: -0.03em; margin: 16px 0 20px; max-width: 16ch; }
.bl-hero__lead { font-size: clamp(18px,1.6vw,21px); line-height: 1.55; opacity: .7; max-width: 620px; margin: 0; }
.bl-grid-wrap { background: #f6f6f6; color: #121212; padding: 80px 0 100px; }
.bl-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px 28px; }
.bl-card { display: flex; flex-direction: column; text-decoration: none; color: inherit; }
.bl-card__media { position: relative; border-radius: 16px; overflow: hidden; aspect-ratio: 3/2; background: #e8e8e8; }
.bl-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .6s cubic-bezier(.22,1,.36,1); }
.bl-card:hover .bl-card__media img { transform: scale(1.05); }
.bl-card__tag { position: absolute; top: 14px; left: 14px; padding: 6px 13px; border-radius: 999px; background: rgba(0,0,0,.55); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); color: #fff; font-size: 12px; letter-spacing: .04em; }
.bl-card__title { font-size: 20px; font-weight: 500; line-height: 1.3; letter-spacing: -0.01em; margin: 18px 0 0; transition: color .25s ease; }
.bl-card:hover .bl-card__title { color: #794BFC; }
.bl-card__date { display: block; margin-top: 10px; font-size: 13px; letter-spacing: .03em; color: #8a8a8a; }

/* Süreç: mor intro'dan sonra ilk adıma nefes payı */
.process-intro + #list-process { padding-top: clamp(56px, 7vw, 96px); }

@media (max-width: 1024px) { .bl-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 768px) {
  .cr-hero, .bl-hero { padding: 120px 0 56px; }
  .cr-list, .cr-body, .bl-grid-wrap { padding: 56px 0 72px; }
}
@media (max-width: 680px) { .bl-grid { grid-template-columns: 1fr; } }

/* ============================================================
   Taban font düzeltmesi (font hatası onarımı)
   Sorun: global.css'te body için font-family tanımlı değil; reset
   (global.css:69) tüm elemanları "font-family: inherit" yapıyor.
   Böylece font-family'yi açıkça yazmayan bileşenler (AEO FAQ/summary,
   süreç CTA başlığı, tanımsız --invt-title slider) tarayıcı varsayılanı
   olan SERIF'e (Times) düşüyordu. Burada body'ye Graphik + sans-serif
   yedeği veriyoruz; aeo.css styles.css'ten sonra yüklendiği için kazanır.
   ============================================================ */
body { font-family: 'Graphik', sans-serif; }
:root { --invt-title: 'Graphik', sans-serif; }

/* ============================================================
   Blog detay (makale) — #page-blog-detail
   Koyu makale hero (tag + baslik + tarih/okuma) + genis gorsel +
   okunur prose kolonu + ilgili yazilar (.bl-grid reuse).
   ============================================================ */
#page-blog-detail { font-family: 'Graphik', sans-serif; background: #f6f6f6; color: #121212; }
.bd-hero { background: #000; color: #fff; padding: 140px 0 52px; }
.bd-hero .breadcrumb,
.bd-hero .breadcrumb a,
.bd-hero .breadcrumb span { color: rgba(255,255,255,.5); }
.bd-hero .breadcrumb a:hover { color: #fff; }
.bd-hero .svc-eyebrow { color: #b89bff; }
.bd-hero__title { font-size: clamp(30px,4.2vw,56px); font-weight: 500; line-height: 1.08; letter-spacing: -0.03em; margin: 16px 0 18px; max-width: 22ch; }
.bd-hero__meta { display: flex; align-items: center; gap: 10px; font-size: 14px; letter-spacing: .02em; color: rgba(255,255,255,.55); }
.bd-hero__meta time { color: rgba(255,255,255,.85); }
.bd-figure { background: #f6f6f6; padding: 36px 0 0; }
.bd-figure img { width: 100%; max-height: 460px; object-fit: cover; border-radius: 18px; display: block; }
.bd-body { padding: 48px 0 76px; }
.bd-prose { max-width: 760px; margin: 0 auto; }
.bd-prose h2 { font-size: clamp(22px,2.2vw,30px); font-weight: 500; line-height: 1.22; letter-spacing: -0.02em; margin: 6px 0 20px; }
.bd-prose h3 { font-size: 17px; font-weight: 600; letter-spacing: .01em; margin: 44px 0 14px; padding-top: 28px; border-top: 1px solid #e2e2e2; }
.bd-prose p { font-size: 18px; line-height: 1.78; color: #2b2b2b; margin: 0 0 22px; }
.bd-prose p:first-of-type { font-size: 21px; line-height: 1.6; color: #111; }
.bd-prose strong { font-weight: 600; color: #111; }
.bd-prose a { color: #794BFC; text-decoration: underline; text-underline-offset: 2px; }
.bd-prose ul { margin: 0 0 22px; padding: 0; list-style: none; }
.bd-prose ul li { font-size: 14.5px; line-height: 1.6; color: #555; padding-left: 18px; position: relative; margin-bottom: 10px; word-break: break-word; }
.bd-prose ul li::before { content: ""; position: absolute; left: 0; top: 9px; width: 6px; height: 6px; border-radius: 50%; background: #794BFC; }
.bd-prose em { font-style: italic; }
.bd-body .aeo-share { max-width: 760px; margin-left: auto; margin-right: auto; }
.bd-related { padding-top: 64px; }
.bd-related__title { font-size: clamp(24px,2.6vw,34px); font-weight: 500; letter-spacing: -0.02em; margin: 0 0 34px; }
@media (max-width: 768px) {
  .bd-hero { padding: 108px 0 40px; }
  .bd-figure img { max-height: 280px; border-radius: 12px; }
  .bd-prose p { font-size: 17px; }
  .bd-prose p:first-of-type { font-size: 19px; }
}

/* ============================================================
   İşler / Selected Work — #page-works (koyu editoryal portfolyo)
   Büyük kapak görselleri, kayık 2-kolon grid, kategori filtresi,
   marka gradyanlı placeholder. Awwwards-tarzı, sitenin temasında.
   ============================================================ */
#page-works { background: #0a0a0a; color: #fff; font-family: 'Graphik', sans-serif; }
.wk-hero { padding: 160px 0 64px; }
.wk-hero .svc-eyebrow { color: #b89bff; }
.wk-hero__title { font-size: clamp(38px,6vw,88px); font-weight: 500; line-height: 1.02; letter-spacing: -0.04em; margin: 18px 0 24px; max-width: 18ch; }
.wk-hero__lead { font-size: clamp(17px,1.5vw,21px); line-height: 1.55; color: rgba(255,255,255,.6); max-width: 640px; margin: 0; }
.wk-hero__count { margin-top: 28px; font-size: 13px; letter-spacing: .1em; text-transform: uppercase; color: rgba(255,255,255,.4); }
.wk-wrap { padding: 8px 0 80px; }
.wk-filter { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 52px; }
.wk-chip { font: inherit; font-size: 14px; color: rgba(255,255,255,.65); background: transparent; border: 1px solid rgba(255,255,255,.18); border-radius: 999px; padding: 9px 18px; cursor: pointer; transition: color .2s ease, border-color .2s ease, background .2s ease; }
.wk-chip:hover { color: #fff; border-color: rgba(255,255,255,.45); }
.wk-chip.is-active { background: #794BFC; border-color: #794BFC; color: #fff; }
.wk-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 72px 48px; }
.wk-card { display: flex; flex-direction: column; text-decoration: none; color: inherit; }
.wk-grid .wk-card:nth-child(even) { margin-top: 80px; }
.wk-card__media { position: relative; aspect-ratio: 4/3; border-radius: 16px; overflow: hidden; background: #141414; border: 1px solid rgba(255,255,255,.06); }
.wk-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .7s cubic-bezier(.22,1,.36,1); }
.wk-card:hover .wk-card__media img { transform: scale(1.05); }
.wk-card__media--ph { display: flex; align-items: center; justify-content: center; }
.wk-card__ph-name { font-size: clamp(22px,2.6vw,38px); font-weight: 500; letter-spacing: -0.02em; color: #fff; padding: 0 24px; text-align: center; text-shadow: 0 2px 24px rgba(0,0,0,.35); }
.wk-card__cta { position: absolute; left: 18px; bottom: 18px; display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px; border-radius: 999px; background: rgba(10,10,10,.72); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); color: #fff; font-size: 13px; letter-spacing: .02em; opacity: 0; transform: translateY(8px); transition: opacity .3s ease, transform .3s ease; }
.wk-card:hover .wk-card__cta { opacity: 1; transform: translateY(0); }
.wk-card__cta span { transition: transform .3s ease; }
.wk-card:hover .wk-card__cta span { transform: translateX(4px); }
.wk-card__info { padding: 22px 2px 0; }
.wk-card__cat { font-size: 12px; letter-spacing: .07em; text-transform: uppercase; color: #b89bff; }
.wk-card__name { font-size: clamp(22px,2.1vw,30px); font-weight: 500; letter-spacing: -0.02em; margin: 10px 0; transition: color .25s ease; }
.wk-card:hover .wk-card__name { color: #b89bff; }
.wk-card__desc { font-size: 15px; line-height: 1.55; color: rgba(255,255,255,.55); margin: 0 0 16px; max-width: 46ch; }
.wk-card__tags { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0; padding: 0; }
.wk-card__tags li { font-size: 12px; letter-spacing: .02em; color: rgba(255,255,255,.6); border: 1px solid rgba(255,255,255,.16); border-radius: 999px; padding: 5px 12px; }
.wk-empty { color: rgba(255,255,255,.5); padding: 48px 0; text-align: center; }
.wk-cta { padding: 80px 0 110px; border-top: 1px solid rgba(255,255,255,.08); text-align: center; }
.wk-cta__title { font-size: clamp(28px,4vw,52px); font-weight: 500; letter-spacing: -0.03em; margin: 0 0 28px; }
.wk-cta__btn { display: inline-block; background: #794BFC; color: #fff; text-decoration: none; font-size: 16px; padding: 16px 34px; border-radius: 999px; transition: transform .2s ease, background .2s ease; }
.wk-cta__btn:hover { background: #6a3df0; transform: translateY(-2px); }
@media (max-width: 900px) {
  .wk-hero { padding: 120px 0 48px; }
  .wk-grid { gap: 48px 28px; }
  .wk-grid .wk-card:nth-child(even) { margin-top: 0; }
}
@media (max-width: 640px) {
  .wk-grid { grid-template-columns: 1fr; gap: 40px; }
}

/* ============================================================
   Case: Renkler (master marka renkleri) + Galeri (Swiper, full-width)
   #page-case koyu temada. Görseller iki-kolon yerine tek swiper.
   ============================================================ */
#page-case .svc-eyebrow { color: #b89bff; }
.case-colors { padding: 44px 0 16px; }
.case-colors__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; margin-top: 26px; }
.case-color { aspect-ratio: 16/10; border-radius: 14px; padding: 22px; display: flex; flex-direction: column; justify-content: space-between; color: #fff; border: 1px solid rgba(255,255,255,.10); }
.case-color.is-light { color: #111; border-color: rgba(0,0,0,.12); }
.case-color__role { font-size: 12px; letter-spacing: .08em; text-transform: uppercase; opacity: .82; }
.case-color__values { display: flex; flex-direction: column; gap: 4px; }
.case-color__hex { font-size: clamp(20px,2.2vw,28px); font-weight: 500; letter-spacing: .01em; }
.case-color__rgb { font-size: 13px; letter-spacing: .04em; opacity: .82; }

.case-gallery { padding: 40px 0 64px; }
.case-swiper { margin-top: 26px; border-radius: 16px; overflow: hidden; background: #111; border: 1px solid rgba(255,255,255,.06); aspect-ratio: 16 / 9; }
.case-swiper .swiper-slide { display: flex; align-items: center; justify-content: center; background: #111; height: auto; }
.case-swiper .swiper-slide img { width: 100%; height: 100%; object-fit: cover; object-position: top center; display: block; }
/* Case "Farklı İşler" — portfolyo (.wk-card) dilinde kartlar, koyu tema */
#case-related { background: #000; border-top: 1px solid rgba(255,255,255,.08); }
#case-related .crel-title { color: #fff; font-size: clamp(24px,2.6vw,34px); font-weight: 500; letter-spacing: -0.02em; margin: 0 0 36px; }
.crel-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 36px 28px; }
.crel-card { display: flex; flex-direction: column; text-decoration: none; color: inherit; }
.crel-card__media { position: relative; aspect-ratio: 4 / 3; border-radius: 14px; overflow: hidden; background: #141414; border: 1px solid rgba(255,255,255,.06); }
.crel-card__media img { width: 100%; height: 100%; object-fit: cover; object-position: top center; display: block; transition: transform .6s cubic-bezier(.22,1,.36,1); }
.crel-card:hover .crel-card__media img { transform: scale(1.05); }
.crel-card__media--ph { display: flex; align-items: center; justify-content: center; }
.crel-card__ph-name { color: #fff; font-size: clamp(18px,2vw,26px); font-weight: 500; text-align: center; padding: 0 18px; text-shadow: 0 2px 18px rgba(0,0,0,.3); }
.crel-card__name { font-size: 19px; font-weight: 500; color: #fff; margin: 16px 0 6px; transition: color .25s ease; }
.crel-card:hover .crel-card__name { color: #b89bff; }
.crel-card__desc { font-size: 14px; color: rgba(255,255,255,.55); line-height: 1.5; }
@media (max-width: 860px) { .crel-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .crel-grid { grid-template-columns: 1fr; } }

/* KÖK ÇÖZÜM: case sayfası koyu (#000) ama #page-case.dark yalnızca background veriyor,
   color vermiyor. Bu yüzden inherit eden tüm bileşenler (aeo-share/btn, faq, etiket, related)
   tarayıcı varsayılanı koyu metne düşüyordu. Taban metni beyaza çekiyoruz. */
#page-case { color: #fff; }
/* AI-paylaş araç çubuğu (ChatGPT/Perplexity/kopyala/alıntıla link-butonları) koyu zeminde net */
#page-case .aeo-btn { color: #fff; border-color: rgba(255,255,255,.3); }
#page-case .aeo-btn:hover { border-color: #fff; background: rgba(255,255,255,.08); }

/* Etiket pill'leri (case intro + anasayfa seçili işler): koyu zeminde net.
   home.css statik-query ile cache'lendiğinden renk burada (filemtime-bust) garanti edilir. */
.select-tags span { color: #fff; border-color: rgba(255,255,255,.24); }

/* Case FAQ: koyu zeminde okunur olsun (q/a renk inherit ediyor, #page-case color vermiyordu) */
#page-case .aeo-faq, #page-case .aeo-faq__title, #page-case .aeo-faq__q, #page-case .aeo-faq__a { color: #fff; }
#page-case .aeo-faq__q:hover, #page-case .aeo-faq__item[open] > .aeo-faq__q { color: #b89bff; }
#page-case .aeo-faq__a { color: rgba(255,255,255,.7); }

/* Case: Proje talep CTA (koyu) */
.case-cta { padding: 76px 0 96px; border-top: 1px solid rgba(255,255,255,.08); text-align: center; }
.case-cta__title { font-size: clamp(28px,4vw,48px); font-weight: 500; letter-spacing: -0.03em; color: #fff; margin: 0 0 14px; }
.case-cta__lead { font-size: clamp(16px,1.4vw,19px); color: rgba(255,255,255,.6); margin: 0 auto 30px; max-width: 48ch; }
.case-cta__btn { display: inline-block; background: #794BFC; color: #fff; text-decoration: none; font-size: 16px; padding: 16px 34px; border-radius: 999px; transition: transform .2s ease, background .2s ease; }
.case-cta__btn:hover { background: #6a3df0; transform: translateY(-2px); }
.case-swiper .swiper-button-prev, .case-swiper .swiper-button-next { color: #fff; width: 46px; height: 46px; border-radius: 50%; background: rgba(0,0,0,.45); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); transition: background .2s ease; }
.case-swiper .swiper-button-prev:hover, .case-swiper .swiper-button-next:hover { background: #794BFC; }
.case-swiper .swiper-button-prev::after, .case-swiper .swiper-button-next::after { font-size: 16px; font-weight: 700; }
.case-swiper .swiper-pagination-bullet { background: #fff; opacity: .4; }
.case-swiper .swiper-pagination-bullet-active { background: #794BFC; opacity: 1; }
@media (max-width: 640px) { .case-color { aspect-ratio: 16/11; padding: 18px; } }

/* Erişilebilir gizli başlık (SEO/AEO için h1; görsel düzeni bozmaz) */
.sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
/* Case proje adı artık h1 — UA üst boşluğunu sıfırla (düzen kaymasın) */
#page-case h1.case-project-name { margin-top: 0; }

/* Anasayfa AEO bölümü — görünür tanım + FAQ (açık zemin, okunur) */
#home-faq { background: #f6f6f6; color: #121212; padding: clamp(64px,8vw,110px) 0; }
#home-faq .svc-eyebrow { color: #794BFC; }
#home-faq .home-faq__def { max-width: 860px; font-size: clamp(20px,2.2vw,28px); line-height: 1.5; font-weight: 500; letter-spacing: -0.01em; margin: 16px 0 8px; color: #121212; }
#home-faq .aeo-faq { max-width: 860px; margin-top: 8px; }

/* Kariyer + İşler FAQ bölümleri (aeo-faq reuse) — boşluk */
.wk-faq { padding: 4px 0 88px; }
.cr-faq { padding: 8px 0 80px; }
#page-career .cr-faq, #page-career-role .cr-faq { background: #f6f6f6; }

/* ============================================================
   Case — Sosyal medya postları carousel (4:5 Instagram kartları)
   Sosyal kategori case'lerinde (güven, medical-park, salos) gösterilir.
   ============================================================ */
.case-social { padding: 48px 0 24px; }
.case-social__title { font-size: clamp(22px,2.4vw,32px); font-weight: 500; letter-spacing: -0.02em; color: #fff; margin: 8px 0 0; }
/* İki satırlı marquee: üst sıra sağdan sola, alt sıra soldan sağa, sürekli akar */
.case-marquee { margin-top: 28px; display: flex; flex-direction: column; gap: clamp(12px,1.4vw,18px); }
.case-marquee__row { overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); }
.case-marquee__track { display: flex; gap: clamp(12px,1.4vw,18px); width: max-content; will-change: transform; }
.case-marquee__row--rtl .case-marquee__track { animation: caseMarqueeRtl 70s linear infinite; }
.case-marquee__row--ltr .case-marquee__track { animation: caseMarqueeLtr 70s linear infinite; }
.case-marquee:hover .case-marquee__track { animation-play-state: paused; }
.case-marquee__item { flex: 0 0 auto; width: clamp(170px,16vw,240px); aspect-ratio: 4 / 5; border-radius: 14px; overflow: hidden; background: #111; border: 1px solid rgba(255,255,255,.06); }
.case-marquee__item img { width: 100%; height: 100%; object-fit: cover; display: block; }
@keyframes caseMarqueeRtl { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes caseMarqueeLtr { from { transform: translateX(-50%); } to { transform: translateX(0); } }
@media (prefers-reduced-motion: reduce) {
  .case-marquee__track { animation: none; }
  .case-marquee__row { -webkit-mask-image: none; mask-image: none; }
  .case-marquee__row--ltr .case-marquee__track { transform: translateX(-50%); }
}