/* ═══════════════════════════════════════════════════════════
   A&K PARTNERS — Hukuk ve Danışmanlık
   Koyu prestij · orman yeşili + şampanya · editoryal tipografi
   ═══════════════════════════════════════════════════════════ */

:root {
  --ink:      #0A1710;   /* zemin — gece ormanı              */
  --ink-2:    #0D1E15;   /* bir ton açık katman              */
  --ink-3:    #123024;   /* kart / vurgu katmanı             */
  --gold:     #C2AC79;   /* ana vurgu — şampanya             */
  --gold-2:   #E8E0C9;   /* açık krem — hover, parıltı       */
  --cream:    #F1EDDF;   /* ana metin                        */
  --muted:    #93A597;   /* ikincil metin — yeşil-gri        */
  --line:     rgba(194, 172, 121, .18);
  --line-2:   rgba(241, 237, 223, .08);
  --veil:     10, 23, 16;   /* zemin renginin RGB'si — foto örtüleri için */

  --serif: "Cormorant Garamond", Georgia, serif;
  --sans:  "Manrope", -apple-system, "Segoe UI", sans-serif;

  --pad: clamp(1.25rem, 5vw, 6rem);
  --nav-h: 4.5rem;
}

* { margin: 0; padding: 0; box-sizing: border-box; }

html { scroll-behavior: smooth; }
html.lenis { scroll-behavior: auto; }

body {
  background: var(--ink);
  color: var(--cream);
  font-family: var(--sans);
  font-weight: 300;
  font-size: clamp(.95rem, .9rem + .2vw, 1.05rem);
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

/* İnce doku — grenli kâğıt hissi */
body::after {
  content: "";
  position: fixed; inset: 0;
  pointer-events: none;
  z-index: 999;
  opacity: .035;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");
}

::selection { background: var(--gold); color: var(--ink); }

/* Metin seçimi sınırlaması (büro talebi) — form alanları hariç */
body {
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
}
input, textarea, select { -webkit-user-select: text; user-select: text; }

a { color: inherit; text-decoration: none; }
em { font-style: italic; }

.skip-link {
  position: absolute; top: -3rem; left: 1rem;
  background: var(--gold); color: var(--ink);
  padding: .5rem 1rem; z-index: 1001;
  font-size: .8rem; transition: top .2s;
}
.skip-link:focus { top: 1rem; }

:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }


/* ═══════════════ NAV ═══════════════ */

.nav {
  position: fixed; top: 0; left: 0; right: 0;
  z-index: 100;
  display: flex; align-items: center; gap: 2rem;
  height: var(--nav-h);
  padding: 0 var(--pad);
  transition: background .4s, border-color .4s, backdrop-filter .4s;
  border-bottom: 1px solid transparent;
}
.nav.is-scrolled {
  background: rgba(10, 23, 16, .82);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  border-bottom-color: var(--line-2);
}

.nav__logo {
  display: flex; align-items: center; gap: .6rem;
  margin-right: auto;
}
/* Büronun kendi monogramı — footer'daki filigranın aynısı, burada dolu ve
   küçük. Talep büroya ait (Zehra, 13 Ağustos 2026): logo sitede yalnız
   footer filigranında ve favicon'da yaşıyordu. Tipografik "A&K" kaldırıldı;
   monogram zaten A&K'yı söylüyor, ikisi birlikte tekrar olurdu. */
.nav__logo-mono {
  height: 1.5rem; width: auto; flex-shrink: 0;
  fill: var(--cream);
  transition: fill .3s;
}
.nav__logo:hover .nav__logo-mono { fill: var(--gold); }
.nav__logo-word {
  font-size: .72rem; letter-spacing: .32em;
  text-transform: uppercase; color: var(--muted);
}

.nav__links { display: flex; gap: clamp(1rem, 1.6vw, 2rem); }
.nav__links a {
  font-size: .8rem; letter-spacing: .08em;
  color: var(--muted);
  position: relative;
  transition: color .3s;
}
.nav__links a::after {
  content: "";
  position: absolute; left: 0; bottom: -6px;
  width: 100%; height: 1px;
  background: var(--gold);
  transform: scaleX(0); transform-origin: right;
  transition: transform .35s cubic-bezier(.25, .8, .25, 1);
}
.nav__links a:hover { color: var(--cream); }
.nav__links a:hover::after { transform: scaleX(1); transform-origin: left; }

.nav__tel {
  font-size: .8rem; letter-spacing: .06em;
  color: var(--gold);
  border: 1px solid var(--line);
  padding: .55rem 1.1rem;
  transition: background .3s, color .3s, border-color .3s;
}
.nav__tel:hover { background: var(--gold); color: var(--ink); border-color: var(--gold); }

/* Dil seçici */
.nav__lang {
  display: flex; align-items: center; gap: .55rem;
  font-size: .72rem; letter-spacing: .12em;
}
.nav__lang > * { color: var(--muted); transition: color .3s; }
.nav__lang .is-active { color: var(--gold); }
.nav__lang a:hover { color: var(--cream); }
.nav__lang > * + *::before {
  content: ""; position: absolute; margin-left: -.32rem;
  width: 1px; height: .7rem; background: var(--line);
}
.nav__lang a { position: relative; }

/* Arka plan müziği anahtarı — üç çubuklu ekolayzer.
   [hidden] ile gelir, main.js açar: JS yoksa çalışmayan düğme görünmesin. */
.nav__sound {
  position: relative;                /* ipucu halkası ve etiketi için */
  display: flex; align-items: center; justify-content: center; gap: 3px;
  width: 2.75rem; height: 2.75rem;   /* 44px — dokunma hedefi */
  padding: 0; margin: 0 -.55rem 0 0;
  background: none; border: 0; cursor: pointer;
  color: var(--muted);
  transition: color .3s;
}
.nav__sound[hidden] { display: none; }   /* display:flex'i ezmesi şart */
.nav__sound i {
  display: block; width: 2px; height: 6px;
  background: currentColor;
  transition: height .3s ease;
}
.nav__sound i:nth-child(2) { height: 11px; }
.nav__sound:hover, .nav__sound:focus-visible { color: var(--cream); }
.nav__sound[aria-pressed="true"] { color: var(--gold); }
.nav__sound[aria-pressed="true"] i {
  animation: sound-bar 1.15s ease-in-out infinite;
}
.nav__sound[aria-pressed="true"] i:nth-child(2) { animation-delay: .21s; }
.nav__sound[aria-pressed="true"] i:nth-child(3) { animation-delay: .42s; }

@keyframes sound-bar {
  0%, 100% { height: 5px; }
  50%      { height: 15px; }
}

/* ── Otomatik oynatma engellendiğinde dikkat çekme ──────────────────────
   Chrome/Safari ilk kez gelen ziyaretçide sesli oynatmayı engeller. O anda
   düğme nav'ın içinde küçük ve fark edilmez; ziyaretçi müziğin varlığını
   bilmez. `.is-hinting` JS tarafından YALNIZ engellenme durumunda eklenir ve
   müzik başlar başlamaz kaldırılır. Oturumda bir kez gösterilir.

   Ölçülü tutuldu: hukuk bürosu sitesinde yanıp sönen çağrı yakışmaz. Halka
   üç kez atıp durur, etiket yumuşakça belirir ve kalır. */
/* Ortalama `right: 0` ile yapılmıyor: etiket düğmeden geniş (TR'de 48px vs
   44px, EN "Turn on sound"da çok daha fazla), sağ kenara yaslanınca ikonun
   soluna kayıyor. left:50% + translateX(-50%) metin uzunluğundan bağımsız
   ortalar — EN etiketi de düzelir. Kaydırma dikey fade ile aynı transform'da
   olduğu için ikisi birlikte yazılmak zorunda. */
.nav__sound-hint {
  position: absolute; top: calc(100% - .3rem); left: 50%;
  white-space: nowrap;
  font-size: .58rem; letter-spacing: .18em; text-transform: uppercase;
  color: var(--gold);
  opacity: 0; transform: translate(-50%, -5px);
  transition: opacity .6s ease, transform .6s ease;
  pointer-events: none;               /* tıklama düğmeye gitsin */
}
.nav__sound.is-hinting { color: var(--gold); }
.nav__sound.is-hinting .nav__sound-hint { opacity: .92; transform: translate(-50%, 0); }
.nav__sound.is-hinting::before {
  content: "";
  position: absolute; inset: 4px;
  border: 1px solid var(--gold); border-radius: 50%;
  opacity: 0;
  animation: sound-hint 2.6s ease-out 3;
}
@keyframes sound-hint {
  0%        { transform: scale(.55); opacity: .5; }
  70%, 100% { transform: scale(1.45); opacity: 0; }
}

.nav__burger {
  display: none;
  background: none; border: 0; cursor: pointer;
  width: 2.75rem; height: 2.75rem;   /* 44px — dokunma hedefi */
  padding: .55rem 0;
  flex-direction: column; justify-content: center; gap: 7px;
  margin-right: -.55rem;
}
.nav__burger span {
  display: block; height: 1px; width: 100%;
  background: var(--cream);
  transition: transform .35s, opacity .35s;
}
.nav__burger[aria-expanded="true"] span:first-child { transform: translateY(4px) rotate(45deg); }
.nav__burger[aria-expanded="true"] span:last-child  { transform: translateY(-4px) rotate(-45deg); }

/* Mobil menü */
.mmenu {
  position: fixed; inset: 0; z-index: 99;
  background: rgba(10, 23, 16, .97);
  -webkit-backdrop-filter: blur(18px);
  backdrop-filter: blur(18px);
  display: flex; flex-direction: column;
  justify-content: center; align-items: flex-start;
  padding: var(--pad);
  opacity: 0; visibility: hidden;
  /* Kapanışta görünürlük solma bitince değişir; açılışta anında —
     böylece menü açılır açılmaz ilk bağlantı odaklanabilir. */
  transition: opacity .45s, visibility 0s .45s;
}
.mmenu.is-open {
  opacity: 1; visibility: visible;
  transition: opacity .45s, visibility 0s 0s;
}
.mmenu__links { display: flex; flex-direction: column; gap: 1.1rem; }
.mmenu__links a {
  font-family: var(--serif);
  font-size: clamp(2rem, 8vw, 3rem);
  font-weight: 400;
  display: flex; align-items: baseline; gap: 1rem;
  transform: translateY(24px); opacity: 0;
  transition: transform .55s cubic-bezier(.22, 1, .36, 1), opacity .55s;
}
.mmenu.is-open .mmenu__links a { transform: none; opacity: 1; }
.mmenu.is-open .mmenu__links a:nth-child(2) { transition-delay: .05s; }
.mmenu.is-open .mmenu__links a:nth-child(3) { transition-delay: .1s; }
.mmenu.is-open .mmenu__links a:nth-child(4) { transition-delay: .15s; }
.mmenu.is-open .mmenu__links a:nth-child(5) { transition-delay: .2s; }
.mmenu.is-open .mmenu__links a:nth-child(6) { transition-delay: .25s; }
.mmenu.is-open .mmenu__links a:nth-child(7) { transition-delay: .3s; }
.mmenu__links small {
  font-family: var(--sans);
  font-size: .7rem; color: var(--gold); letter-spacing: .15em;
}
/* Numarasız alt sayfa bağlantıları — ince çizgiyle ayrılır */
.mmenu__sep {
  margin-top: .8rem;
  padding-top: 1.4rem;
  border-top: 1px solid var(--line-2);
}
.mmenu__tel {
  margin-top: 2.4rem;
  color: var(--gold); letter-spacing: .08em; font-size: .9rem;
}
.mmenu__lang {
  margin-top: 1rem;
  display: flex; gap: .8rem;
  font-size: .8rem; letter-spacing: .12em;
}
.mmenu__lang .is-active { color: var(--gold); }
.mmenu__lang a { color: var(--muted); }

/* ═══════════════ HERO ═══════════════ */

.hero {
  position: relative;
  min-height: 100vh;    /* eski tarayıcı yedeği (iOS 15.3 ve öncesi) */
  min-height: 100svh;
  display: flex; flex-direction: column; justify-content: center;
  padding: calc(var(--nav-h) + 2rem) var(--pad) 2rem;
  background:
    radial-gradient(120% 90% at 70% 10%, #163524 0%, transparent 55%),
    radial-gradient(80% 60% at 15% 90%, #102818 0%, transparent 60%),
    var(--ink);
  overflow: hidden;
}

/* Fotoğraflı hero — gerçek kolonlar sahte motifin yerini alır */
.hero__bg {
  position: absolute; inset: 0;
  z-index: 0; margin: 0;
}
/* ⚠️ `inset: -6% 0` DEĞİL. O taşma, main.js'teki kaydırma parallax'ı
   (yPercent 9) kayarken altta boşluk açılmasın diye vardı. Hero terazi
   olunca parallax teraziyi kaydırıyordu; tarifin birinci maddesi
   "terazinin bütün geometrisi her an sabit kalır" diyor, on ikincisi de
   "kullanıcı hiçbir noktada terazinin hareket ettiğini düşünmez". Parallax
   main.js'ten kaldırıldı, taşma da gereksizleşti.
   Kazanç yalnız ilkesel değil: taşma görselin dikeyde %12'sini ekranın
   dışında tutuyordu ve terazinin kaidesiyle yansıması alt kenardan
   taşıyordu. Taşma kalkınca yansıma geri geldi. */
/* Hero kaynağı 2.33:1 ultrawide, kap ise ~1.43:1 (inset -6% yüksekliği %112
   yapıyor) — yani tarayıcı yanlardan %39 kırpıyor ve object-position'ı ölçmeden
   seçmek sağ kefeyi kesiyor.

   ⚠️ İLK ÖLÇÜM YANLIŞTI: parlak çekirdek eşiği (>150) alınınca terazi x
   %56.5–86.2 sanıldı ve %57 seçildi. Kefelerin sönük dış kenarları o eşiğin
   altında kaldığı için sağ kefe 1366–1712 arası TÜM dizüstülerde kesiliyordu
   (Kaan bildirdi). Doğru sınır, kefe gövdeleri (>60): kaynakta x %51.7–91.9.

   Buradan: pencere = kapOranı / 2.333, merkez ∈ [%91.9−p/2, %51.7+p/2].
   Altı yaygın ekranın (1366×768 … 1920×1000, MBP14, MBA15) kesişimi %62.5–81.1.
   Aralığın ALT ucu seçildi — terazi böylece mümkün olduğunca sağda kalır, metin
   soldaki karanlığı korur. %64: en dar ekranda (MBP14) bile sağda %2.6 pay var.
   Hero değişirse bu hesabı tekrarla; eşiği >60 al, >150 aldatıyor.

   ── 13 Ağustos 2026, ikinci tur (Chrome ölçümü) ────────────────────────────
   "Chrome'da terazi küçük kalmış." Sebep: cover'da nesnenin ekran payı
       nesne_genişliği ÷ (görsel_yüksekliği × ekran_oranı)
   yani görseli YANLARDAN kırpmak hiçbir şeyi değiştirmiyor, yalnız DİKEYDEN
   kırpmak büyütüyor. Kaynak bandı daraltıldı (build.py HERO_DESKTOP_BAND);
   masaüstü görselinin oranı 2.333 → 2.733 oldu, terazi aynı ekranda
   %39.3'ten %46'ya çıktı.

   Bant değişince %64 geçersizleşti — terazi büyüdüğü için sağ kefe 1.64
   oranında %101.2'ye taşıyordu. Yeniden tarandı (oran → sol kefe – sağ kefe):
       %64 → 1.64: 49.6–101.2 ✗   1.84: 51.2–97.2
       %70 → 1.64: 45.6–97.2      1.84: 48.3–94.3
       %74 → 1.35: 36.3–99   1.64: 43.0–94.5   1.84: 46.3–92.3   2.20: 50.8–89.3
   %74 seçildi: 1.35–2.20 aralığının tamamında sağ kefe kırpılmıyor. Asimetrik
   kırpılmış bir adalet terazisi hukuk markası için verilebilecek en yanlış
   izlenim; sağ payın bir miktar bollaşması buna tercih edildi. */
.hero__bg img {
  width: 100%; height: 100%;
  object-fit: cover; object-position: 74% center;
  display: block;
}
/* Hero ışık katmanının tuvali — hero__bg'nin İÇİNDE ve tam ölçüsünde.
   İçinde olması şart: çerçeve <img>'inkiyle birebir aynı olsun diye aynı
   kutuyu paylaşıyorlar. pointer-events yok — CTA, navigasyon ve bağlantılar
   hiçbir koşulda engellenmiyor; imleç hero üstünden dinleniyor, tuvalden
   değil. Hazır olana kadar saydam durur, altındaki görsel görünür; yani
   WebGL kurulamazsa veya reduced-motion açıksa hero hiç boş kalmaz. */
.hero__gl {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  display: block;
  pointer-events: none;
  opacity: 0;
  transition: opacity .25s linear;
}
.hero__gl.is-ready { opacity: 1; }
@media print { .hero__gl { display: none; } }

/* Mobil AYRI bir kaynaktır (4:5 kırpma, merkezi 0.71) — masaüstünün %64'ü burada
   teraziyi ekranın %27'sine itiyordu. Bu kırpma kaynağın %53.85–88.12'sini alır,
   terazinin merkezi (%71.8) kırpma içinde %52.4'e denk gelir; %52 seçilince
   ekranda %50.7'ye, yani tam ortaya oturur. Kırılım <picture>'ın mobil
   source'uyla ve perdeyle aynı: 768px. */
@media (max-width: 768px) {
  .hero__bg img { object-position: 52% center; }
}
.hero__veil {
  position: absolute; inset: 0; z-index: 1;
  background:
    linear-gradient(to right,
      rgba(var(--veil), .93) 0%,
      rgba(var(--veil), .62) 45%,
      rgba(var(--veil), .18) 78%,
      rgba(var(--veil), .32) 100%),
    linear-gradient(to top, rgba(var(--veil), .88), transparent 32%);
}
/* Mobilde perde sola değil, eşit dağılır. Masaüstünde metin solda durduğu için
   yukarıdaki reçete sağı %18'e kadar açıyor; dar ekranda ise metin tam genişlikte
   akıyor ve hero görselinin ortasındaki aydınlık lamba koridoru gövde metninin
   altına düşüyor. Kırılım <picture>'ın mobil source'uyla aynı — perde ve görsel
   birlikte değişsin.

   Değerler gözle değil ölçülerek seçildi: 375×812'de perde görselin üstüne
   bindirilip metin bantlarındaki %95'lik zemin parlaklığına karşı WCAG kontrastı
   hesaplandı. En kritik bant .hero__tagline (rgb 147,165,151, normal punto,
   eşik 4.5). Bu reçete 5.49:1 veriyor. Hero fotoğrafı değişirse yeniden ölç —
   bir önceki görselde .74/.68 yetiyordu, yenisinin sağı parlak olduğu için
   4.63'e düşmüştü, yani eşiğin hemen üstünde kalıyordu. */
@media (max-width: 768px) {
  .hero__veil {
    background:
      linear-gradient(to right,
        rgba(var(--veil), .92) 0%,
        rgba(var(--veil), .82) 50%,
        rgba(var(--veil), .78) 100%),
      linear-gradient(to top, rgba(var(--veil), .92), transparent 62%);
  }
}
/* Fotoğraflı heroda sütun motifi ve dev "&" gizli.
   NOT: "&"i geri getirmeyi denedik (kontur .085 ve .13) — mevcut fotoğrafın sağ
   yarısı parlak sütunlar ve altın ışıkla dolu olduğu için kontur hiç okunmuyordu.
   Sağ tarafı koyu yeni bir hero gelirse tek satırla açılır:
   .hero--photo .hero__amp { display: block; -webkit-text-stroke-color: rgba(198,161,91,.13); } */
.hero--photo .hero__lines,
.hero--photo .hero__amp { display: none; }
.hero__inner, .hero__foot { position: relative; z-index: 2; }

/* Sütun motifi — mahkeme kolonlarının soyutlaması */
.hero__lines {
  position: absolute; inset: 0;
  display: flex; justify-content: space-evenly;
  pointer-events: none;
}
.hero__lines span {
  width: 1px; height: 100%;
  background: linear-gradient(to bottom, transparent, var(--line) 30%, var(--line) 70%, transparent);
}

/* Dev "&" — markanın ruhu */
.hero__amp {
  position: absolute;
  right: -4%; top: 50%;
  transform: translateY(-52%);
  font-family: var(--serif); font-style: italic;
  font-size: clamp(24rem, 58vw, 62rem);
  line-height: 1;
  color: transparent;
  -webkit-text-stroke: 1px rgba(198, 161, 91, .14);
  user-select: none; pointer-events: none;
}

.hero__inner { position: relative; max-width: 60rem; }

.hero__eyebrow {
  display: flex; align-items: center; gap: 1rem;
  font-size: .74rem; letter-spacing: .34em;
  text-transform: uppercase; color: var(--gold);
  margin-bottom: clamp(1.5rem, 3vh, 2.5rem);
}
.rule { display: inline-block; width: 3.5rem; height: 1px; background: var(--gold); }

.hero__title {
  font-family: var(--serif);
  font-weight: 400;
  font-size: clamp(4rem, 13vw, 11rem);
  line-height: .96;
  letter-spacing: .01em;
}
.hero__title em { color: var(--gold); font-weight: 300; }
.hero__line { display: block; overflow: hidden; }
.hero__line > span { display: inline-block; }

/* Slogan — büronun ana cümlesi */
.hero__slogan {
  margin-top: clamp(1.4rem, 3vh, 2.25rem);
  max-width: 34rem;
  font-family: var(--serif);
  font-size: clamp(1.45rem, 1.1rem + 1.4vw, 2.35rem);
  font-weight: 400;
  line-height: 1.25;
  color: var(--cream);
}

.hero__tagline {
  margin-top: clamp(.9rem, 2vh, 1.4rem);
  max-width: 34rem;
  color: var(--muted);
  font-size: clamp(1rem, .95rem + .3vw, 1.15rem);
  line-height: 1.8;
}

.hero__motto {
  display: block;
  margin-top: 1.1rem;
  font-family: var(--serif);
  font-style: italic;
  font-size: 1.15em;
  color: var(--gold);
  letter-spacing: .01em;
}

.hero__cta {
  margin-top: clamp(2rem, 4vh, 3rem);
  display: flex; gap: 1rem; flex-wrap: wrap;
}

.btn {
  font-size: .8rem; letter-spacing: .14em; text-transform: uppercase;
  padding: 1rem 2rem;
  border: 1px solid var(--gold);
  transition: background .35s, color .35s, border-color .35s;
}
.btn--solid { background: var(--gold); color: var(--ink); font-weight: 500; }
.btn--solid:hover { background: var(--gold-2); border-color: var(--gold-2); }
.btn--ghost { color: var(--cream); border-color: var(--line-2); }
.btn--ghost:hover { border-color: var(--gold); color: var(--gold); }

.hero__foot {
  position: relative;
  margin-top: auto;
  padding-top: 2rem;
  display: flex; justify-content: space-between; align-items: flex-end;
  font-size: .74rem; letter-spacing: .12em;
  color: var(--muted);
}
.hero__scroll { display: flex; align-items: center; gap: .8rem; }
.hero__scroll-line {
  display: inline-block; width: 1px; height: 3rem;
  background: linear-gradient(to bottom, var(--gold), transparent);
  animation: scrollPulse 2.2s ease-in-out infinite;
}
@keyframes scrollPulse {
  0%, 100% { transform: scaleY(.4); transform-origin: top; opacity: .4; }
  50%      { transform: scaleY(1);  transform-origin: top; opacity: 1; }
}

/* ═══════════════ SECTION ORTAK ═══════════════ */

.section {
  padding: clamp(5rem, 12vh, 9rem) var(--pad);
  position: relative;
}
.section--tint { background: var(--ink-2); }

.section__head {
  display: flex; align-items: baseline; gap: 1.5rem;
  margin-bottom: clamp(3rem, 6vh, 5rem);
  border-bottom: 1px solid var(--line-2);
  padding-bottom: 1.25rem;
}
.section__no {
  font-family: var(--serif); font-style: italic;
  color: var(--gold); font-size: 1.1rem;
}
.section__label {
  font-size: .8rem; font-weight: 400;
  letter-spacing: .34em; text-transform: uppercase;
  color: var(--muted);
}

/* ═══════════════ A&K PERSPEKTİFİ ═══════════════ */

/* Akordeon — Sektörel Odaklar'ın (.area) ritmiyle bilerek aynı: aynı satır
   yüksekliği, aynı artı işareti, aynı easing. Ziyaretçi ikinci bir etkileşim
   dili öğrenmek zorunda kalmasın. İki sütundan tek sütuna indirildi; kapalı
   hâlde yan yana iki başlık geniş ekranda ortada boşluk bırakıyordu. */
.perspective { display: grid; }
.perspective__card { border-bottom: 1px solid var(--line-2); }
.perspective__card:first-child { border-top: 1px solid var(--line-2); }

.perspective__title { margin: 0; }
.perspective__row {
  width: 100%;
  display: flex; align-items: center; gap: clamp(1rem, 4vw, 3rem);
  padding: clamp(1.4rem, 3vh, 2.1rem) 0;
  background: none; border: 0; cursor: pointer;
  color: inherit; text-align: left;
  transition: padding-left .4s cubic-bezier(.25, .8, .25, 1);
}
.perspective__row:hover { padding-left: clamp(.5rem, 2vw, 1.5rem); }
.perspective__row:hover .perspective__name { color: var(--gold-2); }
.perspective__name {
  font-family: var(--serif); font-weight: 400;
  font-size: clamp(1.6rem, 1.2rem + 1.4vw, 2.4rem);
  line-height: 1.15;
  color: var(--gold);
  transition: color .35s;
  flex: 1;
}
.perspective__plus {
  position: relative; width: 1rem; height: 1rem; flex-shrink: 0;
}
.perspective__plus::before, .perspective__plus::after {
  content: "";
  position: absolute; background: var(--gold);
  transition: transform .4s cubic-bezier(.25, .8, .25, 1);
}
.perspective__plus::before { left: 0; top: 50%; width: 100%; height: 1px; }
.perspective__plus::after  { left: 50%; top: 0; width: 1px; height: 100%; }
.perspective__row[aria-expanded="true"] .perspective__plus::after { transform: rotate(90deg); }

.perspective__panel {
  max-height: 0; overflow: hidden;
  transition: max-height .5s cubic-bezier(.25, .8, .25, 1);
}
.perspective__panel > :last-child { padding-bottom: 1.8rem; }

.perspective__lead {
  font-family: var(--serif);
  font-size: clamp(1.15rem, 1rem + .6vw, 1.5rem);
  line-height: 1.45;
  color: var(--cream);
  margin-bottom: 1.4rem;
  max-width: 46rem;
}
.perspective__card p { color: var(--muted); line-height: 1.9; max-width: 46rem; }

/* JS engelliyse akordeon açılamaz → vizyon ve misyon baştan görünür olsun.
   .area ile aynı güvenlik ağı; içerik hiçbir koşulda kaybolmaz. */
html:not(.js) .perspective__panel { max-height: none; }
html:not(.js) .perspective__plus { display: none; }
html:not(.js) .perspective__row { cursor: default; }

/* ═══════════════ 01 · HAKKIMIZDA ═══════════════ */

/* Editöryal akış (büro geri dönüşü üzerine yeniden kuruldu, 14 Ağustos 2026).
   Eski düzen 7fr/5fr iki sütundu: solda 7-8 satırlık dev serif paragraf,
   sağda küçük sans sütunu. Manifesto (creed-scrub) ile birlikte bölümde İKİ
   uzun serif blok yarışıyordu ve "karışık" hissi buradan geliyordu.
   Rol dağılımı: lead yalnız kimlik cümlesi (2-3 satır), açıklama
   paragrafları gövdede. Manifestoya DOKUNULMADI — bölümün yıldızı o.
   Ölçek merdiveni 1440'ta: gövde 16.8 → lead 35.2 (×2.10) → creed 49.6
   (×1.41). Eski lead üst sınırı 2.9rem'di (oran 2.76×, büro "uyumsuz" dedi).

   ⚠️ Gövdeyi sağa yaslamak (margin-left:auto ile zikzak) DENENDİ VE GERİ
   ALINDI: Kaan'ın geniş ekranında sütun lead'den kopuk "yüzüyor" göründü,
   sol altta dengesiz bir boşluk kaldı. Tekrar önerme. Gövde lead ile aynı
   sol eksende; hiyerarşiyi konum değil boyut ve renk kuruyor. */
/* Kimlik cümlesi akordeon tetiği. Perspektif/Sektörel Odaklar ile aynı
   mekanik; farkı tetiğin bir ETİKET değil iki satırlık bir cümle olması. */
.about__row {
  width: 100%; display: flex; align-items: flex-start;
  gap: clamp(1rem, 4vw, 3rem);
  padding: 0; background: none; border: 0; cursor: pointer;
  color: inherit; text-align: left;
}
.about__lead {
  font-family: var(--serif);
  font-weight: 400;
  font-size: clamp(1.7rem, 1.2rem + 1.6vw, 2.2rem);
  line-height: 1.4;
  max-width: 54rem;
  flex: 1;
  transition: color .35s;
}
.about__row:hover .about__lead { color: var(--gold-2); }
.about__lead em { color: var(--gold); }

/* Artı işareti: dikey ortada DEĞİL — iki satırlık cümlenin ortasında asılı
   kalıyordu. .7em üst boşluk ilk satırın optik ortasına oturtur. */
.about__plus {
  position: relative; width: 1rem; height: 1rem; flex-shrink: 0;
  margin-top: .7em;
}
.about__plus::before, .about__plus::after {
  content: "";
  position: absolute; background: var(--gold);
  transition: transform .4s cubic-bezier(.25, .8, .25, 1);
}
.about__plus::before { left: 0; top: 50%; width: 100%; height: 1px; }
.about__plus::after  { left: 50%; top: 0; width: 1px; height: 100%; }
.about__row[aria-expanded="true"] .about__plus::after { transform: rotate(90deg); }

.about__panel {
  max-height: 0; overflow: hidden;
  transition: max-height .5s cubic-bezier(.25, .8, .25, 1);
}
.about__body {
  color: var(--muted); display: grid; gap: 1.25rem;
  max-width: 42rem;   /* .area__panel p ile aynı ölçü; 46rem satırı ~80 karaktere taşırıyordu */
  padding-top: clamp(2.25rem, 4vh, 3rem);
}
.about__body strong { font-weight: 500; color: var(--gold-2); }

/* JS engelliyse akordeon açılamaz → kimlik metni baştan görünür.
   .area ve .perspective ile aynı güvenlik ağı. */
html:not(.js) .about__panel { max-height: none; }
html:not(.js) .about__plus { display: none; }
html:not(.js) .about__row { cursor: default; }

/* Kelime kelime beliren manifesto — scroll scrub */
.creed-scrub {
  margin-top: clamp(4rem, 8vh, 6rem);
  min-height: 62vh;
  display: flex; align-items: center; justify-content: center;
}
.creed-scrub__text {
  font-family: var(--serif);
  font-weight: 400;
  font-size: clamp(1.7rem, 1.2rem + 2.4vw, 3.1rem);
  line-height: 1.45;
  max-width: 56rem;
  text-align: center;
}
.creed-scrub__text .wd { display: inline-block; }
html.has-js .creed-scrub__text .wd { opacity: .13; }

/* ═══════════════ 02 · YAKLAŞIM ═══════════════ */

.principles-split {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  gap: clamp(2rem, 4vw, 4rem);
  align-items: stretch;
}
.principles-img {
  margin: 0;
  border: 1px solid var(--line);
  overflow: hidden;
  position: relative;
}
.principles-img img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
}
/* İlke görselleri — JS ekler, dosya varsa aktif ilkeyle çapraz geçiş yapar */
.principles-img__layer {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity .9s ease;
}
.principles-img__layer.is-active { opacity: 1; }

.principles {
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  gap: 1px;
  background: var(--line-2);
  border: 1px solid var(--line-2);
}
/* Scroll ilerledikçe kendini çizen altın çizgi (JS ekler) */
.principles__progress {
  position: absolute; left: -1px; top: 0; bottom: 0;
  width: 2px; z-index: 1;
  background: linear-gradient(var(--gold), var(--gold-2));
  transform-origin: top;
  transform: scaleY(0);
  pointer-events: none;
}
.principle {
  background: var(--ink-2);
  padding: clamp(2rem, 4vw, 3.5rem);
  transition: background .45s;
}
.principle:hover { background: var(--ink-3); }
/* İlke aydınlanması — yalnızca animasyonlar aktifken (html.has-js) devrede.
   Reveal animasyonu .principle'ın kendisini kullanır; bu yüzden soluklaştırma
   çocuk öğelerde yapılır ki iki efekt çakışmasın. */
html.has-js .principle > h3,
html.has-js .principle > p { opacity: .35; transition: opacity .6s ease; }
html.has-js .principle .principle__no { opacity: .5; transition: opacity .6s ease, color .6s ease; }
html.has-js .principle.is-lit > h3,
html.has-js .principle.is-lit > p { opacity: 1; }
html.has-js .principle.is-lit .principle__no { opacity: 1; color: var(--gold-2); }
.principle__no {
  font-family: var(--serif); font-style: italic;
  color: var(--gold); font-size: 1.3rem;
  display: block; margin-bottom: 1.5rem;
}
.principle h3 {
  font-family: var(--serif); font-weight: 500;
  font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem);
  margin-bottom: 1rem;
}
/* Paragraf: muted (#93A597) 15px'te panelde kayboluyordu — krem tonuna
   yaklaştırılıp büyütüldü; başlık kremden ayrışsın diye tam opak değil. */
.principle p {
  color: rgba(241, 237, 223, .8);
  font-size: clamp(1rem, .93rem + .35vw, 1.2rem);
  line-height: 1.85;
  max-width: 34rem;
}

/* ─── Ekrana sabitlenen (pin) düzen — yalnız ≥900px ───────────────────────
   `.is-pinned` sınıfını JS ekler. Bölüm ekran yüksekliğine oturur, soldaki
   görsel ilk kez tam boy görünür, ilkeler sağda tek tek geçer.
   JS yoksa / reduced-motion / GSAP çökerse sınıf hiç eklenmez ve bölüm
   eskisi gibi normal akar — içerik hiçbir koşulda kırpılmaz. */
@media (min-width: 900px) {
  /* ─── Sahne: bölüm ekranı kaplar, grid iptal, katmanlı kurgu ─── */
  .principles-split.is-pinned {
    --stage-h: 100vh;            /* eski tarayıcı yedeği */
    --stage-h: 100svh;
    position: relative;
    display: block;
    height: var(--stage-h);
  }

  /* Katman 0 — görsel tam genişliğe taşar (section --pad'ini absolute ile kırar,
     negatif marj kullanmaz ki pin ölçümü split kutusunda kalsın).
     !important: data-reveal tween'i öğeye inline opacity/visibility bırakıyor. */
  .principles-split.is-pinned .principles-img {
    position: absolute;
    top: 0; bottom: 0;
    left: calc(var(--pad) * -1);
    right: calc(var(--pad) * -1);
    border: 0; z-index: 0;
    opacity: 1 !important; visibility: visible !important;
  }
  .principles-split.is-pinned .principles-img > picture img {
    position: absolute; inset: 0;
    width: 100%; height: 100%;
    object-position: center 45%;
  }
  /* Portre 4:5 görsel 16:9 kutuya cover ile oturunca yalnız DİKEYDE kırpılır;
     bu yüzden her görselin konusu için ayrı bant seçilir.
     Seçiciler uzantısız — build.py onizleme'de jpg'yi webp'ye çeviriyor. */
  .principles-split.is-pinned .principles-img__layer[src*="ilke-guven"]     { object-position: center 50%; }
  .principles-split.is-pinned .principles-img__layer[src*="ilke-ozen"]      { object-position: center 70%; }
  .principles-split.is-pinned .principles-img__layer[src*="ilke-strateji"]  { object-position: center 62%; }
  .principles-split.is-pinned .principles-img__layer[src*="ilke-teknoloji"] { object-position: center 75%; }

  /* Perde — metin solda okunur kalsın (hero__veil reçetesinin ağırlaştırılmışı) */
  .principles-split.is-pinned .principles-img::after {
    content: "";
    position: absolute; inset: 0;
    background:
      linear-gradient(to right,
        rgba(var(--veil), .93) 0%,
        rgba(var(--veil), .74) 40%,
        rgba(var(--veil), .30) 72%,
        rgba(var(--veil), .48) 100%),
      linear-gradient(to top, rgba(var(--veil), .82), transparent 28%),
      linear-gradient(to bottom, rgba(var(--veil), .55), transparent 20%);
  }

  /* Katman 1 — bölüm sahnesi */
  .principles-split.is-pinned .principles {
    position: absolute; inset: 0; z-index: 1;
    display: block;
    background: none; border: 0;
    overflow: visible;
  }
  .principles-split.is-pinned .principles__progress { left: 0; top: 0; bottom: 0; }

  /* İlkeler üst üste yığılır; yalnız aktif olanın içeriği belirir */
  .principles-split.is-pinned .principle {
    position: absolute; inset: 0;
    display: flex; flex-direction: column; justify-content: center;
    padding: calc(var(--nav-h) + 2rem) clamp(2rem, 4vw, 3.5rem) 3rem;
    background: none; border: 0;
    opacity: 1 !important; visibility: visible !important;
    pointer-events: none;
  }
  .principles-split.is-pinned .principle > h3,
  .principles-split.is-pinned .principle > p {
    position: relative; z-index: 1;
    opacity: 0; transform: translateY(18px);
    transition: opacity .65s ease, transform .65s ease;
  }
  .principles-split.is-pinned .principle.is-lit > h3,
  .principles-split.is-pinned .principle.is-lit > p { opacity: 1; transform: none; }
  .principles-split.is-pinned .principle.is-lit > p { transition-delay: .08s; }

  .principles-split.is-pinned .principle h3 {
    font-size: clamp(2.8rem, 2rem + 2.6vw, 5rem);
    margin-bottom: 1.4rem;
    max-width: 34rem;
  }
  .principles-split.is-pinned .principle p {
    font-size: clamp(1.1rem, 1rem + .5vw, 1.4rem);
    line-height: 1.9;
    max-width: 36rem;
    color: rgba(241, 237, 223, .88);
  }

  /* Dev hayalet rakam — mevcut .principle__no'nun kendisi büyür.
     Ekstra öğe yok: ekran okuyucu bugünkü gibi bir kez okur.
     Kontur tekniği .hero__amp ile aynı. */
  .principles-split.is-pinned .principle .principle__no {
    position: absolute;
    right: clamp(1rem, 5vw, 5rem);
    top: 50%; transform: translateY(-50%);
    margin: 0; line-height: .75;
    font-size: clamp(14rem, 26vw, 26rem);
    color: rgba(194, 172, 121, .05);
    -webkit-text-stroke: 1px rgba(194, 172, 121, .28);
    opacity: 0; transition: opacity .8s ease;
    pointer-events: none; user-select: none;
    z-index: 0;
  }
  .principles-split.is-pinned .principle.is-lit .principle__no { opacity: 1; }
}

/* ═══════════════ 03 · ÇALIŞMA ALANLARI ═══════════════ */

.areas { list-style: none; }
.area { border-bottom: 1px solid var(--line-2); }
.area:first-child { border-top: 1px solid var(--line-2); }

.area__row {
  width: 100%;
  display: flex; align-items: center; gap: clamp(1rem, 4vw, 3rem);
  padding: clamp(1.4rem, 3vh, 2.1rem) 0;
  background: none; border: 0; cursor: pointer;
  color: inherit; text-align: left;
  transition: padding-left .4s cubic-bezier(.25, .8, .25, 1);
}
.area__row:hover { padding-left: clamp(.5rem, 2vw, 1.5rem); }
.area__row:hover .area__name { color: var(--gold-2); }

.area__no {
  font-family: var(--serif); font-style: italic;
  color: var(--gold); font-size: 1rem;
  min-width: 2.2rem;
}
.area__name {
  font-family: var(--serif); font-weight: 400;
  font-size: clamp(1.6rem, 1.1rem + 2.4vw, 3.2rem);
  line-height: 1.15;
  transition: color .35s;
  flex: 1;
}
.area__plus {
  position: relative; width: 1rem; height: 1rem; flex-shrink: 0;
}
.area__plus::before, .area__plus::after {
  content: "";
  position: absolute; background: var(--gold);
  transition: transform .4s cubic-bezier(.25, .8, .25, 1);
}
.area__plus::before { left: 0; top: 50%; width: 100%; height: 1px; }
.area__plus::after  { left: 50%; top: 0; width: 1px; height: 100%; }
.area__row[aria-expanded="true"] .area__plus::after { transform: rotate(90deg); }

.area__panel {
  max-height: 0; overflow: hidden;
  transition: max-height .5s cubic-bezier(.25, .8, .25, 1);
}
.area__panel p {
  color: var(--muted);
  max-width: 42rem;
  padding: 0 0 1.8rem calc(2.2rem + clamp(1rem, 4vw, 3rem));
}

/* JS engelliyse akordeon açılamaz → tüm açıklamalar baştan görünür olsun */
html:not(.js) .area__panel { max-height: none; }
html:not(.js) .area__plus { display: none; }
html:not(.js) .area__row { cursor: default; }

/* 24 alan listesi — yoğun ritim, başlıklar bir tık küçük */
.areas--dense .area__name { font-size: clamp(1.15rem, .95rem + 1.15vw, 1.9rem); }
.areas--dense .area__row { padding: clamp(1rem, 2vh, 1.4rem) 0; }
.areas--dense .area__no { font-size: .85rem; min-width: 2.6rem; }

/* ─── 3D tambur (küp) — desktop'ta JS kurar ─── */

.cube { display: none; }

#alanlar.cube-active .cube { display: block; }
/* Tambur 8 tematik kümenin vitrini; tam 24'lük indeks altında görünmeye devam eder */
#alanlar.cube-active .areas__intro { margin-top: clamp(4rem, 9vh, 7rem); }

.areas__intro {
  font-family: var(--serif);
  font-size: clamp(1.15rem, 1rem + .7vw, 1.6rem);
  color: var(--cream);
  max-width: 40rem;
  margin-bottom: clamp(1.5rem, 3vh, 2.5rem);
  padding-bottom: 1.25rem;
  border-bottom: 1px solid var(--line);
}

.cube__stage {
  position: relative;
  height: 100vh;
  display: flex; align-items: center; justify-content: center;
  perspective: 1700px;
}
.cube__split {
  display: flex;
  gap: clamp(1.5rem, 3vw, 2.75rem);
  align-items: center;
  width: min(76rem, 90vw);
}
.cube__drum {
  position: relative;
  height: clamp(19rem, 40vh, 23rem);
  transform-style: preserve-3d;
  will-change: transform;
}
.cube__drum--text { flex: 1 1 62%; }
.cube__drum--img  { flex: 1 1 34%; max-width: 24rem; }
.cube__face {
  position: absolute; inset: 0;
  backface-visibility: hidden;
  border: 1px solid var(--line);
  background:
    linear-gradient(160deg, var(--ink-2) 0%, var(--ink-3) 100%);
  display: grid;
  grid-template-columns: auto 1fr;
  gap: clamp(1.5rem, 4vw, 3.5rem);
  align-items: center;
  padding: clamp(1.75rem, 3.5vw, 3.5rem);
  overflow: hidden;
}
.cube__face-no {
  font-family: var(--serif); font-style: italic;
  font-size: clamp(2.5rem, 5vw, 4.5rem);
  color: var(--gold);
  line-height: 1;
  align-self: start;
}
.cube__face h3 {
  font-family: var(--serif); font-weight: 400;
  font-size: clamp(1.9rem, 1.1rem + 2.4vw, 3.4rem);
  line-height: 1.08;
  margin-bottom: .9rem;
}
.cube__face p {
  color: var(--muted);
  max-width: 34rem;
  font-size: clamp(.86rem, .8rem + .25vw, 1rem);
  line-height: 1.65;
}
/* Fotoğraf yüzleri — görsel yoksa tipografik placeholder görünür */
.cube__face--img { padding: 0; display: block; }
.cube__face--img img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  filter: saturate(.88) contrast(1.02);
}
.cube__ph {
  position: absolute; inset: 0;
  display: grid; place-items: center;
  background:
    radial-gradient(80% 80% at 30% 20%, rgba(198, 161, 91, .12), transparent 60%),
    linear-gradient(160deg, var(--ink-3), var(--ink-2));
  overflow: hidden;
}
.cube__ph span {
  font-family: var(--serif); font-style: italic;
  font-size: clamp(4rem, 8vw, 7rem);
  color: var(--gold);
  line-height: 1;
}
.cube__ph::after {
  content: "&";
  position: absolute;
  right: -1rem; bottom: -2.5rem;
  font-family: var(--serif); font-style: italic;
  font-size: 11rem; line-height: 1;
  color: transparent;
  -webkit-text-stroke: 1px var(--line);
}

.cube__counter {
  position: absolute;
  top: clamp(1.5rem, 6vh, 3.5rem); right: 0;
  font-family: var(--serif);
  font-size: 1.6rem;
  color: var(--cream);
  display: flex; align-items: baseline; gap: .5rem;
}
.cube__counter em { font-size: 1rem; color: var(--gold); font-style: italic; }
.cube__hint {
  position: absolute;
  bottom: clamp(1.5rem, 5vh, 3rem); left: 50%;
  transform: translateX(-50%);
  font-size: .72rem; letter-spacing: .3em;
  text-transform: uppercase; color: var(--muted);
}

/* Sahne katmanları: tambur yüzleri altta, sayaç/ipucu her zaman üstte.
   Yarıçap büyüdükçe yüzler dikeyde yayılıp ipucunu örtüyordu. */
.cube__split { position: relative; z-index: 1; }
.cube__counter, .cube__hint { z-index: 2; }

/* Öne bakan yüz — altın kenarlıkla ayrışır (JS .is-front ekler) */
.cube__face { transition: border-color .5s ease; }
.cube__face.is-front { border-color: rgba(194, 172, 121, .5); }

/* Geniş ekran — tambur cömertleşir. Altındaki JS yarıçapı her ölçümde
   yeniden hesaplar (layoutDrum), yükseklik değişimi güvenli. */
@media (min-width: 1440px) {
  .cube__stage { perspective: 2000px; }
  .cube__split { width: min(92rem, 92vw); }
  .cube__drum { height: clamp(23rem, 44vh, 30rem); }
  .cube__drum--img { max-width: 30rem; }
  .cube__face h3 { font-size: clamp(2.4rem, 1.4rem + 2.2vw, 3.8rem); }
  .cube__face p { max-width: 38rem; font-size: clamp(.95rem, .85rem + .3vw, 1.1rem); }
  .cube__face-no { font-size: clamp(3rem, 4.5vw, 5.5rem); }
  .cube__counter { font-size: 2rem; }
  .cube__counter em { font-size: 1.2rem; }
}

/* Footer monogramı — büronun kendi işaretinin vektörel hâli (.cdr'dan izlendi).
   JS varsa scroll ile kendini çizer; JS yoksa tam kontur olarak durur. */
.footer__mono {
  position: absolute;
  right: var(--pad); bottom: clamp(2rem, 6vh, 4rem);
  width: clamp(5rem, 9vw, 8rem);
  height: auto;
  fill: none;
  stroke: var(--gold);
  stroke-width: 4;
  opacity: .32;
  pointer-events: none;
}
@media (max-width: 900px) { .footer__mono { display: none; } }

/* Geniş ekran — sitenin hiçbir kuralı 1400px üstüne uyum sağlamıyordu;
   metin blokları bandın ortasında küçük kalıyordu. Ölçüler cömertleşir. */
@media (min-width: 1440px) {
  .hero__inner { max-width: 68rem; }
  .hero__slogan, .hero__tagline { max-width: 40rem; }
  .page-hero__inner { max-width: 54rem; }
  .page-hero__lead { max-width: 40rem; }
  .team { max-width: 70rem; }
  .member__photo { max-width: 25rem; }
  .areas__intro { max-width: 46rem; }
  .area__panel p { max-width: 48rem; }
}

/* ═══════════════ 04 · EKİP ═══════════════ */

.team {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: clamp(1.5rem, 4vw, 4rem);
  align-items: center;
  max-width: 62rem;
  margin: 0 auto;
}
.team__amp {
  font-family: var(--serif); font-style: italic;
  font-size: clamp(3.5rem, 8vw, 7rem);
  color: transparent;
  -webkit-text-stroke: 1px var(--gold);
  line-height: 1;
}
.member { text-align: center; }
.member__mono {
  width: clamp(7rem, 14vw, 10rem);
  height: clamp(7rem, 14vw, 10rem);
  margin: 0 auto 1.75rem;
  border: 1px solid var(--line);
  border-radius: 50%;
  display: grid; place-items: center;
  font-family: var(--serif);
  font-size: clamp(1.8rem, 3.5vw, 2.6rem);
  letter-spacing: .1em;
  color: var(--gold);
  background:
    radial-gradient(65% 65% at 50% 35%, rgba(194, 172, 121, .1), transparent 70%),
    var(--ink-3);
  transition: border-color .4s, transform .4s;
}
.member:hover .member__mono { border-color: var(--gold); transform: scale(1.03); }

/* Portre + "i" bilgi rozeti */
.member__photo {
  position: relative;
  margin: 0 auto 1.6rem;
  max-width: 22rem;
  border: 1px solid var(--line-2);
  overflow: hidden;
}
/* Alt degrade — portrenin alt kenarı bölüm zeminine karışsın, kutu hissi kırılsın.
   z-index 1: fotoğrafın üstünde ama "i" rozetinin (z-index 2) altında kalır. */
.member__photo::after {
  content: ""; position: absolute; inset: 0; z-index: 1;
  pointer-events: none;
  background: linear-gradient(to top, rgba(var(--veil), .85) 0%, rgba(var(--veil), .35) 18%, transparent 42%);
}
/* Portreler açık adaçayı fonda çekildi; iki duvarın tonu birbirinden de farklı.
   Ölçüm: Zehra #95A28F (parlaklık 151) · Elif #738F74 (125).
   --tone ikisini ~100'e indirip eşitler, portreler sayfanın koyu paletine oturur. */
.member__photo img {
  display: block; width: 100%; height: auto;
  --tone: .66;
  filter: saturate(.78) contrast(1.05) brightness(var(--tone));
  transition: transform .6s cubic-bezier(.25, .8, .25, 1), filter .5s;
}
.member:nth-of-type(2) .member__photo img { --tone: .80; }
.member:hover .member__photo img {
  transform: scale(1.03);
  filter: saturate(.9) contrast(1.06) brightness(calc(var(--tone) + .07));
}

.member__info { position: absolute; right: 0; bottom: 0; z-index: 2; }   /* degradenin üstünde */
.member__info summary {
  list-style: none; cursor: pointer;
  width: 2.75rem; height: 2.75rem;          /* 44px dokunma hedefi */
  display: grid; place-items: center;
  font-family: var(--serif); font-style: italic;
  font-size: 1.15rem; color: var(--ink);
  background: var(--gold);
  transition: background .3s, color .3s;
}
.member__info summary::-webkit-details-marker { display: none; }
.member__info summary:hover { background: var(--gold-2); }
.member__info[open] summary { background: var(--cream); }
.member__facts {
  position: absolute; right: 0; bottom: 2.75rem;
  width: min(20rem, 78vw);
  text-align: left;
  padding: 1.25rem 1.4rem;
  background: rgba(var(--veil), .95);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  border: 1px solid var(--line);
}
.member__facts h4 {
  font-size: .66rem; letter-spacing: .26em; text-transform: uppercase;
  color: var(--gold); font-weight: 500;
  margin-bottom: .35rem;
}
.member__facts h4 + ul { margin-bottom: 1rem; }
.member__facts ul:last-child { margin-bottom: 0; }
.member__facts li {
  list-style: none;
  font-size: .85rem; color: var(--cream);
  line-height: 1.55;
}

.member__name {
  font-family: var(--serif); font-weight: 500;
  font-size: clamp(1.4rem, 1.1rem + 1vw, 1.9rem);
  margin-bottom: .4rem;
}
.member__role {
  font-size: .74rem; letter-spacing: .3em;
  text-transform: uppercase; color: var(--gold);
}
.member__links {
  margin-top: .9rem;
  display: flex; align-items: center; justify-content: center; gap: .9rem;
  font-size: .82rem;
}
.member__links a { color: var(--muted); transition: color .3s; }
.member__links a:hover { color: var(--gold-2); }
.member__in {
  display: grid; place-items: center;
  width: 1.9rem; height: 1.9rem;
  border: 1px solid var(--line);
}
.member__in:hover { border-color: var(--gold); }

/* ═══════════════ 05 · İLETİŞİM ═══════════════ */

.section--contact {
  position: relative;
  overflow: hidden;
  min-height: 88vh;
  display: flex; flex-direction: column; justify-content: center;
  background:
    radial-gradient(90% 70% at 50% 110%, #163524 0%, transparent 60%),
    var(--ink);
}
.contact__bg {
  position: absolute; inset: 0; z-index: 0; margin: 0;
}
.contact__bg img {
  width: 100%; height: 100%;
  /* Bölüm kutusu görselden çok daha dik (≈1.16 vs 16:9), cover genişliğin
     ~%65'ini gösteriyor. Görsel simetrik bir pencere kadrajı olduğu için
     ortadan kırpılır — sağa yaslamak cam kanatlarını kesiyordu. */
  object-fit: cover; object-position: center;
  display: block;
}
.contact__veil {
  position: absolute; inset: 0; z-index: 1;
  background:
    linear-gradient(to right,
      rgba(var(--veil), .94) 0%,
      rgba(var(--veil), .8) 52%,
      rgba(var(--veil), .3) 100%),
    linear-gradient(to bottom, rgba(var(--veil), .6), transparent 28%);
}
.section--contact .section__head,
.section--contact .contact__display,
.section--contact .contact__layout {
  position: relative; z-index: 2;
}

/* Sinematik yavaş yakınlaşma — hareket tercihi kapalıysa çalışmaz */
@media (prefers-reduced-motion: no-preference) {
  .contact__bg img {
    animation: kenburns 34s ease-in-out infinite alternate;
    will-change: transform;
  }
}
@keyframes kenburns {
  from { transform: scale(1.05); }
  to   { transform: scale(1.13) translate(-1.5%, -1%); }
}

.contact__display {
  font-family: var(--serif); font-weight: 400;
  font-size: clamp(3.5rem, 10vw, 9rem);
  line-height: 1;
  margin-bottom: clamp(3rem, 7vh, 5.5rem);
}
.contact__display em { color: var(--gold); font-style: normal; }

.contact__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(2rem, 5vw, 5rem);
  max-width: 56rem;
}
.contact__block h3 {
  font-size: .72rem; font-weight: 500;
  letter-spacing: .3em; text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 1.1rem;
}
.contact__block .contact__sub { margin-top: 2.2rem; }
.contact__block p { color: var(--cream); line-height: 1.9; margin-bottom: 1rem; }

.contact__tel {
  font-family: var(--serif);
  font-size: clamp(1.5rem, 1.1rem + 1.6vw, 2.3rem);
  transition: color .3s;
}
.contact__tel:hover { color: var(--gold-2); }

.link-arrow {
  display: inline-flex; align-items: center; gap: .6rem;
  font-size: .8rem; letter-spacing: .14em; text-transform: uppercase;
  color: var(--gold);
  border-bottom: 1px solid var(--line);
  padding: .6rem 0 .5rem;   /* dokunma alanını büyüt */
  transition: color .3s, border-color .3s, gap .3s;
}
.link-arrow::after { content: "→"; transition: transform .3s; }
.link-arrow:hover { color: var(--gold-2); border-color: var(--gold); }
.link-arrow:hover::after { transform: translateX(4px); }

/* İletişim düzeni — bilgi bloğu + form yan yana */
.contact__layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr);
  gap: clamp(2.5rem, 6vw, 5rem);
  align-items: start;
}
.contact__grid { max-width: none; }

/* Stilize harita kartı — gömülü harita yok, dışarıya istek gitmez */
.contact__map {
  display: block; margin-top: 1.4rem;
  border: 1px solid var(--line-2);
  overflow: hidden;
  transition: border-color .4s;
}
.contact__map img {
  display: block; width: 100%; height: auto;
  aspect-ratio: 3 / 2; object-fit: cover;
  opacity: .8; transition: opacity .4s, transform .6s;
}
.contact__map:hover { border-color: var(--gold); }
.contact__map:hover img { opacity: 1; transform: scale(1.02); }
.contact__map .link-arrow { padding: .7rem 1rem; border-bottom: 0; }

/* ─── İletişim formu ─── */
.cform {
  padding: clamp(1.6rem, 3vw, 2.4rem);
  background: rgba(var(--veil), .72);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  border: 1px solid var(--line);
  display: grid; gap: 1.1rem;
}
.cform__title {
  font-family: var(--serif); font-weight: 400;
  font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem);
}
.cform__row { display: grid; grid-template-columns: 1fr 1fr; gap: 1.1rem; }
.cform__field { display: grid; gap: .45rem; }
.cform__field > span {
  font-size: .68rem; letter-spacing: .22em; text-transform: uppercase;
  color: var(--gold);
}
.cform__field > span em { text-transform: none; letter-spacing: .04em; color: var(--muted); }
.cform input, .cform select, .cform textarea {
  font-family: var(--sans); font-size: .92rem; font-weight: 300;
  color: var(--cream);
  background: rgba(var(--veil), .55);
  border: 1px solid var(--line-2);
  padding: .85rem .9rem;
  min-height: 2.75rem;                 /* 44px dokunma hedefi */
  transition: border-color .3s, background .3s;
  -webkit-user-select: text; user-select: text;   /* kopya korumasından muaf */
}
.cform textarea { resize: vertical; line-height: 1.6; }
.cform select { appearance: none; cursor: pointer; }
.cform input:focus, .cform select:focus, .cform textarea:focus {
  border-color: var(--gold); background: rgba(var(--veil), .8); outline: none;
}
/* Fare tıklamasında yalnız kenarlık değişir; klavyeyle gelindiğinde sitenin
   geri kalanıyla aynı altın halka çıkar (global :focus-visible kuralıyla aynı). */
.cform input:focus-visible, .cform select:focus-visible, .cform textarea:focus-visible {
  outline: 2px solid var(--gold); outline-offset: 3px;
}
.cform__check {
  display: flex; align-items: flex-start; gap: .7rem;
  font-size: .85rem; color: var(--muted); line-height: 1.6;
  cursor: pointer;
}
.cform__check input {
  width: 1.15rem; height: 1.15rem; min-height: 0;
  margin-top: .2rem; padding: 0; flex-shrink: 0;
  accent-color: var(--gold);
}
.cform__check a { color: var(--gold); border-bottom: 1px solid var(--line); }
.cform button { justify-self: start; cursor: pointer; }
.cform__note {
  font-size: .74rem; color: var(--muted); line-height: 1.65;
  border-top: 1px solid var(--line-2); padding-top: 1rem;
}
.cform__note a { color: var(--gold); }

/* ═══════════════ FOOTER ═══════════════ */

.footer {
  position: relative;              /* monogram buna göre konumlanır */
  border-top: 1px solid var(--line-2);
  padding: 3.5rem var(--pad) 2.5rem;
  display: grid; gap: 2rem;
}
.footer__brand { display: flex; align-items: baseline; gap: .9rem; flex-wrap: wrap; }
.footer__logo {
  font-family: var(--serif); font-weight: 600; font-size: 1.3rem;
}
.footer__logo em { color: var(--gold); font-weight: 400; }
.footer__word {
  font-size: .68rem; letter-spacing: .3em;
  text-transform: uppercase; color: var(--muted);
}
.footer__legal {
  color: var(--muted); font-size: .8rem;
  max-width: 52rem; line-height: 1.8;
}
/* Yasal metinler — alt alta */
.footer__links {
  display: flex; flex-direction: column; align-items: flex-start; gap: .1rem;
}
.footer__links a {
  font-size: .78rem; letter-spacing: .06em; color: var(--gold);
  padding: .45rem 0; display: inline-block;
  border-bottom: 1px solid transparent;
  transition: color .3s, border-color .3s;
}
.footer__links a:hover { color: var(--gold-2); border-bottom-color: var(--line); }
.footer__meta {
  display: flex; justify-content: space-between; align-items: center;
  gap: 1rem; flex-wrap: wrap;
  font-size: .74rem; color: var(--muted);
  border-top: 1px solid var(--line-2);
  padding-top: 1.75rem;
}
.footer__meta a {
  color: var(--gold); letter-spacing: .06em;
  padding: .6rem 0; display: inline-block;   /* dokunma alanı */
}
.footer__meta a:hover { color: var(--gold-2); }
.mmenu__tel { padding: .6rem 0; display: inline-block; }

/* ═══════════════ YAZDIRMA ═══════════════ */

@media print {
  .nav, .mmenu, .hero__bg, .hero__veil, .contact__bg, .contact__veil,
  .cube, .hero__scroll, .cube__hint, body::after,
  .page-hero__bg, .page-hero__veil, .cform, .contact__map,
  .apply__check, .board, .pubtabs, .skip-link,
  .readline, .pageveil, .principles__progress { display: none !important; }
  body { background: #fff; color: #000; }
  .section, .hero, .page-hero { min-height: 0; padding: 1.5rem 0; }
  a { color: #000; }
  /* Yazdırırken tüm alan açıklamaları görünsün */
  .area__panel { max-height: none !important; }
  .area__plus { display: none; }
  .member__info { display: none; }
  .legal-page, .article-page { max-width: none; padding: 0; }
  .footer__meta a[href]::after { content: " (" attr(href) ")"; font-size: .8em; }
  /* Metin seçimi/kopya sınırlaması yazdırmayı etkilemesin */
  body { -webkit-user-select: auto; user-select: auto; }
}

/* ═══════════════ KVKK SAYFASI ═══════════════ */

.legal-page {
  max-width: 46rem;
  margin: 0 auto;
  padding: calc(var(--nav-h) + 4rem) var(--pad) 6rem;
}
.legal-page h1 {
  font-family: var(--serif); font-weight: 500;
  font-size: clamp(2rem, 5vw, 3.2rem);
  line-height: 1.2;
  margin-bottom: 2.5rem;
}
.legal-page h2 {
  font-family: var(--serif); font-weight: 500;
  font-size: 1.4rem;
  margin: 2.5rem 0 1rem;
  color: var(--gold-2);
}
.legal-page p, .legal-page li { color: var(--muted); margin-bottom: 1rem; }
.legal-page ul { padding-left: 1.25rem; }
.legal-page .back {
  display: inline-block; margin-bottom: 3rem;
  color: var(--gold); font-size: .8rem; letter-spacing: .14em;
  text-transform: uppercase;
}
.legal-page a:not(.back) { color: var(--gold); border-bottom: 1px solid var(--line); }
.legal-eyebrow {
  font-size: .7rem; letter-spacing: .34em; text-transform: uppercase;
  color: var(--gold) !important; margin-bottom: .8rem !important;
}
.legal-dl { margin: 1.5rem 0 2rem; }
.legal-dl dt {
  font-size: .68rem; letter-spacing: .26em; text-transform: uppercase;
  color: var(--gold); margin-top: 1.2rem;
}
.legal-dl dd { color: var(--cream); margin: .35rem 0 0; line-height: 1.75; }
.legal-note {
  border-left: 2px solid var(--line);
  padding: .2rem 0 .2rem 1.1rem;
  font-size: .88rem;
}
.legal-updated {
  margin-top: 3rem !important; padding-top: 1.25rem;
  border-top: 1px solid var(--line-2);
  font-size: .78rem; letter-spacing: .1em;
}

/* ─── Makale sayfası ─── */
.article-page { max-width: 44rem; }
.article-page p { color: var(--cream); font-size: 1.02rem; line-height: 1.95; margin-bottom: 1.5rem; }
.article-page h2 {
  font-size: clamp(1.3rem, 1.1rem + .8vw, 1.75rem);
  margin: 3rem 0 1.1rem;
}
.article-byline {
  font-size: .74rem !important; letter-spacing: .22em; text-transform: uppercase;
  color: var(--muted) !important;
  margin: -1.5rem 0 3rem !important;
  padding-bottom: 1.5rem; border-bottom: 1px solid var(--line-2);
}
/* Makale kapak şeridi — başlığın üstünde; dosya yoksa picture kendini kaldırır */
.article-cover {
  display: block; margin: 0 0 clamp(1.6rem, 4vh, 2.4rem);
  border: 1px solid var(--line-2); overflow: hidden;
}
.article-cover img {
  display: block; width: 100%; height: auto;   /* height="" niteliği aspect-ratio'yu iptal etmesin */
  aspect-ratio: 21 / 9; object-fit: cover;
  filter: saturate(.88) contrast(1.02);
}
@media (max-width: 600px) { .article-cover img { aspect-ratio: 3 / 2; } }
.article-disclaimer {
  margin-top: 3rem !important;
  padding-top: 1.5rem; border-top: 1px solid var(--line-2);
  font-size: .8rem !important; color: var(--muted) !important;
}
.article-next { margin-top: 2.5rem; }
.article-next a {
  font-size: .82rem; color: var(--gold);
  border-bottom: 1px solid var(--line) !important;
  padding-bottom: .3rem;
}

/* ═══════════════ ALT SAYFA HERO ═══════════════ */

.page-hero {
  position: relative;
  min-height: 72vh;
  display: flex; align-items: flex-end;
  padding: calc(var(--nav-h) + 5rem) var(--pad) clamp(3rem, 8vh, 6rem);
  overflow: hidden;
  background:
    radial-gradient(120% 90% at 70% 10%, #163524 0%, transparent 55%),
    var(--ink);
}
.page-hero--compact { min-height: 58vh; }
.page-hero__bg { position: absolute; inset: -4% 0; z-index: 0; margin: 0; }
.page-hero__bg img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (prefers-reduced-motion: no-preference) {
  .page-hero__bg img { animation: kenburns 38s ease-in-out infinite alternate; will-change: transform; }
}
.page-hero__veil {
  position: absolute; inset: 0; z-index: 1;
  background:
    linear-gradient(to right, rgba(var(--veil), .93) 0%, rgba(var(--veil), .68) 55%, rgba(var(--veil), .35) 100%),
    linear-gradient(to top, rgba(var(--veil), .9), transparent 45%);
}
.page-hero__inner { position: relative; z-index: 2; max-width: 46rem; }
.page-hero__eyebrow {
  display: flex; align-items: center; gap: 1rem;
  font-size: .72rem; letter-spacing: .34em; text-transform: uppercase;
  color: var(--gold); margin-bottom: 1.5rem;
}
.page-hero__title {
  font-family: var(--serif); font-weight: 300;
  font-size: clamp(2.6rem, 1.5rem + 5vw, 5.5rem);
  line-height: 1.02;
}
.page-hero__title em { color: var(--gold); font-style: normal; }
.page-hero__lead {
  margin-top: 1.6rem; max-width: 34rem;
  color: var(--muted); line-height: 1.85;
}

/* Yayın serisi sekmeleri */
.pubtabs { display: flex; gap: .75rem; margin-top: 2.2rem; flex-wrap: wrap; }
.pubtabs__tab {
  font-size: .76rem; letter-spacing: .16em; text-transform: uppercase;
  color: var(--muted);
  border: 1px solid var(--line);
  padding: .8rem 1.5rem;
  transition: color .3s, border-color .3s, background .3s;
}
.pubtabs__tab:hover { color: var(--ink); background: var(--gold); border-color: var(--gold); }

/* ═══════════════ YAYINLAR ═══════════════ */

.pub__intro {
  color: var(--muted); max-width: 40rem;
  margin-bottom: clamp(2rem, 4vh, 3rem);
}
.pub-list { list-style: none; }
.pub { border-top: 1px solid var(--line-2); }
.pub:last-child { border-bottom: 1px solid var(--line-2); }
.pub__link {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: clamp(1rem, 3vw, 2.5rem);
  align-items: start;
  padding: clamp(1.75rem, 4vh, 2.5rem) 0;
  transition: padding-left .4s cubic-bezier(.25, .8, .25, 1);
}
.pub__link:hover { padding-left: clamp(.5rem, 2vw, 1.5rem); }
.pub__no {
  font-family: var(--serif); font-style: italic;
  color: var(--gold); font-size: 1rem; min-width: 2.2rem;
}
.pub__body { display: block; }
.pub__title {
  display: block;
  font-family: var(--serif); font-weight: 400;
  font-size: clamp(1.35rem, 1.05rem + 1.2vw, 2.1rem);
  line-height: 1.2;
  transition: color .35s;
}
.pub__link:hover .pub__title { color: var(--gold-2); }
.pub__excerpt {
  display: block; margin-top: .7rem;
  color: var(--muted); max-width: 44rem; line-height: 1.8;
}
.pub__meta {
  display: block; margin-top: .9rem;
  font-size: .7rem; letter-spacing: .22em; text-transform: uppercase;
  color: var(--gold);
}
.pub__go {
  color: var(--gold); font-size: 1.2rem; transition: transform .3s;
  grid-column: -2 / -1;         /* kapak olsa da olmasa da hep son sütun */
}
.pub__link:hover .pub__go { transform: translateX(5px); }

/* Makale kapağı — yalnız geniş ekranda; dosya yoksa picture kendini kaldırır */
.pub__cover { display: none; }
@media (min-width: 900px) {
  .pub__link { grid-template-columns: auto auto 1fr auto; }
  .pub__cover {
    display: block; align-self: start;
    width: clamp(9rem, 14vw, 12.5rem);
    border: 1px solid var(--line-2);
    overflow: hidden;
    transition: border-color .4s;
  }
  .pub__cover img {
    display: block; width: 100%; height: auto;   /* height="" niteliği aspect-ratio'yu iptal etmesin */
    aspect-ratio: 3 / 2; object-fit: cover;
    filter: saturate(.88) contrast(1.02);
    transition: transform .6s cubic-bezier(.25, .8, .25, 1);
  }
  .pub__link:hover .pub__cover { border-color: var(--gold); }
  .pub__link:hover .pub__cover img { transform: scale(1.04); }
}

/* A&K Brief kartları */
.briefs {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
  gap: clamp(1.25rem, 3vw, 2rem);
}
.brief { border: 1px solid var(--line-2); padding: 1.25rem; }
.brief__cover {
  aspect-ratio: 1 / 1;
  display: grid; place-content: center; gap: .2rem;
  text-align: center;
  margin-bottom: 1.25rem;
  background:
    radial-gradient(80% 80% at 30% 20%, rgba(194, 172, 121, .12), transparent 60%),
    linear-gradient(160deg, var(--ink-3), var(--ink));
}
.brief__cover span {
  font-family: var(--serif); font-size: 2.2rem; color: var(--gold);
  letter-spacing: .04em;
}
.brief__cover em {
  font-size: .66rem; letter-spacing: .34em; text-transform: uppercase;
  color: var(--muted); font-style: normal;
}
.brief__title { font-family: var(--serif); font-weight: 400; font-size: 1.25rem; margin-bottom: .4rem; }
.brief__text { color: var(--muted); font-size: .88rem; }

/* ═══════════════ KARİYER ═══════════════ */

.apply { max-width: 52rem; }
.apply__notice {
  color: var(--muted); line-height: 1.85;
  border-left: 2px solid var(--line);
  padding-left: 1.2rem;
  margin-bottom: 1.5rem;
}
.apply__notice a { color: var(--gold); border-bottom: 1px solid var(--line); }
.apply__check {
  display: flex; align-items: flex-start; gap: .75rem;
  font-size: .92rem; color: var(--cream);
  cursor: pointer; margin-bottom: 2.25rem;
  padding: .6rem 0;
}
.apply__check input {
  width: 1.15rem; height: 1.15rem; margin-top: .3rem;
  flex-shrink: 0; accent-color: var(--gold);
}
.apply__row { display: grid; gap: 1rem; }
.apply__btn {
  display: grid; grid-template-columns: auto 1fr auto;
  align-items: center; gap: clamp(1rem, 3vw, 2rem);
  border: 1px solid var(--line);
  padding: clamp(1.1rem, 2.5vh, 1.6rem) clamp(1.25rem, 3vw, 2rem);
  transition: background .35s, border-color .35s, opacity .3s;
}
.apply__btn:hover { border-color: var(--gold); background: var(--ink-3); }
.apply__btn-no {
  font-family: var(--serif); font-style: italic;
  color: var(--gold); font-size: .95rem;
}
.apply__btn-name {
  font-family: var(--serif);
  font-size: clamp(1.25rem, 1rem + 1vw, 1.75rem);
}
.apply__btn-go { color: var(--gold); transition: transform .3s; }
.apply__btn:hover .apply__btn-go { transform: translateX(5px); }
/* Onay kutusu işaretlenmeden başvuru butonları edilgen görünür.
   aria-disabled'ı JS koyar; JS yoksa butonlar normal görünür ve çalışır. */
.apply__btn[aria-disabled="true"] { opacity: .42; cursor: not-allowed; }
.apply__btn[aria-disabled="true"]:hover { border-color: var(--line); background: none; }
.apply__note {
  margin-top: 1.5rem;
  font-size: .78rem; color: var(--muted); line-height: 1.7;
}
.apply__note a { color: var(--gold); }

/* İlham duvarı */
.board__intro {
  font-family: var(--serif);
  font-size: clamp(1.1rem, 1rem + .6vw, 1.45rem);
  color: var(--cream);
  margin-bottom: clamp(2rem, 4vh, 3rem);
}
.board {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
  gap: clamp(1.25rem, 3vw, 2.25rem);
  padding: clamp(1.5rem, 4vw, 3rem);
  /* Pano dokusu en altta; üstündeki koyu örtü kontrastı düşürüp metni okunur tutar.
     Doku dosyası yoksa url katmanı sessizce düşer, var(--ink) zemin kalır. */
  background:
    radial-gradient(120% 90% at 20% 0%, rgba(194, 172, 121, .06), transparent 60%),
    linear-gradient(rgba(var(--veil), .80), rgba(var(--veil), .80)),
    url("../assets/img/board-texture.jpg") center / cover no-repeat,
    var(--ink);
  border: 1px solid var(--line-2);
}
.board__note {
  position: relative;
  padding: 2.2rem 1.4rem 1.4rem;
  background: rgba(241, 237, 223, .045);
  border: 1px solid var(--line-2);
  transition: transform .45s cubic-bezier(.25, .8, .25, 1), background .45s;
}
.board__note:nth-child(odd)  { transform: rotate(-1.1deg); }
.board__note:nth-child(even) { transform: rotate(1deg); }
.board__note:nth-child(3n)   { transform: rotate(.4deg); }
.board__note:hover { transform: rotate(0deg) translateY(-4px); background: rgba(241, 237, 223, .07); }
/* Raptiye */
.board__note::before {
  content: "";
  position: absolute; top: .85rem; left: 50%;
  width: .5rem; height: .5rem; margin-left: -.25rem;
  border-radius: 50%;
  background: var(--gold);
  box-shadow: 0 1px 4px rgba(0, 0, 0, .5);
}
.board__note p {
  font-family: var(--serif); font-style: italic;
  font-size: clamp(1rem, .95rem + .35vw, 1.2rem);
  line-height: 1.6;
  color: var(--cream);
  margin-bottom: .9rem;
}
.board__note cite {
  font-style: normal;
  font-size: .68rem; letter-spacing: .22em; text-transform: uppercase;
  color: var(--gold);
}

/* ═══════════════ 404 ═══════════════ */

.notfound {
  min-height: 100vh;
  min-height: 100svh;
  display: flex; flex-direction: column;
  justify-content: center; align-items: flex-start;
  padding: calc(var(--nav-h) + 2rem) var(--pad) 4rem;
  background:
    radial-gradient(120% 90% at 70% 10%, #163524 0%, transparent 55%),
    var(--ink);
}
.notfound__code {
  font-family: var(--serif);
  font-size: clamp(6rem, 18vw, 13rem);
  line-height: 1;
  color: var(--cream);
}
.notfound__code em { color: transparent; -webkit-text-stroke: 1px var(--gold); font-style: normal; }
.notfound__title {
  font-family: var(--serif); font-weight: 400;
  font-size: clamp(1.5rem, 1.1rem + 1.8vw, 2.6rem);
  margin-top: 1.5rem;
}
.notfound__title em { color: var(--gold); font-style: normal; }
.notfound__text { margin-top: 1rem; color: var(--muted); max-width: 30rem; }
.notfound__cta { margin-top: 2.5rem; display: flex; gap: 1rem; flex-wrap: wrap; }

/* ═══════════════ MİKRO DOKUNUŞLAR (JS ekler) ═══════════════ */

/* Sayfanın üstünde okuma ilerlemesi — incecik altın çizgi */
.readline {
  position: fixed; top: 0; left: 0; right: 0;
  height: 2px; z-index: 200;
  background: linear-gradient(90deg, var(--gold), var(--gold-2));
  transform-origin: left;
  transform: scaleX(0);
  pointer-events: none;
}

/* Sayfalar arası geçiş perdesi */
.pageveil {
  position: fixed; inset: 0; z-index: 9999;
  background: var(--ink);
  opacity: 0; visibility: hidden;
  pointer-events: none;
  transition: opacity .3s ease, visibility 0s .3s;
}
.pageveil.is-in {
  opacity: 1; visibility: visible;
  transition: opacity .3s ease, visibility 0s 0s;
}

/* ═══════════════ REVEAL (JS ile) ═══════════════ */

html.has-js [data-reveal] { opacity: 0; }
html.has-js [data-hero] { opacity: 0; }

/* ═══════════════ RESPONSIVE ═══════════════ */

/* 7 menü öğesi + telefon + dil → burger eşiği 1100px */
@media (max-width: 1100px) {
  .nav__links, .nav__tel, .nav__lang { display: none; }
  /* KVKK gibi menüsüz sayfalarda telefon her zaman görünür */
  .nav__tel--always { display: inline-block; font-size: .72rem; padding: .5rem .8rem; }
  .nav__burger { display: flex; }
  /* Ses anahtarı burger eşiğinde de kalır; negatif boşluk burger'ın işi */
  .nav__sound { margin-right: 0; }
}

@media (max-width: 1100px) {
  .contact__layout { grid-template-columns: 1fr; }
}

@media (max-width: 900px) {
  .principles-split { grid-template-columns: 1fr; }
  .principles-img { aspect-ratio: 4 / 5; max-height: 62vh; }
  .contact__bg img { object-position: center; }   /* dar ekranda da pencere kadrajı ortada kalsın */

  .team { grid-template-columns: 1fr; }
  .team__amp { text-align: center; }

  .contact__grid { grid-template-columns: 1fr; }
  .cform__row { grid-template-columns: 1fr; }

  .hero__amp { right: -18%; }
  .hero__foot { flex-direction: column; align-items: flex-start; gap: 1.2rem; }
  .hero__scroll { display: none; }

  .area__panel p { padding-left: 0; }
}

/* ═══════════════ REDUCED MOTION ═══════════════ */

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
  html.has-js [data-reveal], html.has-js [data-hero] { opacity: 1; }
  /* Ekolayzer durur; açık/kapalı ayrımını altın rengi taşır */
  .nav__sound i { height: 6px !important; }
  .nav__sound i:nth-child(2) { height: 11px !important; }
}
