/* ===============================================================
   IBM PLEX — iki katmanlı dizgi
   Sans: başlıklar, menü, düğmeler ve küçük etiketler.
   Serif: gövde metni, bülten yazıları ve alıntılar.

   Yazı tipleri sayfanın içine gömülüdür; dışarıya hiçbir istek
   yapılmaz, site çevrimdışıyken de aynı görünür. Sans tek bir
   değişken dosyadır (400-700 arası tüm ağırlıklar); Serif ise
   IBM'in yayımladığı TTF'lerden çıkarılmış dört ayrı yüzdür.

   İkisi de sitenin ihtiyaç duyduğu karakterlere indirgenmiştir:
   Latin, Latin-1, Latin Genişletilmiş-A, noktalama, para birimleri
   ve oklar. Türkçe harflerin tamamı ile -> <- — … · © ₺ kapsamdadır.

   Lisans: SIL Open Font License 1.1 — tam metin aşağıdadır. Bu
   lisans yalnızca yazı tipi dosyalarını bağlar; onunla hazırlanan
   belgeleri veya bu siteyi bağlamaz.
   ---------------------------------------------------------------
Copyright © 2017 IBM Corp. with Reserved Font Name "Plex"

This Font Software is licensed under the SIL Open Font License, Version 1.1.
This license is copied below, and is also available with a FAQ at:
https://openfontlicense.org

-----------------------------------------------------------
SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
-----------------------------------------------------------

PREAMBLE
The goals of the Open Font License (OFL) are to stimulate worldwide
development of collaborative font projects, to support the font creation
efforts of academic and linguistic communities, and to provide a free and
open framework in which fonts may be shared and improved in partnership
with others.

The OFL allows the licensed fonts to be used, studied, modified and
redistributed freely as long as they are not sold by themselves. The
fonts, including any derivative works, can be bundled, embedded, 
redistributed and/or sold with any software provided that any reserved
names are not used by derivative works. The fonts and derivatives,
however, cannot be released under any other type of license. The
requirement for fonts to remain under this license does not apply
to any document created using the fonts or their derivatives.

DEFINITIONS
"Font Software" refers to the set of files released by the Copyright
Holder(s) under this license and clearly marked as such. This may
include source files, build scripts and documentation.

"Reserved Font Name" refers to any names specified as such after the
copyright statement(s).

"Original Version" refers to the collection of Font Software components as
distributed by the Copyright Holder(s).

"Modified Version" refers to any derivative made by adding to, deleting,
or substituting -- in part or in whole -- any of the components of the
Original Version, by changing formats or by porting the Font Software to a
new environment.

"Author" refers to any designer, engineer, programmer, technical
writer or other person who contributed to the Font Software.

PERMISSION & CONDITIONS
Permission is hereby granted, free of charge, to any person obtaining
a copy of the Font Software, to use, study, copy, merge, embed, modify,
redistribute, and sell modified and unmodified copies of the Font
Software, subject to the following conditions:

1) Neither the Font Software nor any of its individual components,
in Original or Modified Versions, may be sold by itself.

2) Original or Modified Versions of the Font Software may be bundled,
redistributed and/or sold with any software, provided that each copy
contains the above copyright notice and this license. These can be
included either as stand-alone text files, human-readable headers or
in the appropriate machine-readable metadata fields within text or
binary files as long as those fields can be easily viewed by the user.

3) No Modified Version of the Font Software may use the Reserved Font
Name(s) unless explicit written permission is granted by the corresponding
Copyright Holder. This restriction only applies to the primary font name as
presented to the users.

4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
Software shall not be used to promote, endorse or advertise any
Modified Version, except to acknowledge the contribution(s) of the
Copyright Holder(s) and the Author(s) or with their explicit written
permission.

5) The Font Software, modified or unmodified, in part or in whole,
must be distributed entirely under this license, and must not be
distributed under any other license. The requirement for fonts to
remain under this license does not apply to any document created
using the Font Software.

TERMINATION
This license becomes null and void if any of the above conditions are
not met.

DISCLAIMER
THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
OTHER DEALINGS IN THE FONT SOFTWARE.
   =============================================================== */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url(/v/f/ibm-plex-sans-400.4ac64ca5.woff2) format('woff2');
  unicode-range: U+0020-007E, U+00A0-00FF, U+0100-017F, U+018F-0192, U+02BB-02BC, U+02C6-02C7, U+02DA-02DC, U+2000-206F, U+2070-2071, U+2074-209C, U+20A0-20BF, U+2113, U+2122, U+2126, U+2190-2193, U+2212-2215, U+2219-221A, U+2248, U+2260-2261, U+25CA, U+FB01-FB02, U+FEFF, U+FFFD;
}

/* Anasayfa Hakkımızda bölümü için sınırlı Google Sans Flex denemesi. */
@font-face {
  font-family: 'Google Sans Flex About';
  src: url('/v/f/google-sans-flex-about.ec1df903.woff2') format('woff2');
  font-style: normal;
  font-weight: 1 1000;
  font-display: swap;
}
@font-face {
  font-family: 'IBM Plex Serif';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/v/f/ibm-plex-serif-400.08c9e091.woff2) format('woff2');
  unicode-range: U+0020-007E, U+00A0-00FF, U+0100-017F, U+018F-0192, U+02BB-02BC, U+02C6-02C7, U+02DA-02DC, U+2000-206F, U+2070-2071, U+2074-209C, U+20A0-20BF, U+2113, U+2122, U+2126, U+2190-2193, U+2212-2215, U+2219-221A, U+2248, U+2260-2261, U+25CA, U+FB01-FB02, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'IBM Plex Serif';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(/v/f/ibm-plex-serif-400-italic.8540650b.woff2) format('woff2');
  unicode-range: U+0020-007E, U+00A0-00FF, U+0100-017F, U+018F-0192, U+02BB-02BC, U+02C6-02C7, U+02DA-02DC, U+2000-206F, U+2070-2071, U+2074-209C, U+20A0-20BF, U+2113, U+2122, U+2126, U+2190-2193, U+2212-2215, U+2219-221A, U+2248, U+2260-2261, U+25CA, U+FB01-FB02, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'IBM Plex Serif';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/v/f/ibm-plex-serif-500.57f8665f.woff2) format('woff2');
  unicode-range: U+0020-007E, U+00A0-00FF, U+0100-017F, U+018F-0192, U+02BB-02BC, U+02C6-02C7, U+02DA-02DC, U+2000-206F, U+2070-2071, U+2074-209C, U+20A0-20BF, U+2113, U+2122, U+2126, U+2190-2193, U+2212-2215, U+2219-221A, U+2248, U+2260-2261, U+25CA, U+FB01-FB02, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'IBM Plex Serif';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/v/f/ibm-plex-serif-600.cd8f39d2.woff2) format('woff2');
  unicode-range: U+0020-007E, U+00A0-00FF, U+0100-017F, U+018F-0192, U+02BB-02BC, U+02C6-02C7, U+02DA-02DC, U+2000-206F, U+2070-2071, U+2074-209C, U+20A0-20BF, U+2113, U+2122, U+2126, U+2190-2193, U+2212-2215, U+2219-221A, U+2248, U+2260-2261, U+25CA, U+FB01-FB02, U+FEFF, U+FFFD;
}

:root {
  color-scheme: light;

  --paper:       #FFFFFF;
  --mist:        #F6F5F4;  /* en açık ton — tonlu bölümler ve küçük kartlar */
  --ink:         #1E1B1A;  /* ana ton, gövde metni */
  --ink-soft:    #6E6663;  /* soluk metin */
  --brand:       #4A0000;  /* dolu bloklar: logo, başlık kutusu, footer */
  --link:        #7A0E0E;  /* bağlantı ve çerçeveler */
  --steel:       #DAD5D2;  /* bölüm üstü çizgi, geniş bant */
  --rule:        #E9E5E2;  /* saç teli çizgiler */
  --bar:         #DAD5D2;
  --bar-ink:     #4A0000;
  --on-brand:    #FFFFFF;
  --on-brand-dim:#E2C4C4;
  /* üst menü: hero üzerinde buzlu beyaz, hero geçilince saydam bordo */
  /* Hero'nun koyu alt yarısı menünün ardından geçerken koyu menü yazısı
     okunmaz hale geliyordu; perde ölçümle bu değere sabitlendi. */
  --bar-glass:      rgba(255, 255, 255, .62);
  --bar-glass-edge: rgba(28, 20, 18, .10);
  --bar-brand:      rgba(74, 0, 0, .62);
  /* menü içi küçük yazılar — cam zeminde 4.5:1 için ana tondan koyu */
  --bar-ink-soft:   #4A4441;
  --bar-link:       #6E0E0E;
  --veil-strong:    rgba(255, 255, 255, .80);
  --veil-soft:      rgba(255, 255, 255, .36);

  /* İki katman: arayüz ve başlıklar Sans, okunacak metin Serif.
     Aynı ailenin iki kardeşi oldukları için oranları ve ritimleri
     uyumlu. Yedekler yalnızca gömülü dosya yüklenemezse devreye girer. */
  --sans: "IBM Plex Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --serif: "IBM Plex Serif", Charter, Georgia, "Times New Roman", serif;

  --shell: 1380px;
  --gut: clamp(20px, 4.5vw, 76px);
  /* logo bloğunun asgari genişliği; gerçek genişlik ada göre büyür — bkz. .mark */
  --tile: clamp(78px, 6.6vw, 96px);

  /* geçiş hızı: bölüm yapıştıktan sonra ne kadar sabit kalsın (kaydırma pikseli) */
  --dwell: clamp(80px, 12vh, 170px);
  --slab-radius: 4px;
  --slab-shadow: 0 -16px 40px rgba(28, 20, 18, .18);
}

/* ---------------------------------------------------------------
   BASE
   --------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  /* clip, hidden'ın aksine kaydırma bağlamı yaratmaz — sticky çalışmaya devam eder */
  overflow-x: clip;
}

/* ---------------------------------------------------------------
   YIĞILAN BÖLÜMLER
   Her bölüm yapışır, bir sonraki bloğu üstüne kayarak gelir.
   Yapışma noktası JS'te hesaplanır: min(başlık yüksekliği, ekran - bölüm).
   --------------------------------------------------------------- */
/* Yapışkan bir öğe yalnızca kendi kapsayan kutusu içinde yapışık kalır.
   <main> son içerik bölümünde bittiği için oradaki bölümler, dışarıda kalan
   footer daha üzerlerine gelmeden yapışmayı bırakıyordu. display:contents ile
   <main> kutu üretmez; böylece footer dahil bütün bölümler <body> içinde
   yapışır ve sayfanın sonuna kadar yerlerinde kalır. */
main { display: contents; }

/* section.slab / footer.slab (0,1,1) — aşağıdaki .hero{position:relative} (0,1,0) ezmesin diye */
section.slab, footer.slab { position: sticky; top: 0; }

/* Bölümler artık üst üste binmiyor; sayfa normal akışta ilerliyor.
   Üst üste binme efekti yalnızca Görüşler bölümünün içinde,
   makaleler arasında kullanılıyor (bkz. .spot). */

/* min-height bölümü ekran boyuna büyüttüğünde artan boşluk ALTTA kalsın:
   üstteki saç teli çizgi bölümün başlangıcını işaretler, ortalanırsa o okuma
   bozulur; ayrıca gelen kart alttan geldiği için boşluğu önce o kapatır. */
.panel { justify-content: center; }

/* En alttaki katman — üstüne binen bir şey yok.
   Menü kadar yukarı çekilir ki fotoğraf saydam menünün ardından görünsün;
   yüksekliği de o kadar artar, böylece ekranı yine tam doldurur.
   (Yapışma noktası JS'te min(menü, ekran − bölüm) = 0 çıkar.) */
/* Hero, saydam menünün altından başlar ve ekranı tam doldurur. */
.hero {
  margin-top: calc(-1 * var(--head-h, 0px));
  min-height: 100vh;
}

a { color: inherit; text-decoration: none; }

:focus-visible {
  outline: 2px solid var(--link);
  outline-offset: 3px;
}

h1, h2, h3, h4 {
  font-weight: 600;
  /* Plex Sans, Helvetica'dan bir tık geniş; harf aralığı ona göre */
  letter-spacing: -0.028em;
  line-height: 0.96;
  text-wrap: balance;
  margin: 0;
}

p { margin: 0; }

/* içerik fotoğrafları siyah-beyaz basılır; logo hariç */
main img:not(.logo-img):not(.hero-img):not(.spot-foto):not(.fcard-img) { filter: grayscale(1); }
/* video kapakları CSS arkaplanı olduğu için yukarıdaki kural onları
   yakalamıyor; aynı kuralı ayrıca uygulamak gerekiyor */
.thumb--video, .thumb--kapak { filter: grayscale(1); }

.shell {
  max-width: var(--shell);
  margin-inline: auto;
  padding-inline: var(--gut);
}

.eyebrow {
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--ink-soft);
}

/* ---------------------------------------------------------------
   LOGO TILE + HEADER
   --------------------------------------------------------------- */
.mark {
  position: fixed;
  inset: 0 auto auto 0;
  z-index: 60;
  /* Genişlik logoya göre belirlenir; menü boşluğu JS'te --mark-w ile eşitlenir. */
  min-width: var(--tile);
  height: var(--tile);
  padding-inline: clamp(12px, 1.3vw, 20px);
  /* menü ile aynı cam: çubuğun tamamı tek parça görünsün */
  background: var(--bar-brand);
  -webkit-backdrop-filter: blur(26px) saturate(200%);
  backdrop-filter: blur(26px) saturate(200%);
  color: var(--on-brand);
  display: grid;
  align-content: center;
}
/* cam desteklenmeyen tarayıcıda düz bordoya döner */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .mark { background: var(--brand); }
  .topbar { background: rgba(255, 255, 255, .94); }
  .topbar.past-hero { background: rgba(74, 0, 0, .94); }
}
/* Büronun kendi logosu. Beyaz mürekkepli saydam PNG; her iki kullanım
   da bordo zemin üzerinde olduğu için tek bir dosya yetiyor. Görsel
   yalnızca burada bir kez gömülüdür, kullanan yerler genişlik verir. */
.logo-img {
  display: block;
  aspect-ratio: 1200 / 174;
  background: url(/v/g/logo.479852c6.png) center / contain no-repeat;
}
.mark .logo-img { width: clamp(165px, 16.6vw, 244px); }

.topbar {
  position: sticky;
  top: 0;
  z-index: 50;
  background: var(--bar-glass);
  /* Buzlu cam: arkadaki görüntü bulanır ve doygunlaşır; üstteki ince
     beyaz çizgi ile alttaki gölge camın kalınlığını duyurur. */
  -webkit-backdrop-filter: blur(26px) saturate(200%);
  backdrop-filter: blur(26px) saturate(200%);
  border-bottom: 1px solid var(--bar-glass-edge);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .46), 0 1px 14px rgba(28, 20, 18, .07);
  --ink-soft: var(--bar-ink-soft);
  --link: var(--bar-link);
  transition: background .45s ease, border-color .45s ease, color .45s ease,
              transform .34s cubic-bezier(.4, 0, .2, 1);
}

/* Görüşler yığını başlayınca menü yukarı çekilir. Logo karesi
   ayrı ve sabit konumlu bir öğe olduğu için o da birlikte gider;
   yoksa paneli örtmeye devam ediyor. */
body.spot-tam .topbar,
body.spot-tam .mark { transform: translateY(-100%); }
.mark { transition: transform .34s cubic-bezier(.4, 0, .2, 1); }

/* Hero üzerindeyken çubuğun zemini yok: yazılar fotoğrafın üstünde
   tek başına durur. Fotoğraf menünün ardından kayarken siyahtan
   beyaza kadar değiştiği için hiçbir düz renk her yerde okunmuyor;
   ölçümde beyaz açık ara en iyisi (piksellerin %33'ü eşik altı,
   mevcut koyu renkte %80). Harflere yumuşak gölge ekleniyor —
   bu bir zemin değil, harfin kendi kenarını taşıyan bir gölge. */
.topbar:not(.past-hero) {
  background: transparent;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  border-bottom-color: transparent;
  box-shadow: none;
  color: #000000;
  --ink-soft: #000000;
  --link:     #000000;
  /* Yazı siyah olunca gölgenin de rengi dönmek zorunda: siyah harfin
     altındaki siyah gölge görünmez, fotoğrafın koyu yerlerinde yazı
     yok olur. Bu yüzden halka açık tona çevrildi — harfin kendi
     kenarını taşır, arkasına kutu koymaz. */
  text-shadow:
    0 0 2px rgba(255, 255, 255, .95),
    0 1px 3px rgba(255, 255, 255, .85),
    0 0 16px rgba(255, 255, 255, .70);
}
.mark:not(.past-hero) {
  background: transparent;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  filter: drop-shadow(0 0 2px rgba(0, 0, 0, .85)) drop-shadow(0 1px 5px rgba(0, 0, 0, .6));
}


/* Hakkımızda bölümü bordo olduğu için çubuk zeminsiz kalırken menü
   yazıları beyaza döner. Bordo cam ancak Çalışma Alanları'nda başlar. */
.topbar.over-about:not(.open) {
  color: #FFFFFF;
  --ink-soft: #EBD0D0;
  --link: #FFFFFF;
  text-shadow: 0 1px 4px rgba(0, 0, 0, .62);
}


/* Masaüstünde hero fotoğrafı menünün altından geçerken sağ üstte
   kenarsız bir ışık perdesi kalır. Kutu oluşturmaz; sola doğru tamamen erir. */
@media (min-width: 761px) {
  .topbar:not(.past-hero):not(.over-about) {
    isolation: isolate;
  }

  .topbar:not(.past-hero):not(.over-about)::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 112px;
    z-index: 0;
    pointer-events: none;
    background: radial-gradient(ellipse 90% 100% at 100% 0%,
                rgba(255, 255, 255, .84) 0%,
                rgba(255, 255, 255, .64) 50%,
                rgba(255, 255, 255, 0) 100%);
  }

  .topbar:not(.past-hero):not(.over-about) .topbar-inner {
    position: relative;
    z-index: 1;
  }

  .topbar:not(.past-hero):not(.over-about) .nav {
    font-weight: 500;
    text-shadow: none;
  }
}
/* Telefonda menü açılınca liste fotoğrafın üstünde okunmaz kalırdı:
   açık durumda buzlu cam geri gelir. */
.topbar.open:not(.past-hero) {
  background: var(--bar-glass);
  -webkit-backdrop-filter: blur(26px) saturate(200%);
  backdrop-filter: blur(26px) saturate(200%);
  border-bottom-color: var(--bar-glass-edge);
  color: var(--ink);
  --ink-soft: var(--bar-ink-soft);
  --link:     var(--bar-link);
  text-shadow: none;
}

/* Hero geçildiğinde: saydam bordo.
   Token'lar burada yeniden tanımlanınca menü içindeki bütün yazı ve
   çerçeveler kendiliğinden açık tona döner. */
.topbar.past-hero {
  background: var(--bar-brand);
  border-bottom-color: rgba(255, 255, 255, .20);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .18), 0 1px 16px rgba(28, 20, 18, .14);
  color: #FFFFFF;
  --ink-soft: #EBD0D0;
  --link:     #F6D6D6;
  /* Bordo zeminde okunurluk zaten yeterli; gölge burada yalnızca
     saydam durumla aynı dokuyu korumak için ve çok daha hafif. */
  text-shadow: 0 1px 3px rgba(0, 0, 0, .40);
}
.topbar.past-hero .search:hover,
.topbar.past-hero .menu-btn:hover { color: #4A0000; }


/* Logo ve menü tek bir cam yüzey gibi görünür: logo kutusu ikinci kez
   yarı saydam bordo uygulamaz, alttaki tam genişlikteki çubuğu gösterir. */
.mark.past-hero {
  background: transparent;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

/* Çubuk artık içerik genişliğine değil ekranın kendisine dayanıyor:
   menü sağ kenara yaslanır, böylece hero fotoğrafının solundaki koyu
   köprü gövdesinin üstüne düşmez. */
.topbar-inner {
  width: 100%;
  margin-inline: 0;
  padding-right: var(--gut);
  min-height: var(--tile);
  padding-left: calc(var(--mark-w, var(--tile)) + 16px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-end;
  gap: 6px;
  padding-block: 10px;
}

.util {
  display: flex;
  gap: clamp(10px, 1.2vw, 18px);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-soft);
}
.util a { transition: color .18s ease; }
.util a:hover { color: var(--link); }

.nav {
  display: flex;
  align-items: center;
  gap: clamp(11px, 1.05vw, 15px);
  font-size: 14px;
}
.nav a { padding-block: 4px; border-bottom: 1px solid transparent; transition: border-color .18s ease; }
.nav a:hover { border-bottom-color: var(--link); }

.search {
  display: flex;
  align-items: center;
  gap: 12px;
  border: 1px solid var(--link);
  color: var(--link);
  background: none;
  font: inherit;
  font-size: 13px;
  padding: 7px 12px;
  cursor: pointer;
  transition: background .18s ease, color .18s ease, border-color .45s ease;
}
.search:hover { background: var(--link); color: var(--paper); }
.search svg { display: block; }

/* ---------------------------------------------------------------
   ÜST MENÜ — açılır çalışma alanları listesi
   --------------------------------------------------------------- */
.nav-item { position: relative; display: flex; align-items: center; gap: 6px; }
.drop-ok { flex: none; transition: transform .2s ease; }
.has-drop.acik .drop-ok { transform: rotate(180deg); }

.drop {
  text-shadow: none;
  /* menü bordoya döndüğünde --link/--ink-soft açık tona çevriliyor;
     panel her zaman beyaz olduğu için burada sayfa tonlarına geri döner */
  --ink: #1E1B1A;
  --ink-soft: #6E6663;
  --link: #7A0E0E;

  position: absolute;
  top: calc(100% + var(--drop-gap, 12px));
  left: 50%;
  transform: translateX(-50%) translateY(-6px);
  min-width: 290px;
  padding: 8px 0;
  background: var(--paper);
  border: 1px solid var(--rule);
  box-shadow: 0 18px 44px rgba(28, 20, 18, .16);
  opacity: 0;
  visibility: hidden;
  transition: opacity .22s ease, transform .22s ease, visibility .22s;
  z-index: 5;
}
.has-drop.acik .drop {
  opacity: 1;
  visibility: visible;
  transform: translateX(-50%) translateY(0);
}

.nav .drop a {
  display: block;
  padding: 9px clamp(16px, 1.6vw, 22px);
  font-size: clamp(13px, 1.02vw, 15px);
  line-height: 1.3;
  color: var(--ink);
  border-bottom: 0;
  white-space: nowrap;
  transition: background .16s ease, color .16s ease;
}
.nav .drop a:hover { background: var(--mist); color: var(--link); border-bottom-color: transparent; }
/* yayın başlıkları uzun: panel genişler ve satır sarması serbest kalır */
.nav .drop--wide { min-width: min(430px, 84vw); }
.nav .drop--wide a { white-space: normal; }
.nav .drop .drop-all {
  margin-top: 6px;
  padding-top: 13px;
  border-top: 1px solid var(--rule);
  font-weight: 500;
  color: var(--link);
}

.menu-btn { display: none; }

.lang {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.08em;
  color: var(--ink-soft);
}
.lang button {
  background: none;
  border: 0;
  padding: 2px 1px;
  font: inherit;
  letter-spacing: inherit;
  color: inherit;
  cursor: pointer;
  border-bottom: 1px solid transparent;
  transition: color .18s ease, border-color .18s ease;
}
.lang button:hover { color: var(--link); }
.lang button[aria-current="true"] {
  color: var(--link);
  border-bottom-color: currentColor;
  cursor: default;
}
.lang span { opacity: .5; }

/* ---------------------------------------------------------------
   HERO
   --------------------------------------------------------------- */
.hero {
  position: relative;
  height: clamp(420px, 62vh, 620px);
  background: #828282;
  overflow: hidden;
  isolation: isolate;
}

/* Boğaz Köprüsü — fotoğrafın kendi seçici rengi (kırmızı köprü, gri
   şehir) sitenin paletiyle örtüştüğü için siyah-beyaz kuralının
   dışında tutulur. */
.hero-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center 46%;
}

/* Fotoğrafın üstünde geometrik bir katman yok; yalnızca alttan yukarı
   sönen nötr bir karartma var. Ölçüm: metnin oturduğu alanın %96'sı
   zaten yeterince koyu, kalan %4'ü parlak bina yüzlerine denk geliyor
   ve beyaz yazıyı yutuyordu. Bu geçiş o bandı taşır, fotoğrafın
   rengine karışmaz. */
.hero::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(to bottom,
              rgba(18, 14, 14, 0) 34%,
              rgba(18, 14, 14, .50) 60%,
              rgba(18, 14, 14, .66) 76%,
              rgba(18, 14, 14, .74) 100%);
}

.hero-copy {
  position: absolute;
  right: var(--gut);
  bottom: clamp(38px, 7vh, 74px);
  width: min(56ch, 50%);
  color: #fff;
  z-index: 2;
}
.hero-copy h1,
.hero-copy .hero-baslik {
  font-size: clamp(24px, 3.1vw, 46px);
  line-height: 1.06;
  letter-spacing: -0.03em;
}

/* Üç başlık aynı ızgara gözünde üst üste durur: kapsayıcı en uzun
   metne göre boyutlanır, geçişte yükseklik oynamaz. */
.hero-rota { display: grid; }
.hero-slide {
  grid-area: 1 / 1;
  opacity: 0;
  transition: opacity .9s ease;
}
.hero-slide.is-on { opacity: 1; }
.hero-slide p { font-family: var(--serif);   /* okuma metni */
  margin-top: clamp(12px, 1.4vw, 20px);
  font-size: clamp(14px, 1.12vw, 17px);
  line-height: 1.55;
  color: #EAE5E2;
  max-width: 52ch;
}
@media (prefers-reduced-motion: reduce) {
  .hero-slide { transition: none; }
}
.hero-copy .eyebrow {
  color: #E2C4C4;
  margin-bottom: 16px;
}

/* ---------------------------------------------------------------
   SECTION SCAFFOLD
   --------------------------------------------------------------- */
/* yığılma için her bölümün zemini opak olmalı */
.band { padding-block: clamp(48px, 7vw, 104px); background: var(--paper); }
.band--mist { background: var(--mist); }

.grid {
  display: grid;
  /* sol sütun, en uzun bölüm başlığını ("Hakkımızda") taşırmadan alacak genişlikte */
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 1.95fr);
  gap: clamp(28px, 4vw, 64px);
  border-top: 1px solid var(--steel);
  padding-top: clamp(24px, 3vw, 44px);
}

.title {
  font-size: clamp(38px, 4.9vw, 70px);
  color: var(--ink);
  align-self: start;
}

.title-note { font-family: var(--serif);   /* okuma metni */
  margin-top: clamp(16px, 1.8vw, 26px);
  font-size: clamp(14px, 1.05vw, 16px);
  line-height: 1.55;
  color: var(--ink-soft);
  max-width: 34ch;
}

.title--tile {
  background: var(--brand);
  color: var(--on-brand);
  padding: clamp(16px, 2vw, 28px) clamp(16px, 2vw, 26px);
  justify-self: start;
  font-size: clamp(34px, 4.4vw, 62px);
}

/* ---------------------------------------------------------------
   PRACTICE AREAS
   --------------------------------------------------------------- */
/* Coverflow: 5 kart görünür, ortadaki tam boy, yanlar kademeli küçülür.
   Kartlar akıştan çıkarılıp merkeze göre konumlanır; yer değiştirme
   scrollLeft ile değil, aktif kartın indeksiyle yapılır. */
.flow {
  --fcard-w: clamp(210px, 23.5vw, 358px);
  position: relative;
  height: calc(var(--fcard-w) * 330 / 394);
  overflow: hidden;
  /* Dikey hareket sayfanın, yatay hareket karuselin: tarayıcı bunu
     bilirse parmakla yana kaydırırken sayfa dikey zıplamaz. */
  touch-action: pan-y;
}

.fcard {
  position: absolute;
  top: 50%;
  left: 50%;
  width: var(--fcard-w);
  aspect-ratio: 394 / 330;
  isolation: isolate;
  overflow: hidden;
  border-radius: var(--slab-radius);
  background: #1E1E1E;
  color: #fff;
  display: flex;
  align-items: flex-end;
  transform: translate(calc(-50% + var(--x, 0px)), -50%) scale(var(--s, 1));
  opacity: var(--o, 1);
  z-index: var(--z, 1);
  box-shadow: 0 14px 34px rgba(0, 0, 0, .34);
  transition: transform .55s cubic-bezier(.22, .7, .28, 1), opacity .45s ease;
  will-change: transform;
}
.fcard[aria-hidden="true"] { pointer-events: none; }

.fcard-img {
  position: absolute;
  inset: 0;
  z-index: -2;
  width: 100%;
  height: 100%;
  display: block;
  transition: filter .45s ease;
}
/* Kartlar gri durur; yalnızca öne gelen kart markanın bordosuna boyanır.
   Boyama SVG süzgeciyle yapılır: görüntü önce parlaklığa indirgenir, sonra
   siyahtan #4A0000'a uzanan bir renk rampasından geçirilir. Böylece renk
   yaklaşık değil, tam olarak marka tonunda çıkar. .is-front sınıfını oklar
   değiştirdiği için filtre de kendiliğinden öne gelen karta taşınır. */
.fcard-img { filter: grayscale(1); }
.fcard.is-front .fcard-img { filter: url(#bordoSuzgec); }
.fcard::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(to top, rgba(0, 0, 0, .82) 0%, rgba(0, 0, 0, .30) 34%, rgba(0, 0, 0, 0) 66%);
}
/* öndeki kart dışındakiler hafifçe geri çekilir */
.fcard:not(.is-front) { filter: brightness(.68); }
.fcard { transition: transform .55s cubic-bezier(.22, .7, .28, 1), opacity .45s ease, filter .45s ease; }

.fcard-label {
  padding: clamp(16px, 1.8vw, 26px) clamp(18px, 2vw, 30px);
  font-size: clamp(15px, 1.32vw, 20px);
  font-weight: 500;
  line-height: 1.24;
  letter-spacing: -0.01em;
  text-wrap: balance;
}

/* bölüm başlığı ve giriş cümlesi yan yana, kartlar tam genişlikte */
.grid--stack { grid-template-columns: minmax(0, 1fr); }
.areas-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: clamp(20px, 3vw, 56px);
  flex-wrap: wrap;
  margin-bottom: clamp(26px, 3.2vw, 48px);
}
.areas-head .title-note { margin-top: 0; max-width: 44ch; }

.rail-nav {
  display: flex;
  gap: 10px;
  justify-content: center;
  margin-top: clamp(18px, 2vw, 28px);
}
.rail-btn {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border: 1px solid var(--link);
  background: none;
  color: var(--link);
  cursor: pointer;
  transition: background .18s ease, color .18s ease, opacity .18s ease;
}
.rail-btn:hover:not(:disabled) { background: var(--link); color: var(--paper); }
.rail-btn:disabled { opacity: .3; cursor: default; }
.rail-btn svg { display: block; }

.wide-cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  background: var(--bar);
  color: var(--bar-ink);
  padding: clamp(14px, 1.7vw, 22px) clamp(16px, 2vw, 26px);
  margin-top: clamp(28px, 4vw, 54px);
  font-size: clamp(14px, 1.15vw, 17px);
  font-weight: 500;
}
.wide-cta span:last-child { transition: transform .22s ease; }
.wide-cta:hover span:last-child { transform: translateX(7px); }

/* Alt başlıklar (Kimliğimiz / Değerlerimiz / Rakamlarla) metnin solunda,
   bölüm başlığı ile içerik arasında durur. */
.about-body { display: flex; flex-direction: column; gap: clamp(30px, 3.6vw, 56px); }
.about-block {
  display: grid;
  grid-template-columns: minmax(110px, 0.4fr) minmax(0, 1.6fr);
  gap: clamp(16px, 2.2vw, 36px);
}
.about-block > .eyebrow { padding-top: 20px; }

/* Hakkımızda: başlık üstte, içerik onun altında tam genişlikte ve sola
   yaslı. Alt başlıklar (Kimliğimiz / Değerlerimiz / Rakamlarla) kendi
   bloklarının üstünde durur. */
.grid--yigin { grid-template-columns: minmax(0, 1fr); }
.about-body .about-block { grid-template-columns: minmax(0, 1fr); gap: 12px; }
.about-body .about-block > .eyebrow { padding-top: 0; }

/* iki tanıtım kutusu yan yana */

/* tam genişlikte dört değer yan yana; altındaki dört rakamla aynı ritim */

/* içerik artık dar sütunda değil; rakamlar özgün puntosuna dönebilir */
.about-block .stat b { font-size: clamp(36px, 4vw, 62px); }

/* ---------------------------------------------------------------
   HAKKIMIZDA
   --------------------------------------------------------------- */
/* Fotoğraf zeminli tanıtım kutusu: görselin üzerine yoğun beyaz bir
   perde çekilir, metin koyu bordo kalır ve okunurluk korunur. */

/* Değer kartı: kapalıyken yalnızca değerin adı görünür.
   Üzerine gelince (dokunmatikte tıklayınca) bordo zemin aşağıdan
   yükselir ve açıklama başlığın altında açılır. Kart yüksekliği
   sabit tutulduğu için ızgara oynamaz. */

/* açılma işareti — kapalıyken artı, açıkken çarpı */

.value-art::before,

.value:hover,
.value:focus-visible,

.value:hover::before,
.value:focus-visible::before,

.value:hover .value-metin,
.value:focus-visible .value-metin,

.value:hover .value-art,
.value:focus-visible .value-art,

@media (prefers-reduced-motion: reduce) {

}

/* ---------------------------------------------------------------
   GÖRSELLİ KART MOZAİĞİ (müvekkil haberleri)
   --------------------------------------------------------------- */
.mosaic {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.mosaic-head {
  grid-column: 1;
  background: var(--brand);
  color: var(--on-brand);
  font-size: clamp(30px, 3.6vw, 54px);
  padding: clamp(18px, 2.2vw, 32px);
  display: flex;
  align-items: flex-start;
}

.tile {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: clamp(210px, 23vw, 310px);
  background: #232323;
  color: #fff;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 16px;
  padding: clamp(14px, 1.7vw, 24px);
}
.tile--wide { grid-column: 2 / 4; }

.tile-img {
  position: absolute;
  inset: 0;
  z-index: -2;
  width: 100%;
  height: 100%;
  display: block;
  transform: scale(1.01);
  transition: transform .5s cubic-bezier(.2, .7, .3, 1);
}
.tile::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(180deg,
    rgba(0, 0, 0, .64) 0%, rgba(0, 0, 0, .10) 34%,
    rgba(0, 0, 0, .32) 62%, rgba(0, 0, 0, .88) 100%);
}
.tile:hover .tile-img { transform: scale(1.06); }

.tile-meta { display: flex; flex-direction: column; gap: 3px; }
.tile .eyebrow { color: #D6D0CD; }
.tile-meta time { font-size: 13px; color: #D6D0CD; font-variant-numeric: tabular-nums; }

.tile-title {
  font-family: var(--serif);
  font-weight: 400;
  font-size: clamp(18px, 1.75vw, 30px);
  line-height: 1.14;
  letter-spacing: -0.015em;
  max-width: 21ch;
}
/* geniş kartta başlığın altına kısa bir açıklama sığar */
.tile--wide .tile-title { max-width: 26ch; }
.tile-ozet {
  margin-top: 12px;
  font-family: var(--serif);
  font-size: clamp(12.5px, 0.95vw, 14.5px);
  line-height: 1.45;
  color: #E4DEDB;
  max-width: 42ch;
}
.tile--wide .tile-ozet {
  margin-top: 12px;
  font-size: clamp(13px, 1.05vw, 16px);
  line-height: 1.5;
  max-width: 52ch;
}
/* gövde metni taşıyan her kartta perde bir kademe yoğun */
.tile:has(.tile-ozet)::after {
  background: linear-gradient(to top,
    rgba(16, 10, 10, .92) 0%,
    rgba(16, 10, 10, .84) 46%,
    rgba(16, 10, 10, .66) 78%,
    rgba(16, 10, 10, .46) 100%);
}

/* ---------------------------------------------------------------
   BÜRO HABERLERİ — görsel bant + üzerine binen panel
   --------------------------------------------------------------- */
.firm {
  background: var(--paper);
  padding-bottom: clamp(48px, 7vw, 104px);
  overflow: hidden; /* yuvarlatılmış üst köşeler görsel bandı kessin */
}

.firm-band {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  height: clamp(250px, 32vw, 390px);
  background: #191919;
  display: flex;
  align-items: center;
}
.firm-band-img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; display: block; }

/* Gerçek fotoğraflar: canvas gibi alanı doldurur, en-boy oranı korunur. */
img.fcard-img, img.firm-band-img, img.tile-img, img.yk-img, img.band-img {
  object-fit: cover;
  object-position: center;
}
.firm-band::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(90deg, rgba(0, 0, 0, .74) 0%, rgba(0, 0, 0, .28) 58%, rgba(0, 0, 0, .58) 100%);
}
.firm-band-title {
  color: #fff;
  font-size: clamp(38px, 5vw, 76px);
  width: 100%;
  max-width: var(--shell);
  margin-inline: auto;
  padding-inline: var(--gut);
}

.firm-panel {
  position: relative;
  z-index: 2;
  background: var(--paper);
  width: min(1040px, calc(100% - 2 * var(--gut)));
  margin: clamp(-110px, -8vw, -56px) auto 0;
  padding: clamp(22px, 3vw, 46px);
  box-shadow: 0 -10px 34px rgba(0, 0, 0, .18);
}

.firm-lead {
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(0, 1.5fr);
  gap: clamp(20px, 3vw, 46px);
  align-items: start;
}
.firm-lead-body { border-top: 3px solid var(--steel); padding-top: 16px; }
.firm-lead-body time {
  display: block;
  font-size: 13px;
  color: var(--ink-soft);
  font-variant-numeric: tabular-nums;
}
.firm-lead-body h3 {
  font-family: var(--serif);
  font-weight: 400;
  font-size: clamp(22px, 2.3vw, 36px);
  line-height: 1.14;
  letter-spacing: -0.015em;
  margin-block: 10px 16px;
}
.firm-lead-body h3 a { border-bottom: 1px solid transparent; transition: border-color .18s ease; }
.firm-lead-body h3 a:hover { border-bottom-color: var(--link); }
.firm-lead-body p {
  font-family: var(--serif);
  font-size: clamp(15px, 1.15vw, 17px);
  line-height: 1.55;
  color: var(--ink-soft);
}
.firm-lead-body p a { color: var(--link); border-bottom: 1px solid currentColor; }

.thumb {
  position: relative;
  overflow: hidden;
  background: #6F6F6F;
  aspect-ratio: 4 / 3;
}
/* küçük kart görseli: tuval de fotoğraf da aynı kutuyu doldurur */
.thumb canvas,
.thumb img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}
.thumb--portrait { aspect-ratio: 1 / 1; }

/* Video kapağı: gerçek karesi 16:9 olduğu için oran korunur; üzerinde
   oynatma işareti ve süre rozeti durur. */
.thumb--video {
  display: block;              /* bağlantı olduğu için satır içi kalmasın */
  aspect-ratio: 16 / 9;
  background: #101010 url(/v/g/gorsel.d46c817e.jpg) center / cover no-repeat;
}
.thumb--video::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(16, 3, 3, .12);
  transition: background .32s ease;
}
.oynat {
  position: absolute;
  inset: auto auto 10px 10px;   /* kapağın kendi başlığı ortada duruyor */
  z-index: 2;
  width: clamp(40px, 4.2vw, 52px);
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(74, 0, 0, .86);
  border: 1px solid rgba(255, 255, 255, .34);
  transition: transform .32s cubic-bezier(.22, .7, .28, 1), background .28s ease;
}
.oynat::before {
  content: "";
  width: 0;
  height: 0;
  margin-left: 4px;
  border-left: clamp(11px, 1.15vw, 14px) solid #FFFFFF;
  border-top: clamp(7px, 0.72vw, 9px) solid transparent;
  border-bottom: clamp(7px, 0.72vw, 9px) solid transparent;
}
.sure {
  position: absolute;
  right: 10px;
  bottom: 10px;
  z-index: 2;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.06em;
  color: #FFFFFF;
  background: rgba(16, 3, 3, .78);
  padding: 4px 8px;
  font-variant-numeric: tabular-nums;
}
.firm-lead a:hover .thumb--video::after,
.firm-lead a:focus-visible .thumb--video::after { background: rgba(74, 0, 0, .28); }
.firm-lead a:hover .oynat,
.firm-lead a:focus-visible .oynat { transform: scale(1.12); background: rgba(74, 0, 0, .95); }
.thumb-kaynak {
  display: block;
  margin-top: 9px;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-soft);
}
.thumb-mono {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  font-family: var(--serif);
  font-size: clamp(40px, 5.5vw, 82px);
  letter-spacing: 0.03em;
  color: rgba(255, 255, 255, .74);
}

.firm-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(12px, 1.6vw, 20px);
  margin-top: clamp(24px, 3.4vw, 44px);
}
.firm-card {
  display: grid;
  grid-template-columns: clamp(96px, 12vw, 148px) minmax(0, 1fr);
  gap: clamp(14px, 1.6vw, 22px);
  align-items: center;
  background: var(--mist);
  padding: clamp(12px, 1.4vw, 18px);
}
.firm-card time {
  display: block;
  font-size: 12px;
  color: var(--ink-soft);
  margin-bottom: 8px;
  font-variant-numeric: tabular-nums;
}
.firm-card h4 {
  font-family: var(--serif);
  font-weight: 400;
  font-size: clamp(15px, 1.25vw, 19px);
  line-height: 1.2;
  letter-spacing: -0.01em;
  transition: color .18s ease;
}
.firm-card:hover h4 { color: var(--link); }

/* Panel kaydı: video henüz yayımlanmadığı için kart bağlantı değil.
   Yine de oynatma işareti ve süre rozeti taşır. */
.firm-card--pasif { cursor: default; }
.firm-card .thumb--kapak {
  background: #101010 var(--kapak) center / cover no-repeat;
  aspect-ratio: 4 / 3;
}
.thumb--panel { --kapak: url(/v/g/gorsel.8d33660d.jpg); }
/* küçük kart görselinde işaretler de küçülür */
.firm-card .oynat {
  inset: auto auto 6px 6px;
  width: clamp(26px, 2.6vw, 32px);
  border-width: 1px;
}
.firm-card .oynat::before {
  margin-left: 2px;
  border-left: clamp(7px, 0.72vw, 9px) solid #FFFFFF;
  border-top: clamp(4.5px, 0.46vw, 5.5px) solid transparent;
  border-bottom: clamp(4.5px, 0.46vw, 5.5px) solid transparent;
}
.firm-card .sure { right: 6px; bottom: 6px; font-size: 10px; padding: 3px 6px; }

/* ---------------------------------------------------------------
   NEWS CARDS
   --------------------------------------------------------------- */
.cards {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(22px, 3vw, 46px);
}
.card {
  border-top: 1px solid var(--rule);
  padding-top: 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.card time {
  font-size: 13px;
  color: var(--ink-soft);
  font-variant-numeric: tabular-nums;
}
.card h3 {
  font-size: clamp(17px, 1.45vw, 21px);
  line-height: 1.22;
  letter-spacing: -0.02em;
}
.card a { border-bottom: 1px solid transparent; transition: border-color .18s ease; }
.card:hover a { border-bottom-color: var(--link); }

.more {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-top: clamp(24px, 3vw, 40px);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--link);
  border-bottom: 1px solid var(--steel);
  padding-bottom: 4px;
}
.more span { transition: transform .22s ease; }
.more:hover span { transform: translateX(6px); }

/* ---------------------------------------------------------------
   STATS
   --------------------------------------------------------------- */
.stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(16px, 2vw, 32px);
}
.stat { border-top: 1px solid var(--rule); padding-top: 18px; }
.stat b {
  display: block;
  /* en uzun değer "+250" — dört karakter sütuna sığmalı */
  font-size: clamp(42px, 5.3vw, 78px);
  font-weight: 700;
  line-height: 0.86;
  letter-spacing: -0.05em;
  font-variant-numeric: tabular-nums;
}
.stat p {
  margin-top: 14px;
  font-size: clamp(14px, 1.2vw, 17px);
  color: var(--ink-soft);
  max-width: 22ch;
}
.stat a {
  display: inline-block;
  margin-top: 16px;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--link);
  border-bottom: 1px solid var(--steel);
  padding-bottom: 3px;
}

/* ---------------------------------------------------------------
   OFFICES
   --------------------------------------------------------------- */
.contact {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(28px, 4vw, 60px);
}
.office-card .tel a { border-bottom: 1px solid var(--steel); }
.office-card .tel a:hover { border-bottom-color: var(--link); color: var(--link); }
/* yayın başlıkları uzun; tek sütun okunaklı kalıyor. Kategori başlığın üstünde. */
.stack--2 .eyebrow { display: block; margin-bottom: 6px; }
.city-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
}
.city-list button {
  width: 100%;
  text-align: left;
  background: none;
  border: 0;
  border-top: 1px solid var(--rule);
  font: inherit;
  font-size: clamp(16px, 1.5vw, 21px);
  letter-spacing: -0.02em;
  color: var(--ink-soft);
  padding: 13px 0;
  cursor: pointer;
  transition: color .18s ease, padding-left .22s ease;
}
.city-list button:hover { color: var(--ink); padding-left: 8px; }
.city-list button[aria-selected="true"] { color: var(--ink); font-weight: 700; }

.office-card { border-top: 1px solid var(--steel); padding-top: 20px; }
.office-card h3 {
  font-size: clamp(28px, 3.4vw, 46px);
}
.office-card address {
  font-style: normal;
  margin-top: 18px;
  font-size: clamp(15px, 1.2vw, 18px);
  line-height: 1.55;
  color: var(--ink-soft);
  white-space: pre-line;
}
.office-card .tel {
  margin-top: 14px;
  font-variant-numeric: tabular-nums;
  font-size: 15px;
  color: var(--ink);
}

/* ---------------------------------------------------------------
   TWO-COLUMN EDITORIAL (firm news + awards)
   --------------------------------------------------------------- */
.split {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(32px, 5vw, 76px);
}
.split > section { display: flex; flex-direction: column; }
.split h2 {
  font-size: clamp(32px, 3.8vw, 54px);
  border-top: 1px solid var(--steel);
  padding-top: clamp(18px, 2vw, 28px);
  margin-bottom: clamp(20px, 2.5vw, 34px);
}
.lead h3 {
  font-size: clamp(19px, 1.7vw, 25px);
  line-height: 1.2;
  margin-block: 8px 12px;
}
.lead p { color: var(--ink-soft); font-size: 15px; line-height: 1.55; }
.stack {
  list-style: none;
  margin: clamp(20px, 2.5vw, 32px) 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
}
.stack li { border-top: 1px solid var(--rule); padding: 15px 0; }
.stack time { display: block; font-size: 12px; color: var(--ink-soft); margin-bottom: 6px; font-variant-numeric: tabular-nums; }
.stack a { font-size: clamp(15px, 1.25vw, 18px); line-height: 1.28; letter-spacing: -0.015em; border-bottom: 1px solid transparent; transition: border-color .18s ease; }
.stack li:hover a { border-bottom-color: var(--link); }

/* ---------------------------------------------------------------
   PANELS (careers / pro bono)
   --------------------------------------------------------------- */
.panels {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  background: var(--paper);
  overflow: hidden; /* köşe yarıçapı alt panelleri kessin */
}
.panel {
  padding: clamp(34px, 5vw, 76px) clamp(24px, 4vw, 62px);
  display: flex;
  flex-direction: column;
  gap: 18px;
  align-items: flex-start;
}
.panel h2 { font-size: clamp(30px, 3.6vw, 52px); }
.panel p { font-family: var(--serif);   /* okuma metni */ font-size: clamp(15px, 1.25vw, 18px); line-height: 1.5; max-width: 46ch; }
.panel--brand { background: var(--brand); color: var(--on-brand); }
.panel--brand p { color: var(--on-brand-dim); }
.panel--mist { background: var(--mist); color: var(--ink); }
.panel--mist p { color: var(--ink-soft); }
.panel .more { color: inherit; border-bottom-color: currentColor; opacity: .9; margin-top: 6px; }

/* ---------------------------------------------------------------
   EKİBİMİZ — ayrı sayfa görünümü (#ekibimiz)
   Yığılan bölümler gizlenir, footer akışa döner.
   --------------------------------------------------------------- */
.team {
  display: none;
  background: var(--paper);
  padding-bottom: clamp(48px, 7vw, 104px);
}
.team > .shell { margin-top: clamp(36px, 4.6vw, 72px); }
body.ekip-gorunum .team { display: block; }

/* alt sayfalarda yığılan bölümler gizlenir, menü tam bordo olur, footer akışa döner */
body.ekip-gorunum main,
body.iletisim-gorunum main,
body.alan-gorunum main,
body.kariyer-gorunum main,
body.yayin-gorunum main,
body.hukuki-gorunum main { display: none; }
body.ekip-gorunum .topbar,
body.iletisim-gorunum .topbar,
body.alan-gorunum .topbar,
body.kariyer-gorunum .topbar,
body.yayin-gorunum .topbar,
body.hukuki-gorunum .topbar { background: var(--bar-brand); }

body.ekip-gorunum .foot,
body.iletisim-gorunum .foot,
body.alan-gorunum .foot,
body.kariyer-gorunum .foot,
body.yayin-gorunum .foot,
body.hukuki-gorunum .foot {
  position: static;
  border-radius: 0;
  box-shadow: none;
  min-height: 0;
  margin: 0;
}

.team-note { font-family: var(--serif);   /* okuma metni */
  margin-top: clamp(14px, 1.6vw, 22px);
  font-size: clamp(15px, 1.2vw, 18px);
  line-height: 1.55;
  color: var(--ink-soft);
  max-width: 56ch;
}

.team-filter {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) repeat(4, minmax(0, 1fr));
  gap: clamp(12px, 1.4vw, 20px);
  align-items: end;
  margin-top: clamp(28px, 3.4vw, 48px);
  padding-top: clamp(20px, 2.4vw, 32px);
  border-top: 1px solid var(--steel);
}
.team-filter label,
.team-filter .tf-field { display: flex; flex-direction: column; gap: 7px; }
.team-filter .tf-cap {
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--ink-soft);
}
.team-filter input,
.team-filter select {
  font: inherit;
  font-size: clamp(14px, 1.05vw, 16px);
  color: var(--ink);
  background: var(--paper);
  border: 1px solid var(--rule);
  border-radius: 0;
  padding: 11px 12px;
  width: 100%;
  min-width: 0;
  transition: border-color .18s ease;
}
.team-filter select {
  appearance: none;
  -webkit-appearance: none;
  padding-right: 34px;
  background-image: linear-gradient(45deg, transparent 50%, currentColor 50%),
                    linear-gradient(135deg, currentColor 50%, transparent 50%);
  background-position: calc(100% - 19px) calc(50% + 1px), calc(100% - 13px) calc(50% + 1px);
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
  cursor: pointer;
}
.team-filter input:focus,
.team-filter select:focus { border-color: var(--link); outline: none; }

.team-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: clamp(20px, 2.6vw, 36px);
  margin-top: clamp(28px, 3.4vw, 44px);
}
.team-card { border-top: 1px solid var(--rule); padding-top: 16px; }
.team-photo {
  position: relative;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  background: #6F6F6F;
  margin-bottom: 16px;
}
.team-photo canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.team-photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.team-photo span {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  font-family: var(--serif);
  font-size: clamp(40px, 4.6vw, 66px);
  letter-spacing: 0.03em;
  color: rgba(255, 255, 255, .76);
}
.team-card h3 { font-size: clamp(18px, 1.5vw, 23px); }
.team-role {
  margin-top: 6px;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: var(--link);
}
.team-bio {
  margin-top: 12px;
  font-family: var(--serif);
  font-size: 15px;
  line-height: 1.55;
  color: var(--ink-soft);
}
.team-mail {
  display: inline-block;
  margin-top: 14px;
  font-size: 14px;
  color: var(--link);
  border-bottom: 1px solid var(--steel);
  padding-bottom: 2px;
}
.team-mail:hover { border-bottom-color: currentColor; }

.team-empty {
  margin-top: clamp(28px, 3.4vw, 44px);
  padding-top: 20px;
  border-top: 1px solid var(--rule);
  font-size: clamp(15px, 1.2vw, 17px);
  color: var(--ink-soft);
}

.team-band {
  margin-top: clamp(40px, 5vw, 76px);
  background: var(--brand);
  color: var(--on-brand);
  border-radius: var(--slab-radius);
  padding: clamp(28px, 3.6vw, 54px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: clamp(20px, 3vw, 48px);
  flex-wrap: wrap;
}
.team-band p { font-family: var(--serif);   /* okuma metni */
  font-size: clamp(16px, 1.4vw, 21px);
  line-height: 1.45;
  max-width: 62ch;
}
.team-band button {
  flex: none;
  font: inherit;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: var(--on-brand);
  background: none;
  border: 1px solid var(--on-brand-dim);
  padding: 13px 22px;
  cursor: pointer;
  transition: background .18s ease, color .18s ease;
}
.team-band button:hover { background: var(--on-brand); color: var(--brand); }
/* banttaki bağlantı, butonla aynı görünür */
.team-band .band-cta {
  flex: none;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: var(--on-brand);
  border: 1px solid var(--on-brand-dim);
  padding: 13px 22px;
  transition: background .18s ease, color .18s ease;
}
.team-band .band-cta:hover { background: var(--on-brand); color: var(--brand); }

/* ---------------------------------------------------------------
   YAYIN SAYFASI — yan sütundaki iletişim kartı
   --------------------------------------------------------------- */
.ask-kart {
  display: grid;
  grid-template-columns: clamp(64px, 6vw, 84px) minmax(0, 1fr);
  gap: clamp(12px, 1.3vw, 18px);
  align-items: center;
  margin-top: 12px;
  padding: clamp(12px, 1.3vw, 16px);
  background: var(--paper);
  border: 1px solid var(--rule);
  border-left: 3px solid var(--brand);
  border-radius: 2px;
  transition: border-color .2s ease, box-shadow .24s ease, transform .24s ease;
}
.ask-kart:hover {
  border-color: var(--steel);
  border-left-color: var(--brand);
  box-shadow: 0 10px 26px rgba(28, 20, 18, .10);
  transform: translateY(-2px);
}
.ask-foto {
  position: relative;
  display: block;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  background: #6F6F6F;
}
.ask-foto canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.ask-foto > span {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  font-family: var(--serif);
  font-size: clamp(20px, 2vw, 28px);
  letter-spacing: 0.03em;
  color: rgba(255, 255, 255, .78);
}
.ask-bilgi { display: block; min-width: 0; }
.ask-ad {
  display: block;
  font-size: clamp(14px, 1.1vw, 16px);
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -0.01em;
  color: var(--ink);
}
.ask-rol {
  display: block;
  margin-top: 4px;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-soft);
}
.ask-git {
  display: block;
  margin-top: 9px;
  font-size: 12px;
  font-weight: 500;
  color: var(--link);
}
.ask-git span { display: inline-block; transition: transform .22s ease; }
.ask-kart:hover .ask-git span { transform: translateX(5px); }

/* ---------------------------------------------------------------
   Dar ekranda kişi kartı
   --------------------------------------------------------------- */
@media (max-width: 620px) {
  .ask-kart { grid-template-columns: 74px minmax(0, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
  .ask-kart { transition-duration: .01ms; }
}

/* ---------------------------------------------------------------
   GÖRÜŞLER — üst üste binen yayın panelleri
   Her panel ekranın tepesine yapışır; bir sonraki alttan gelip onun
   önüne geçer. Sıra z-index ile kurulur, üstteki gölge birleşme
   yerini görünür kılar. Efekt tamamen CSS ile çalışır.
   --------------------------------------------------------------- */
.spot { position: relative; margin-top: clamp(26px, 3.2vw, 46px); }
/* Paneller ekranın tepesine yapışır ve tamamını kaplar; üst menü
   yığın başlarken yukarı çekildiği için altında kalan olmaz.
   (Panel ölçüleri sabit tutuldu: menüye göre değişseydi yığının boyu
   kaydırma sırasında uzayıp kısalır, sayfa zıplardı.) */
.spot-panel {
  position: sticky;
  top: 0;
  z-index: var(--z, 1);
  min-height: 100vh;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
  align-items: stretch;
  background: var(--paper);
  border-top: 1px solid var(--rule);
  box-shadow: 0 -14px 34px rgba(28, 20, 18, .26);
  overflow: hidden;
}
.spot-panel:first-child { box-shadow: none; }   /* üstüne binen bir şey yok */

.spot-copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: clamp(10px, 1.2vw, 18px);
  padding: clamp(34px, 5vw, 84px) clamp(22px, 4.2vw, 76px);
}
.spot-label {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--ink-soft);
}
.spot-label::before { content: ""; width: 26px; height: 1px; background: var(--brand); }
.spot-tur {
  font-size: clamp(13px, 1.05vw, 15px);
  font-weight: 500;
  color: var(--link);
}
.spot-title {
  font-size: clamp(25px, 3vw, 48px);
  line-height: 1.08;
  letter-spacing: -0.028em;
  max-width: 21ch;
}
.spot-desc {
  font-family: var(--serif);
  font-size: clamp(15px, 1.2vw, 18px);
  line-height: 1.55;
  color: var(--ink-soft);
  max-width: 46ch;
}
.spot-cta {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin-top: clamp(6px, 1vw, 14px);
  padding: 13px 22px;
  background: var(--brand);
  color: var(--on-brand);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}
.spot-cta span:last-child { transition: transform .22s ease; }
.spot-cta:hover span:last-child { transform: translateX(6px); }
.spot-panel--yakinda .yakinda-etiket { margin-top: clamp(6px, 1vw, 14px); }

.spot-media { position: relative; overflow: hidden; background: #1C1C1C; }
.spot-media canvas,
.spot-media img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}
.spot-panel--yakinda .spot-media canvas { filter: brightness(.55); }

@media (max-width: 900px) {
  .spot-panel { grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, 1fr) minmax(170px, .8fr); }
  .spot-copy { justify-content: flex-end; }
}
/* hareket azaltma tercihinde paneller üst üste binmez, alt alta sıralanır */
@media (prefers-reduced-motion: reduce) {
  .spot-panel { position: static; min-height: 0; box-shadow: none; }
}

/* içeriği hazırlanan yayınlar: panel almaz, kısa liste olarak durur */
.hazir {
  margin-top: clamp(30px, 4vw, 58px);
  padding-top: clamp(20px, 2.4vw, 30px);
  border-top: 1px solid var(--steel);
}
.hazir-liste {
  list-style: none;
  margin: clamp(14px, 1.8vw, 22px) 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 clamp(24px, 3vw, 52px);
}
.hazir-liste li { border-top: 1px solid var(--rule); padding: 14px 0; }
.hazir-tur {
  display: block;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-soft);
  margin-bottom: 6px;
}
.hazir-bas {
  display: block;
  font-family: var(--serif);
  font-size: clamp(15px, 1.2vw, 18px);
  line-height: 1.28;
  letter-spacing: -0.012em;
  color: var(--ink-soft);
}
@media (max-width: 760px) { .hazir-liste { grid-template-columns: minmax(0, 1fr); } }

/* ---------------------------------------------------------------
   YASAL METİNLER (#hukuki-<kisaad>) — tek sütun, uzun okuma
   --------------------------------------------------------------- */
.legal-page { display: none; background: var(--paper); padding-bottom: clamp(48px, 7vw, 104px); }
.legal-page.is-acik { display: block; }

.legal-body {
  margin-top: clamp(26px, 3.2vw, 44px);
  max-width: 78ch;
}
.legal-body > *:first-child { margin-top: 0; }
.legal-body p {
  font-family: var(--serif);
  font-size: clamp(15px, 1.12vw, 17px);
  line-height: 1.68;
  color: var(--ink);
  margin-top: 1.05em;
}
.legal-body h3 {
  font-size: clamp(18px, 1.7vw, 25px);
  line-height: 1.2;
  margin-top: clamp(28px, 3vw, 44px);
  padding-top: clamp(13px, 1.5vw, 18px);
  border-top: 1px solid var(--rule);
}
.legal-body h3:first-of-type { margin-top: clamp(20px, 2.2vw, 30px); }
.legal-body h4 {
  font-size: clamp(16px, 1.35vw, 19px);
  margin-top: clamp(20px, 2.2vw, 30px);
}
.legal-body ul {
  list-style: none;
  margin: 1em 0 0;
  padding: 0;
}
.legal-body li {
  position: relative;
  padding-left: 22px;
  margin-top: 10px;
  font-family: var(--serif);
  font-size: clamp(15px, 1.12vw, 17px);
  line-height: 1.6;
  color: var(--ink);
}
.legal-body li::before {
  content: "";
  position: absolute;
  left: 4px;
  top: 0.62em;
  width: 6px;
  height: 1px;
  background: var(--brand);
}
.legal-body a { color: var(--link); border-bottom: 1px solid var(--steel); }
.legal-body a:hover { border-bottom-color: var(--link); }
.legal-body strong { font-weight: 600; }

/* çerez tablosu dar ekranda kendi içinde kayar */
.legal-tablo { overflow-x: auto; margin-top: clamp(18px, 2vw, 26px); }
.legal-tablo table { border-collapse: collapse; width: 100%; min-width: 560px; }
.legal-tablo th,
.legal-tablo td {
  text-align: left;
  vertical-align: top;
  padding: 11px 14px 11px 0;
  border-bottom: 1px solid var(--rule);
  font-size: clamp(13px, 1.02vw, 15px);
  line-height: 1.45;
}
.legal-tablo th {
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.11em;
  text-transform: uppercase;
  color: var(--ink-soft);
  border-bottom: 1px solid var(--steel);
}
.legal-tablo td { font-family: var(--serif); color: var(--ink); }

/* metinler İngilizce yayımlandı; Türkçe görünümde okuyucuya not düşülür */
.legal-dil { display: none; }
html:not([lang="en"]) .legal-dil {
  display: block;
  font-family: var(--sans);
  font-size: clamp(13px, 1vw, 15px);
  line-height: 1.55;
  color: var(--ink-soft);
  background: var(--mist);
  border-left: 3px solid var(--brand);
  padding: 14px 18px;
  margin-bottom: clamp(22px, 2.4vw, 34px);
}

/* ---------------------------------------------------------------
   YAYIN SAYFASI (#yayin-<kisaad>) — bülten metni + yan sütun
   --------------------------------------------------------------- */
.post-page { display: none; background: var(--paper); padding-bottom: clamp(48px, 7vw, 104px); }
.post-page.is-acik { display: block; }

/* bülten başlıkları uzun: bant büyür, başlık küçük puntoyla akar */
.page-banner.post-banner {
  height: auto;
  min-height: clamp(230px, 30vw, 380px);
  padding-top: calc(var(--head-h, 96px) + clamp(20px, 2.4vw, 34px));
}.page-banner.post-banner h2,
.page-banner.post-banner h1 {
  font-size: clamp(21px, 2.5vw, 38px);
  line-height: 1.17;
}

.post-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px clamp(14px, 1.6vw, 22px);
  margin-top: clamp(22px, 2.6vw, 34px);
  padding-bottom: clamp(16px, 1.9vw, 24px);
  border-bottom: 1px solid var(--steel);
}
.post-tur {
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--link);
}
.post-meta time {
  font-size: 12px;
  color: var(--ink-soft);
  font-variant-numeric: tabular-nums;
}
.post-tags { display: flex; flex-wrap: wrap; gap: 7px; }
.post-tags span {
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--bar-ink);
  background: var(--mist);
  border: 1px solid var(--rule);
  padding: 5px 10px;
}

.post-body {
  display: grid;
  grid-template-columns: minmax(0, 1.9fr) minmax(0, 1fr);
  gap: clamp(30px, 4.2vw, 72px);
  margin-top: clamp(28px, 3.4vw, 48px);
  align-items: start;
}
.post-text > *:first-child { margin-top: 0; }
.post-text h3:first-of-type { margin-top: 0; padding-top: 0; border-top: 0; }
.post-text p {
  font-family: var(--serif);
  font-size: clamp(15px, 1.12vw, 17px);
  line-height: 1.68;
  color: var(--ink);
  margin-top: 1.05em;
  max-width: 74ch;
}
.post-text h3 {
  font-size: clamp(19px, 1.85vw, 28px);
  line-height: 1.18;
  margin-top: clamp(30px, 3.2vw, 48px);
  padding-top: clamp(14px, 1.6vw, 20px);
  border-top: 1px solid var(--steel);
}
.post-text h4 {
  font-size: clamp(16px, 1.4vw, 20px);
  line-height: 1.24;
  margin-top: clamp(22px, 2.3vw, 34px);
}
.post-text h5 {
  font-size: clamp(14px, 1.12vw, 16px);
  line-height: 1.3;
  font-weight: 500;
  color: var(--ink);
  margin-top: clamp(20px, 2.1vw, 30px);
}
.post-text a { color: var(--link); border-bottom: 1px solid var(--steel); }
.post-text a:hover { border-bottom-color: var(--link); }
.post-text strong { font-weight: 600; }

/* bülten Türkçe yayımlandı; İngilizce görünümde okuyucuya not düşülür */
.post-lang { display: none; }
html[lang="en"] .post-lang {
  display: block;
  font-family: var(--sans);
  font-size: clamp(13px, 1vw, 15px);
  line-height: 1.55;
  color: var(--ink-soft);
  background: var(--mist);
  border-left: 3px solid var(--brand);
  padding: 14px 18px;
  margin-bottom: clamp(22px, 2.4vw, 34px);
  max-width: none;
}

.post-note {
  margin-top: clamp(28px, 3.2vw, 46px);
  padding-top: clamp(14px, 1.6vw, 20px);
  border-top: 1px solid var(--steel);
  font-family: var(--sans);
  font-size: clamp(12px, 0.95vw, 14px);
  line-height: 1.6;
  color: var(--ink-soft);
  font-style: italic;
}

.post-aside {
  position: sticky;
  top: calc(var(--head-h, 96px) + 26px);
  display: flex;
  flex-direction: column;
  gap: clamp(22px, 2.4vw, 34px);
}
.post-aside h3 {
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-soft);
}
.post-alanlar { list-style: none; margin: 10px 0 0; padding: 0; }
.post-alanlar li { border-top: 1px solid var(--rule); }
.post-alanlar a {
  display: block;
  padding: 12px 0;
  font-size: clamp(14px, 1.08vw, 16px);
  line-height: 1.3;
  transition: color .18s ease;
}
.post-alanlar a:hover { color: var(--link); }
.post-benzer { list-style: none; margin: 10px 0 0; padding: 0; }
.post-benzer li { border-top: 1px solid var(--rule); padding: 12px 0; }
.post-benzer a { display: block; }
.pb-tur {
  display: block;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: var(--ink-soft);
  margin-bottom: 5px;
}
.pb-bas {
  display: block;
  font-size: clamp(13px, 1.02vw, 15px);
  line-height: 1.34;
  letter-spacing: -0.01em;
  color: var(--ink);
  transition: color .18s ease;
}
.post-benzer a:hover .pb-bas { color: var(--link); }
.post-benzer .pb-yakinda .pb-bas { color: var(--ink-soft); }
.post-benzer .yakinda-etiket { margin-top: 6px; }

.post-cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  background: var(--bar);
  color: var(--bar-ink);
  padding: 15px 18px;
  font-size: clamp(13px, 1.02vw, 15px);
  font-weight: 500;
  line-height: 1.3;
}
.post-cta span:last-child { transition: transform .22s ease; }
.post-cta:hover span:last-child { transform: translateX(6px); }

/* içeriği henüz yayımlanmamış başlıklar için rozet */
.yakinda-etiket {
  display: inline-block;
  margin-top: 7px;
  font-family: var(--sans);
  font-size: 10px;
  font-style: normal;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-soft);
  border: 1px solid var(--rule);
  padding: 3px 8px;
}

@media (max-width: 980px) {
  .post-body { grid-template-columns: minmax(0, 1fr); }
  .post-aside { position: static; border-top: 1px solid var(--steel); padding-top: clamp(20px, 2.4vw, 30px); }
}
/* ekrana sığmadığı ölçülen yan sütun yapışkanlıktan çıkar (bkz. betik) */
.post-aside.yapismaz { position: static; }

/* ---------------------------------------------------------------
   KARİYER — ayrı sayfa görünümü (Ekibimiz sayfasıyla aynı düzen)
   --------------------------------------------------------------- */
.career-page { display: none; background: var(--paper); padding-bottom: clamp(48px, 7vw, 104px); }
body.kariyer-gorunum .career-page { display: block; }

.career-block {
  display: grid;
  grid-template-columns: minmax(110px, 0.4fr) minmax(0, 1.6fr);
  gap: clamp(16px, 2.2vw, 36px);
  margin-top: clamp(28px, 3.4vw, 48px);
  padding-top: clamp(20px, 2.4vw, 32px);
  border-top: 1px solid var(--steel);
}
.career-lead {
  font-family: var(--serif);
  font-size: clamp(17px, 1.55vw, 23px);
  line-height: 1.55;
  color: var(--ink);
  max-width: 60ch;
}
.career-lead a { color: var(--link); border-bottom: 1px solid var(--steel); }
.career-lead a:hover { border-bottom-color: var(--link); }
.career-sub { font-family: var(--serif);   /* okuma metni */
  margin-top: clamp(16px, 1.8vw, 26px);
  font-size: clamp(15px, 1.2vw, 18px);
  line-height: 1.6;
  color: var(--ink-soft);
  max-width: 60ch;
}

@media (max-width: 1080px) {
  .career-block { grid-template-columns: minmax(0, 1fr); gap: 12px; }
}

@media (max-width: 1080px) {
  .team-filter { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .team-filter label:first-child { grid-column: 1 / -1; }
}
@media (max-width: 620px) {
  .team-filter { grid-template-columns: minmax(0, 1fr); }
  .team-band { flex-direction: column; align-items: flex-start; }
}

/* Fotoğraf zeminli bölüm: görsel tüm bölümü kaplar, üstünde okumayı
   mümkün kılan bir perde durur. İçerik üstte olduğu için gökyüzü tarafı
   daha yoğun örtülür; siluet alttaki boşlukta görünür. */
.band--photo {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  /* siluet üzerinde 16px metnin 4.5:1 kalması için soluk ton bir kademe koyu */
  --ink-soft: #5E5754;
}
.band-img {
  position: absolute;
  inset: 0;
  z-index: -2;
  width: 100%;
  height: 100%;
  display: block;
}
.band--photo::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(180deg,
    var(--veil-strong) 0%, var(--veil-strong) 50%,
    var(--veil-soft) 74%, var(--veil-soft) 100%);
}

/* ---------------------------------------------------------------
   ÇALIŞMA ALANI SAYFASI (#alan-<slug>)
   Bant + sol sütunda alt başlıklar; Hakkımızda ile aynı ızgara.
   --------------------------------------------------------------- */
.area-page { display: none; background: var(--paper); padding-bottom: clamp(48px, 7vw, 104px); }
body.alan-gorunum .area-page { display: block; }

.ap-geri {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin-top: clamp(26px, 3vw, 44px);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--link);
  border-bottom: 1px solid var(--steel);
  padding-bottom: 4px;
}
.ap-geri span:first-child { transition: transform .22s ease; }
.ap-geri:hover span:first-child { transform: translateX(-5px); }

.ap-body {
  display: flex;
  flex-direction: column;
  gap: clamp(30px, 3.6vw, 56px);
  margin-top: clamp(30px, 3.6vw, 52px);
}
/* her blok kendi saç teli çizgisiyle başlar; sol sütunda kısa başlık durur */
.ap-body .about-block { border-top: 1px solid var(--steel); }
.ap-body .about-block > div { padding-top: 20px; }
.ap-ozet {
  font-family: var(--serif);
  font-size: clamp(16px, 1.32vw, 20px);
  line-height: 1.6;
  color: var(--ink);
  max-width: 72ch;
}
.ap-kapsam {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 clamp(24px, 3vw, 48px);
}
.ap-kapsam li {
  border-top: 1px solid var(--rule);
  padding: 13px 0;
  font-family: var(--serif);
  font-size: clamp(16px, 1.35vw, 20px);
  line-height: 1.25;
  letter-spacing: -0.01em;
}
.ap-diger {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 clamp(24px, 3vw, 48px);
}
.ap-diger a {
  display: block;
  border-top: 1px solid var(--rule);
  padding: 13px 0;
  font-size: clamp(14px, 1.15vw, 17px);
  line-height: 1.25;
  transition: color .18s ease;
}
.ap-diger a:hover { color: var(--link); }

@media (max-width: 760px) {
  .ap-kapsam, .ap-diger { grid-template-columns: minmax(0, 1fr); }
}

/* ---------------------------------------------------------------
   İLETİŞİM — ayrı sayfa görünümü (#iletisim)
   --------------------------------------------------------------- */
.contact-page { display: none; background: var(--paper); padding-bottom: clamp(48px, 7vw, 104px); }
body.iletisim-gorunum .contact-page { display: block; }

.page-banner {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  height: clamp(230px, 30vw, 380px);
  background: #191919;
  display: flex;
  align-items: flex-end;
}
.page-banner canvas,
.page-banner .banner-img {
  position: absolute;
  inset: 0;
  z-index: -2;
  width: 100%;
  height: 100%;
  display: block;
}
/* fotoğrafta ilgi merkezi orta bantta; geniş bantta oradan kırpılır.
   Bant fotoğrafları da içerik fotoğrafıdır: siyah-beyaz basılır. */
.page-banner .banner-img { object-fit: cover; object-position: center 46%; filter: grayscale(1); }
.contact-page .page-banner .banner-img { object-position: center 58%; }
.page-banner::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(90deg, rgba(6, 10, 16, .78) 0%, rgba(6, 10, 16, .34) 55%, rgba(6, 10, 16, .60) 100%);
}.page-banner h2,
.page-banner h1 {
  color: #fff;
  font-size: clamp(38px, 5vw, 76px);
  width: 100%;
  max-width: var(--shell);
  margin-inline: auto;
  padding: 0 var(--gut) clamp(26px, 3.2vw, 46px);
}

.cp-body {
  display: grid;
  grid-template-columns: minmax(0, 1.9fr) minmax(0, 1fr);
  gap: clamp(32px, 4.5vw, 76px);
  margin-top: clamp(36px, 4.6vw, 72px);
}
.cp-lead h3 {
  font-size: clamp(24px, 2.6vw, 40px);
  line-height: 1.14;
}
.cp-lead p {
  margin-top: clamp(12px, 1.4vw, 18px);
  font-size: clamp(16px, 1.35vw, 21px);
  line-height: 1.4;
  color: var(--ink-soft);
  max-width: 40ch;
}
.cp-req {
  margin-top: clamp(22px, 2.6vw, 36px);
  font-size: 13px;
  font-weight: 500;
  color: var(--link);
}
.cp-req b { color: var(--link); }

/* satır satır form: solda etiket hücresi, sağda alan */
.cp-form { margin-top: 14px; border-top: 1px solid var(--rule); }
.cp-row {
  display: grid;
  grid-template-columns: minmax(140px, 0.62fr) minmax(0, 1.38fr);
  align-items: center;
  gap: clamp(12px, 1.6vw, 24px);
  background: var(--mist);
  border-bottom: 1px solid var(--paper);
  padding: 10px clamp(12px, 1.4vw, 18px);
}
.cp-row > label,
.cp-row > .cp-cap {
  font-size: clamp(13px, 1.05vw, 15px);
  color: var(--ink);
}
.cp-row .req { color: var(--link); }
.cp-row input,
.cp-row select,
.cp-row textarea {
  font: inherit;
  font-size: clamp(14px, 1.05vw, 16px);
  color: var(--ink);
  background: var(--paper);
  border: 1px solid var(--rule);
  border-radius: 0;
  padding: 10px 12px;
  width: 100%;
  min-width: 0;
  transition: border-color .18s ease;
}
.cp-row textarea { min-height: 148px; resize: vertical; }
.cp-row select {
  appearance: none;
  -webkit-appearance: none;
  padding-right: 34px;
  background-image: linear-gradient(45deg, transparent 50%, currentColor 50%),
                    linear-gradient(135deg, currentColor 50%, transparent 50%);
  background-position: calc(100% - 19px) calc(50% + 1px), calc(100% - 13px) calc(50% + 1px);
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
  cursor: pointer;
}
.cp-row input:focus,
.cp-row select:focus,
.cp-row textarea:focus { border-color: var(--link); outline: none; }

.cp-consent {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  background: var(--mist);
  padding: clamp(14px, 1.6vw, 20px) clamp(12px, 1.4vw, 18px);
  border-bottom: 1px solid var(--paper);
}
.cp-consent input { width: 17px; height: 17px; margin-top: 2px; accent-color: var(--brand); }
.cp-consent span { font-size: 13px; line-height: 1.5; color: var(--ink-soft); }

.cp-send {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  font: inherit;
  font-size: clamp(13px, 1.1vw, 15px);
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--on-brand);
  background: var(--brand);
  border: 0;
  padding: clamp(15px, 1.7vw, 21px) clamp(16px, 1.8vw, 24px);
  cursor: pointer;
  transition: background .18s ease;
}
.cp-send:hover { background: var(--link); }
.cp-send span:last-child { transition: transform .22s ease; }
.cp-send:hover span:last-child { transform: translateX(6px); }

.cp-note {
  margin-top: clamp(20px, 2.4vw, 32px);
  font-size: 14px;
  line-height: 1.55;
  font-weight: 500;
  color: var(--ink);
  max-width: 58ch;
}
.cp-thanks {
  margin-top: clamp(20px, 2.4vw, 32px);
  padding: clamp(18px, 2vw, 26px);
  background: var(--brand);
  color: var(--on-brand);
  font-size: clamp(15px, 1.2vw, 18px);
  line-height: 1.45;
}

.cp-aside { display: flex; flex-direction: column; gap: clamp(16px, 1.8vw, 24px); }
.cp-card {
  background: var(--mist);
  padding: clamp(18px, 2vw, 26px);
}
.cp-card h4 {
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--ink-soft);
  margin-bottom: 10px;
}
.cp-card address,
.cp-card p { font-style: normal; font-size: clamp(14px, 1.1vw, 16px); line-height: 1.55; color: var(--ink); white-space: pre-line; }
.cp-card a { color: var(--link); border-bottom: 1px solid var(--steel); padding-bottom: 1px; }
.cp-card a:hover { border-bottom-color: currentColor; }

@media (max-width: 1080px) {
  .cp-body { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 620px) {
  .cp-row { grid-template-columns: minmax(0, 1fr); align-items: stretch; }
}

/* ---------------------------------------------------------------
   FOOTER
   --------------------------------------------------------------- */
.foot {
  background: var(--brand);
  color: var(--on-brand);
  border-top: 2px solid var(--on-brand-dim);
  padding-block: clamp(40px, 5vw, 72px) clamp(24px, 3vw, 36px);
}
.foot-grid {
  display: grid;
  grid-template-columns: minmax(270px, 1.3fr) minmax(160px, .72fr) minmax(220px, .92fr) minmax(290px, 1.18fr);
  column-gap: clamp(36px, 4vw, 72px);
  row-gap: clamp(28px, 3vw, 42px);
  align-items: start;
  padding-bottom: clamp(28px, 4vw, 48px);
  border-bottom: 1px solid rgba(226, 196, 196, .30);
}
.foot-grid > :first-child {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.foot-mark { line-height: 0; width: fit-content; }
.foot-mark .logo-img { width: clamp(196px, 23vw, 292px); }
.foot-blurb {
  font-family: var(--serif);   /* okuma metni */
  color: var(--on-brand-dim);
  font-size: 14px;
  line-height: 1.55;
  margin: 16px auto 0;
  max-width: 32ch;
  text-align: center;
}
.foot-col h4 { font-size: 11px; letter-spacing: 0.15em; text-transform: uppercase; color: var(--on-brand-dim); margin-bottom: 14px; font-weight: 500; }
.foot-col ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 9px; font-size: 14px; }
.foot-col a { border-bottom: 1px solid transparent; transition: border-color .18s ease; }
.foot-col a:hover { border-bottom-color: var(--on-brand-dim); }
.foot-col--stacked {
  display: flex;
  flex-direction: column;
  gap: clamp(30px, 3vw, 44px);
}

.foot-note {
  margin-top: clamp(20px, 2.5vw, 30px);
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 12px;
  font-size: 12px;
  color: var(--on-brand-dim);
}

/* ---------------------------------------------------------------
   REVEAL
   --------------------------------------------------------------- */
.reveal { opacity: 0; transform: translateY(18px); }
.reveal.in { opacity: 1; transform: none; transition: opacity .7s ease, transform .7s cubic-bezier(.2,.7,.3,1); }

@media (prefers-reduced-motion: reduce) {
  .reveal, .reveal.in { opacity: 1; transform: none; transition: none; }
  * { scroll-behavior: auto !important; }
}

/* ---------------------------------------------------------------
   RESPONSIVE
   --------------------------------------------------------------- */
@media (max-width: 1080px) {
  .foot-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .foot-grid > :first-child { grid-column: 1 / -1; }
  .grid { grid-template-columns: minmax(0, 1fr); }
  .areas { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .contact { grid-template-columns: minmax(0, 1fr); }
  .stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .split { grid-template-columns: minmax(0, 1fr); }
  .hero-copy { width: min(46ch, 62%); }

  /* mozaik: [başlık][geniş] / [kart][kart] / [kart tam genişlik] */
  .mosaic { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tile--wide { grid-column: auto; }
  .tile:last-of-type { grid-column: 1 / -1; }

  .firm-lead { grid-template-columns: minmax(0, 1fr); }
  .thumb--portrait { aspect-ratio: 16 / 9; }

  .about-block { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .about-block > .eyebrow { padding-top: 0; }

   /* iki sütunda kartlar genişler, boy kısalır */
  .ap-body .about-block > div { padding-top: 6px; }
}

/* dar ekranda değerler tek sütuna, kart boyu kısalır */
@media (max-width: 620px) {

}

@media (max-width: 760px) {
  .foot-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: clamp(22px, 8vw, 42px);
    row-gap: 34px;
  }
  .foot-grid > :first-child { grid-column: 1 / -1; }
  .foot-grid > .foot-col { min-width: 0; }
  .foot-col--stacked { gap: 30px; }
  .foot-grid > .foot-col:last-child {
    grid-column: 1 / -1;
    padding-top: 28px;
    border-top: 1px solid rgba(226, 196, 196, .24);
  }
  .foot-grid > .foot-col:last-child ul {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: clamp(22px, 8vw, 42px);
    row-gap: 10px;
  }
  .util { display: none; }
  .nav { display: none; }
  .menu-btn {
    display: flex;
    align-items: center;
    gap: 10px;
    background: none;
    border: 1px solid var(--link);
    color: var(--link);
    font: inherit;
    font-size: 12px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    padding: 9px 14px;
    cursor: pointer;
  }
  .topbar-inner { align-items: flex-end; }

  /* menü açıkken bağlantılar başlığın altına açılır */
  .topbar.open .nav,
  .topbar.open .util {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    width: 100%;
    padding-top: 12px;
  }
  .topbar.open .nav { gap: 14px 20px; }
  .nav-item { flex-direction: column; align-items: flex-end; width: 100%; }
  .drop {
    position: static;
    transform: none;
    min-width: 0;
    width: 100%;
    margin-top: 8px;
    padding: 6px 0 0;
    border: 0;
    border-top: 1px solid var(--rule);
    box-shadow: none;
    display: none;
    opacity: 1;
    visibility: visible;
  }
  .has-drop.acik .drop { display: block; transform: none; }
  .nav .drop a { text-align: right; white-space: normal; padding-inline: 0; }
  .topbar.open .util { gap: 10px 16px; }
  .hero { height: 480px; }
  /* Telefonda hero kısalıyor, metin tam genişliğe yayılıyor:
     geçişin daha erken başlaması gerekiyor. */
  .hero::after {
    background: linear-gradient(to bottom,
                rgba(18, 14, 14, 0) 18%,
                rgba(18, 14, 14, .52) 46%,
                rgba(18, 14, 14, .78) 100%);
  }
  .hero-copy { width: auto; left: var(--gut); right: var(--gut); }
  .areas, .cards, .stats, .panels { grid-template-columns: minmax(0, 1fr); }
  .stat b { font-size: 64px; }

  .mosaic { grid-template-columns: minmax(0, 1fr); }
  .mosaic-head { grid-column: 1; }
  .tile--wide, .tile:last-of-type { grid-column: 1; }
  .tile { min-height: clamp(190px, 48vw, 250px); }

  .firm-band { height: 220px; }
  .firm-panel {
    width: 100%;
    margin-top: 0;
    padding-inline: var(--gut);
    box-shadow: none;
  }
  .firm-grid { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 520px) {
  .foot-grid > .foot-col:last-child ul {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* Büyük menü ölçüleri yalnızca geniş ekranda. Ölçüm (satır kutusu
   sayarak): 34 piksellik aralıkla 18 punto 1440'ta bile "Çalışma
   Alanları" ve "Görüşler & Yayınlar"ı iki satıra kırıyor; aralık
   22–24 piksele indirilince 1280'den itibaren tek satırda kalıyor.
   19 punto ancak aralık 16 piksele düşürülürse sığıyordu, o da menüyü
   sıkışık gösteriyor. Bu yüzden üst sınır 18 punto.
   1280'in altında eski ölçüler geçerli. */
/* Logo geniş ekranda ve telefonda büyük; menü puntosu her yerde aynı
   kalır — ölçüldü, büyütüldüğünde yazılar köprünün üstüne taşıyor. */
@media (min-width: 1280px) {
  .mark .logo-img { width: clamp(200px, 20.6vw, 300px); }
}
@media (max-width: 760px) {
  .mark .logo-img { width: clamp(200px, 20.6vw, 300px); }
}

/* ---------------------------------------------------------------
   SİTE İÇİ ARAMA — hero ile Hakkımızda arasındaki şerit
   Çerçeve marka bordosu (#4A0000). Sonuç listesi kutunun altına
   akar; sayfanın yerleşimini itmemesi için mutlak konumlu değil,
   akış içinde durur ama boşken hiç yer kaplamaz.
   --------------------------------------------------------------- */
.gorunmez {
  position: absolute;
  width: 1px; height: 1px;
  margin: -1px; padding: 0; border: 0;
  clip-path: inset(50%);
  overflow: hidden; white-space: nowrap;
}

.band--ara { padding-block: clamp(26px, 3.4vw, 48px); }
.band--ara .eyebrow { margin-bottom: 12px; }

.ara-alan {
  position: relative;
  display: flex;
  align-items: center;
  gap: clamp(11px, 1.1vw, 16px);
  padding-bottom: clamp(9px, 0.9vw, 13px);
  /* Kutu değil, altı çizili bir satır: yazı sayfanın kendi akışında
     durur, ağırlığı sağdaki dolu kare taşır. */
  border: 0;
  border-bottom: 1px solid #4A0000;
  background: none;
  transition: border-color .18s ease;
}
.ara-alan:focus-within { border-bottom-width: 2px; padding-bottom: calc(clamp(9px, 0.9vw, 13px) - 1px); }
.ara-ikon { flex: none; color: var(--ink); }

.ara-giris {
  flex: 1 1 auto;
  min-width: 0;
  border: 0;
  background: none;
  font-family: var(--sans);
  font-size: clamp(16px, 1.3vw, 20px);
  color: var(--ink);
  padding-block: clamp(10px, 1vw, 15px);
}

/* Sağdaki dolu kare — aramayı çalıştırır, ilk sonucu açar. */
.ara-git {
  flex: none;
  width: clamp(46px, 4.2vw, 58px);
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  border: 0;
  background: #4A0000;
  color: #FFFFFF;
  cursor: pointer;
  transition: background .18s ease;
}
.ara-git:hover { background: #6E0E0E; }
.ara-git svg { transition: transform .2s ease; }
.ara-git:hover svg { transform: translate(2px, -2px); }
.ara-git:active { transform: translateY(1px); }
.ara-giris::placeholder { color: var(--ink-soft); }
.ara-giris:focus { outline: none; }
.ara-giris::-webkit-search-cancel-button,
.ara-giris::-webkit-search-decoration { -webkit-appearance: none; appearance: none; }

.ara-sil {
  flex: none;
  display: grid;
  place-items: center;
  width: 26px; height: 26px;
  border: 0;
  background: none;
  color: var(--ink-soft);
  cursor: pointer;
  transition: color .16s ease;
}
.ara-sil:hover { color: #4A0000; }
/* display:grid, tarayıcının [hidden] kuralını eziyordu: kutu boşken
   de çarpı görünüyordu. */
.ara-sil[hidden] { display: none; }

.ara-cikti {
  margin-top: 0;
  border: 1px solid var(--rule);
  border-top: 0;
  background: var(--paper);
  max-height: min(58vh, 460px);
  overflow-y: auto;
}
.ara-grup {
  padding: 11px clamp(14px, 1.4vw, 20px) 6px;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ink-soft);
  background: var(--mist);
  border-bottom: 1px solid var(--rule);
  padding-bottom: 10px;
}
.ara-satir {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: baseline;
  gap: 6px 16px;
  width: 100%;
  padding: 12px clamp(14px, 1.4vw, 20px);
  border: 0;
  border-bottom: 1px solid var(--rule);
  background: none;
  font: inherit;
  color: inherit;
  text-align: left;
  cursor: pointer;
  transition: background .14s ease;
}
.ara-satir:last-child { border-bottom: 0; }
.ara-satir:hover,
.ara-satir.is-secili { background: var(--mist); }
.ara-satir.is-secili { outline: 2px solid rgba(74, 0, 0, .28); outline-offset: -2px; }
.ara-baslik {
  font-size: clamp(14px, 1.08vw, 16px);
  font-weight: 500;
  color: var(--ink);
  line-height: 1.3;
}
.ara-baslik mark {
  background: rgba(74, 0, 0, .12);
  color: #4A0000;
  padding: 0 1px;
}
.ara-alt {
  grid-column: 1;
  font-family: var(--serif);
  font-size: 13px;
  line-height: 1.45;
  color: var(--ink-soft);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.ara-tur {
  grid-row: 1;
  grid-column: 2;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: #4A0000;
  white-space: nowrap;
}
.ara-bos {
  margin-top: 14px;
  font-family: var(--serif);
  font-size: 15px;
  color: var(--ink-soft);
}
.ara-dip {
  padding: 10px clamp(14px, 1.4vw, 20px);
  font-size: 12px;
  color: var(--ink-soft);
  background: var(--mist);
}

@media (max-width: 560px) {
  .ara-satir { grid-template-columns: minmax(0, 1fr); }
  .ara-tur { grid-row: auto; grid-column: 1; }
}

/* ---------------------------------------------------------------
   HAKKIMIZDA — dolu bordo bölüm
   Kutular kaldırıldı: metinler doğrudan zeminin üstünde duruyor.
   Solda tek büyük başlık, sağda gövde, altta çizgilerle ayrılmış
   rakamlar. Zemin marka bordosu olduğu için bölüm içindeki renk
   belirteçleri baştan açık tonlara çevrilir; böylece içerideki her
   öğe kendiliğinden okunur hale gelir.
   --------------------------------------------------------------- */
.band--bordo {
  background: #4A0000;
  color: #FFFFFF;
  --ink:      #FFFFFF;
  --ink-soft: #E7D2D2;
  --link:     #F0D6D6;
  --rule:     rgba(255, 255, 255, .22);
}

/* Deneme yalnızca anasayfadaki bu bölümle sınırlıdır. */
#hakkimizda,
#hakkimizda * {
  font-family: 'Google Sans Flex About', var(--sans);
  font-variation-settings: 'wght' var(--google-sans-weight, 400);
}

#hakkimizda .title,
#hakkimizda .about-baslik,
#hakkimizda .about-arabaslik,
#hakkimizda .rakam-etiket b {
  --google-sans-weight: 600;
}

#hakkimizda .stat b { --google-sans-weight: 300; }
#hakkimizda .rakam-buro,
#hakkimizda .stat p { --google-sans-weight: 500; }

.about-ust {
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
  gap: clamp(26px, 5vw, 96px);
  align-items: start;
}

/* Bölüm başlığı "Hakkımızda"; bu satır onun altında duran, bir
   kademe küçük tanıtım cümlesi. */
.band--bordo .title { color: #FFFFFF; }
.about-baslik {
  margin-top: clamp(14px, 1.7vw, 26px);
  font-size: clamp(19px, 1.95vw, 30px);
  font-weight: 600;
  line-height: 1.22;
  letter-spacing: -0.015em;
  color: #FFFFFF;
  text-wrap: balance;
}
/* Başlığın altındaki kısa çizgi — referanstaki gibi bölümü açan
   küçük bir imza. */
.about-cizgi {
  display: block;
  width: clamp(58px, 6vw, 88px);
  height: 3px;
  margin-top: clamp(18px, 2.2vw, 32px);
  background: #E2C4C4;
}

.about-sag {
  display: flex;
  flex-direction: column;
  gap: clamp(16px, 1.7vw, 26px);
  padding-top: clamp(4px, 0.8vw, 12px);
}
.about-sag p {
  font-family: var(--serif);
  font-size: clamp(15px, 1.16vw, 18px);
  line-height: 1.72;
  color: #F2E5E5;
  max-width: 62ch;
}
.about-arabaslik {
  font-size: clamp(16px, 1.28vw, 20px);
  font-weight: 600;
  line-height: 1.32;
  color: #FFFFFF;
  margin-top: clamp(4px, 0.7vw, 10px);
}

/* --- Rakamlar --- */
.about-rakam { margin-top: clamp(54px, 7vw, 116px); }
.rakam-etiket {
  margin-bottom: clamp(22px, 2.6vw, 40px);
  line-height: 1.42;
}
.rakam-buro {
  display: block;
  font-size: clamp(13px, 1.05vw, 15px);
  font-weight: 500;
  color: #E2C4C4;
}
.rakam-etiket b {
  display: block;
  font-size: clamp(15px, 1.2vw, 18px);
  font-weight: 600;
  color: #FFFFFF;
}

.band--bordo .stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
}
.band--bordo .stat {
  border-top: 0;
  border-left: 1px solid rgba(255, 255, 255, .24);
  padding: 0 clamp(12px, 1.6vw, 26px);
}
.band--bordo .stat:first-child { border-left: 0; padding-left: 0; }
.band--bordo .stat b {
  font-size: clamp(40px, 4.8vw, 74px);
  font-weight: 300;
  line-height: 0.94;
  letter-spacing: -0.035em;
  color: #FFFFFF;
}
.band--bordo .stat p {
  margin-top: clamp(10px, 1.1vw, 16px);
  font-family: var(--sans);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #E2C4C4;
  max-width: none;
}

@media (max-width: 900px) {
  .about-ust { grid-template-columns: minmax(0, 1fr); gap: clamp(20px, 3vw, 34px); }
  .about-sag { padding-top: 0; }
}
@media (max-width: 620px) {
  .band--bordo .stats { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: clamp(24px, 5vw, 36px); }
  .band--bordo .stat:nth-child(odd) { border-left: 0; padding-left: 0; }
}

/* ---------------------------------------------------------------
   Makale sayfası — kişi kartları ve alt eylem düğmeleri
   --------------------------------------------------------------- */
.ask-kart + .ask-kart { margin-top: 10px; }
/* Fotoğraf, ekip verisinden çalışma anında yerleştirilir; tuval ve
   baş harfler yalnızca fotoğrafı olmayan kişiler için durur. */
.ask-foto img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center 22%;
}

.post-eylem {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: clamp(22px, 2.6vw, 34px);
}
.post-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 12px 20px;
  border: 1px solid var(--brand);
  background: var(--brand);
  color: var(--on-brand);
  font-family: var(--sans);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background .18s ease, color .18s ease;
}
.post-btn:hover { background: #6E0E0E; border-color: #6E0E0E; }
.post-btn--ikinci {
  background: none;
  color: var(--brand);
}
.post-btn--ikinci:hover { background: var(--brand); color: var(--on-brand); }
.post-btn svg { flex: none; }

/* ---------------------------------------------------------------
   YAZDIRMA — "PDF olarak indir" düğmesi tarayıcının yazdırma
   penceresini açar; macOS'ta oradan "PDF olarak kaydet" seçilir.
   Kâğıda yalnızca makalenin kendisi gitmeli: menü, afiş, yan sütun,
   altbilgi ve düğmelerin kendisi çıkarılır.
   --------------------------------------------------------------- */
@media print {
  /* Sayfanın tamamı tek belgede duruyor: bütün makaleler, yasal
     metinler ve anasayfa bölümleri aynı DOM'da. Yazdırırken gövdeye
     bir işaret konur ve yalnızca işaretli makale görünür kalır —
     yoksa kâğıda otuz sayfa çıkıyor. */
  body.yazdirma-modu > *,
  body.yazdirma-modu main > * { display: none !important; }
  body.yazdirma-modu .post-page.yazdiriliyor { display: block !important; }

  /* makalenin kendi içinden de ekrana ait parçalar çıkarılır */
  body.yazdirma-modu .yazdiriliyor .page-banner,
  body.yazdirma-modu .yazdiriliyor .ap-geri,
  body.yazdirma-modu .yazdiriliyor .post-aside,
  body.yazdirma-modu .yazdiriliyor .post-eylem { display: none !important; }

  html, body { background: #fff !important; color: #000 !important; }
  .yazdiriliyor .shell { max-width: none; padding: 0; }
  .yazdiriliyor .post-body { display: block !important; }
  .yazdiriliyor .post-text { max-width: none; }

  /* başlık afişte olduğu için metnin başına geçici olarak eklenir */
  .post-yazdir-baslik {
    display: block !important;
    margin-bottom: 12px;
    font-size: 19pt;
    line-height: 1.22;
  }
  .yazdiriliyor .post-meta { font-size: 9pt; margin-bottom: 10pt; }
  .yazdiriliyor .post-text p,
  .yazdiriliyor .post-text li { font-size: 10.5pt; line-height: 1.5; }
  .yazdiriliyor .post-text h3 { font-size: 12.5pt; margin-top: 14pt; }
  .yazdiriliyor a[href^="http"]::after {
    content: " (" attr(href) ")"; font-size: 8pt; word-break: break-all;
  }
}
.post-yazdir-baslik { display: none; }

/* Görüşler başlığı: alt açıklama satırı kaldırıldığı için şerit
   gereğinden yüksek kalıyordu; üst ve alt boşluk kısaltıldı. */
#gorusler { padding-block: clamp(30px, 3.8vw, 58px); }

/* Müvekkil haberleri artık üç kutucuk: üst satırda başlık ve geniş
   kutucuk, alt satırda tek kutucuk tüm genişliği kaplar. */
.tile--tam { grid-column: 1 / -1; }
@media (max-width: 900px) {
  .tile--tam { grid-column: 1 / -1; }
}

/* MOBIL_MENU_DUZENI_V2 */
@media (max-width: 760px) {
  /* Açık menü telefon ekranını düzenli bir çekmece olarak kullanır. */
  body:has(.topbar.open) { overflow: hidden; }

  .topbar.open {
    height: 100vh;
    height: 100dvh;
    max-height: 100dvh;
    overflow: hidden;
  }

  .topbar.open .topbar-inner {
    width: 100%;
    height: 100%;
    min-height: 0;
    padding: 0 var(--gut) 16px;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: var(--tile) minmax(0, 1fr);
    align-items: stretch;
    justify-content: stretch;
    gap: 0;
  }

  .topbar.open .menu-btn {
    grid-row: 1;
    justify-self: end;
    align-self: center;
  }

  .topbar.open .nav {
    grid-row: 2;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: stretch;
    justify-content: flex-start;
    gap: 0;
    width: 100%;
    min-height: 0;
    max-height: 100%;
    padding: 4px 0 24px;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
  }

  .topbar.open .nav > a,
  .topbar.open .nav > .nav-item,
  .topbar.open .nav > .search {
    flex: none;
    width: 100%;
    border-bottom: 1px solid color-mix(in srgb, currentColor 22%, transparent);
  }

  .topbar.open .nav > a {
    display: block;
    padding: 14px 4px;
    font-size: 16px;
    line-height: 1.3;
    text-align: right;
  }

  .topbar.open .nav-item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 18px;
    align-items: center;
    gap: 0 8px;
  }

  .topbar.open .nav-item > a {
    grid-column: 1;
    grid-row: 1;
    width: 100%;
    padding: 14px 4px;
    font-size: 16px;
    line-height: 1.3;
    text-align: right;
  }

  .topbar.open .nav-item > .drop-ok {
    grid-column: 2;
    grid-row: 1;
    justify-self: end;
  }

  .topbar.open .nav-item > .drop {
    grid-column: 1 / -1;
    grid-row: 2;
    width: 100%;
    margin: 0;
    padding: 5px 12px 10px;
    border-top: 1px solid var(--rule);
  }

  .topbar.open .nav .drop a {
    padding: 10px 4px;
    font-size: 14px;
    line-height: 1.4;
    text-align: right;
  }

  .topbar.open .search {
    justify-content: flex-end;
    padding: 14px 4px;
    border-top: 0;
    border-right: 0;
    border-left: 0;
    border-radius: 0;
    font-size: 15px;
  }

  .topbar.open .lang {
    flex: none;
    width: 100%;
    margin: 0;
    padding: 14px 4px 0;
    justify-content: flex-end;
  }
}


/* ---------------------------------------------------------------
   KİŞİ PROFİLLERİ — portre, kimlik, mevcut bilgiler ve ekip geçişleri
   --------------------------------------------------------------- */
.team-profile-link { display: block; color: inherit; }
.team-profile-link .team-photo img { transition: transform .45s cubic-bezier(.2,.7,.3,1); }
.team-profile-link:hover .team-photo img { transform: scale(1.025); }
.team-profile-link:hover h3 { color: var(--link); }

body.kisi-gorunum .topbar { background: var(--bar-brand); }
body.kisi-gorunum .foot {
  position: static;
  border-radius: 0;
  box-shadow: none;
  min-height: 0;
  margin: 0;
}
.person-page {
  min-height: 100vh;
  background: var(--paper);
  padding: calc(var(--head-h, 96px) + clamp(28px, 4vw, 58px)) 0 clamp(58px, 8vw, 116px);
}
.person-back { display: inline-flex; margin-bottom: clamp(24px, 3vw, 42px); }
.person-hero {
  display: grid;
  grid-template-columns: minmax(280px, .86fr) minmax(0, 1.14fr);
  gap: clamp(38px, 7vw, 112px);
  align-items: center;
  padding-block: clamp(18px, 2vw, 28px) clamp(48px, 7vw, 96px);
  border-top: 1px solid var(--rule);
}
.person-portrait {
  margin: 0;
  width: min(100%, 520px);
  aspect-ratio: 4 / 5;
  overflow: hidden;
  background: var(--mist);
}
.person-portrait img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  filter: grayscale(1);
}
.person-intro { max-width: 650px; }
.person-intro .eyebrow { margin-bottom: clamp(18px, 2.2vw, 30px); color: var(--link); }
.person-intro h1 { font-size: clamp(44px, 6vw, 86px); line-height: .95; }
.person-role {
  margin-top: clamp(18px, 2vw, 28px);
  font-size: clamp(14px, 1.2vw, 17px);
  font-weight: 500;
  letter-spacing: .11em;
  text-transform: uppercase;
  color: var(--link);
}
.person-location { margin-top: 10px; color: var(--ink-soft); }
.person-summary {
  margin-top: clamp(26px, 3.4vw, 46px);
  max-width: 49ch;
  font-family: var(--serif);
  font-size: clamp(18px, 1.8vw, 25px);
  line-height: 1.5;
}
.person-email {
  display: inline-block;
  margin-top: clamp(24px, 3vw, 38px);
  padding-bottom: 3px;
  border-bottom: 1px solid var(--steel);
  color: var(--link);
}
.person-email:hover { border-bottom-color: currentColor; }
.person-details {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(34px, 6vw, 92px);
  padding-block: clamp(38px, 5vw, 72px);
  border-top: 1px solid var(--rule);
}
.person-label {
  margin-bottom: 14px;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--ink-soft);
}
.person-detail ul { list-style: none; margin: 0; padding: 0; }
.person-detail li { padding: 11px 0; border-top: 1px solid var(--rule); font-size: clamp(15px, 1.15vw, 17px); }
.person-detail a:hover { color: var(--link); }
.person-roster { padding-top: clamp(44px, 6vw, 82px); border-top: 1px solid var(--rule); }
.person-details + .person-roster { margin-top: 0; }
.person-roster-head { display: flex; align-items: baseline; justify-content: space-between; gap: 20px; }
.person-roster-head h2 { font-size: clamp(28px, 3.4vw, 48px); }
.person-roster-head > a { color: var(--link); border-bottom: 1px solid var(--steel); padding-bottom: 2px; }
.person-roster-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(18px, 2.5vw, 34px);
  margin-top: clamp(24px, 3vw, 42px);
}
.person-roster-card {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr);
  align-items: center;
  gap: 18px;
  padding-top: 14px;
  border-top: 1px solid var(--rule);
}
.person-roster-card img { width: 96px; aspect-ratio: 4 / 5; object-fit: cover; filter: grayscale(1); }
.person-roster-card strong { display: block; font-size: clamp(17px, 1.4vw, 21px); font-weight: 600; }
.person-roster-card small {
  display: block;
  margin-top: 6px;
  font-size: 11px;
  letter-spacing: .11em;
  text-transform: uppercase;
  color: var(--ink-soft);
}
.person-roster-card:hover strong { color: var(--link); }

@media (max-width: 820px) {
  .person-hero { grid-template-columns: minmax(0, 1fr); gap: 30px; }
  .person-portrait { width: min(100%, 440px); }
  .person-details, .person-roster-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 520px) {
  .person-roster-head { align-items: flex-start; flex-direction: column; }
  .person-roster-card { grid-template-columns: 76px minmax(0, 1fr); }
  .person-roster-card img { width: 76px; }
}