/* ==========================================================================
   Aydemir Hukuk Bürosu — ana stil dosyası
   Renkler, yazı tipleri ve ölçüler aşağıdaki değişkenlerden yönetilir.
   ========================================================================== */

:root {
  --bronze: #8c7156;
  --bronze-light: #b39a7e;
  --bronze-dark: #6e5741;
  --ink: #191919;
  --ink-2: #232323;
  --text: #4a4a4a;
  --muted: #868686;
  --line: #e6e3de;
  --glass-bg: rgba(255, 255, 255, .6);           /* menü çubuğu ve açılır panel: aynı buzlu cam */
  --glass-blur: blur(16px) saturate(1.4);
  --field: #f0efed;
  --paper: #f6f5f1;
  --white: #ffffff;

  --font-head: "Bellefair", "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --font-body: "Lato", "Segoe UI", Arial, Helvetica, sans-serif;

  --container: 1200px;
  --gutter: max(20px, calc((100vw - var(--container)) / 2));
  --header-h: 92px;
  --ease: cubic-bezier(.22, .61, .36, 1);
}

/* ---------- Temel ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 100px; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--font-body);
  font-size: 15px;
  line-height: 1.8;
  color: var(--text);
  background: var(--white);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; transition: color .25s var(--ease), background-color .25s var(--ease), border-color .25s var(--ease); }
ul { list-style: none; margin: 0; padding: 0; }
h1, h2, h3, p { margin: 0; }
button { font: inherit; cursor: pointer; }
:focus-visible { outline: 2px solid var(--bronze); outline-offset: 3px; }

.container { width: 100%; max-width: calc(var(--container) + 40px); margin: 0 auto; padding: 0 20px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.skip-link { position: absolute; left: 16px; top: -60px; z-index: 200; background: var(--bronze); color: #fff; padding: 10px 18px; }
.skip-link:focus { top: 16px; }

.ico { width: 24px; height: 24px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }

/* ---------- Tipografi ---------- */
.kicker {
  font-family: var(--font-head);
  font-size: 17px;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--bronze);
  margin-bottom: 14px;
}
.h2 {
  font-family: var(--font-head);
  font-weight: 400;
  font-size: clamp(30px, 3.2vw, 42px);
  line-height: 1.14;
  text-transform: uppercase;
  color: var(--ink);
  margin-bottom: 26px;
}
.h2--md { font-size: clamp(26px, 2.6vw, 34px); line-height: 1.24; }
.h3 {
  font-family: var(--font-head);
  font-weight: 400;
  font-size: clamp(26px, 2.4vw, 32px);
  line-height: 1.15;
  text-transform: uppercase;
  color: var(--ink);
}

/* "— DETAYLI BİLGİ" tarzı bağlantı */
.link-line {
  display: inline-flex;
  align-items: center;
  gap: 18px;
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--bronze);
  line-height: 1;
  padding: 6px 0;
}
.link-line::before { content: ""; width: 44px; height: 1px; background: currentColor; transition: width .35s var(--ease); }
.link-line:hover::before { width: 64px; }
.link-line:hover { color: var(--bronze-dark); }
.link-line--light { color: #fff; }
.link-line--light::before { background: var(--bronze-light); }
.link-line--light:hover { color: var(--bronze-light); }
.link-line--both::after { content: ""; width: 44px; height: 1px; background: var(--bronze-light); transition: width .35s var(--ease); }
.link-line--both:hover::after { width: 64px; }

.btn {
  display: inline-flex; align-items: center; justify-content: center;
  border: 0; background: var(--bronze); color: #fff;
  padding: 17px 36px;
  font-size: 12px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase;
  transition: background-color .25s var(--ease);
}
.btn:hover { background: var(--ink); }
.btn-outline {
  display: inline-flex; align-items: center;
  border: 1px solid currentColor;
  padding: 11px 22px;
  font-size: 11px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase;
  line-height: 1;
}
.btn-outline:hover { background: var(--bronze); border-color: var(--bronze); color: #fff; }

/* Bronz ikon karesi (yanındaki yazı uzun olsa da daralmaz: flex: none) */
.icon-square {
  display: inline-flex; align-items: center; justify-content: center; flex: none;
  width: 84px; height: 84px;
  background: var(--bronze); color: #fff;
}
.icon-square .ico { width: 42px; height: 42px; stroke-width: 1.1; }
.icon-square--sm { width: 46px; height: 46px; }
.icon-square--sm .ico { width: 24px; height: 24px; stroke-width: 1.3; }
.icon-square--xs { width: 52px; height: 52px; }
.icon-square--xs .ico { width: 22px; height: 22px; }

/* Slayt çizgileri */
.dashes { display: flex; gap: 10px; }
.dashes button {
  position: relative;
  width: 28px; height: 18px; padding: 0; border: 0; background: none;
}
.dashes button::before {
  content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 2px; margin-top: -1px;
  background: var(--bronze); opacity: .75; transition: background-color .3s, opacity .3s;
}
.dashes button.is-active::before { background: #fff; opacity: 1; }
.dashes--vertical { flex-direction: column; gap: 6px; }
.dashes--vertical button { width: 18px; height: 34px; }
.dashes--vertical button::before { top: 0; bottom: 0; left: 50%; right: auto; width: 2px; height: auto; margin: 0 0 0 -1px; background: #cfc7bd; }
.dashes--vertical button.is-active::before { background: var(--bronze); }

/* ==========================================================================
   Üst bilgi
   ========================================================================== */
.site-header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  color: #fff;
  transition: background-color .35s var(--ease), box-shadow .35s var(--ease), color .35s var(--ease);
}
.topbar { font-size: 12px; border-bottom: 1px solid rgba(255, 255, 255, .1); overflow: hidden; max-height: 44px; transition: max-height .35s var(--ease), opacity .3s; }
.topbar__inner { display: flex; justify-content: space-between; align-items: center; min-height: 42px; gap: 20px; }
.topbar__info { display: flex; gap: 28px; }
.topbar__info li, .topbar__social { display: flex; align-items: center; gap: 8px; color: rgba(255, 255, 255, .85); }
.topbar .ico { width: 15px; height: 15px; color: var(--bronze-light); }
.topbar a:hover { color: var(--bronze-light); }
.topbar__social a { display: inline-flex; padding: 4px; }
.topbar__social span { font-weight: 700; margin-right: 4px; }

.header__inner { display: flex; align-items: center; justify-content: space-between; height: var(--header-h); gap: 24px; transition: height .35s var(--ease); }

.brand { display: inline-flex; align-items: center; flex: none; }
/* Logotip (AY | DEMİR · HUKUK BÜROSU): sayfadaki ikon kümesinde #logo-aydemir sembolü. Rengi currentColor:
   fotoğraf üstünde beyaz, kaydırınca koyu. Yalnızca ad ve unvan, şekil yok (TBB Reklam Yasağı Yön. m.5–6). */
.brand__logotype {
  display: block; height: 46px; width: auto; aspect-ratio: 807.91 / 215.75;
  fill: currentColor; overflow: visible;
  transition: height .35s var(--ease);
  filter: drop-shadow(0 1px 6px rgba(0, 0, 0, .35));
}

.main-nav { display: flex; align-items: center; gap: 34px; align-self: stretch; }
.main-nav__list { display: flex; gap: 30px; height: 100%; }
.nav-item { display: flex; align-items: center; }
.main-nav .nav-link {
  position: relative; display: block; padding: 8px 0;
  font-size: 13px; font-weight: 400; letter-spacing: .02em;
}
.main-nav .nav-link::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px;
  background: var(--bronze); transform: scaleX(0); transform-origin: left; transition: transform .3s var(--ease);
}
/* Panel açma/kapama JS ile yönetilir (.is-hover, main.js): kapanma gecikmesi ve başlıklar arası geçiş niyeti.
   JS yoksa yedek olarak :hover kullanılır. */
.nav-item.is-hover > .nav-link::after, html:not(.js) .nav-item:hover > .nav-link::after, .nav-item:focus-within > .nav-link::after, .main-nav .nav-link.is-active::after { transform: scaleX(1); }
.nav-item:is(:hover, .is-hover) > .nav-link { color: var(--bronze-light); }
.sub-toggle { display: none; background: none; border: 0; padding: 0; color: inherit; }
.main-nav__contact { display: none; }

/* ---------- Açılır açıklama paneli (mega menü) ---------- */
.mega {
  position: absolute; left: 0; right: 0; top: 100%;
  background: var(--glass-bg);
  -webkit-backdrop-filter: var(--glass-blur);
          backdrop-filter: var(--glass-blur);
  /* üst kenarlık yok: panel menü çubuğuyla tek parça (yekpare) görünür */
  box-shadow: 0 26px 46px rgba(0, 0, 0, .14);
  color: var(--text);
  opacity: 0; visibility: hidden; transform: translateY(-8px); pointer-events: none;
  transition: opacity .25s var(--ease), transform .25s var(--ease), visibility 0s linear .25s, background-color 1.2s var(--ease);
}
.nav-item.is-hover > .mega, html:not(.js) .nav-item:hover > .mega, .nav-item:focus-within > .mega {
  opacity: 1; visibility: visible; transform: none; pointer-events: auto;
  transition: opacity .28s var(--ease) .06s, transform .28s var(--ease) .06s, visibility 0s, background-color 1.2s var(--ease);
}
.nav-item.is-suppressed > .mega { opacity: 0; visibility: hidden; pointer-events: none; }
.mega__inner {
  display: grid; grid-template-columns: auto 1px minmax(0, 1fr) 240px;
  column-gap: 48px; align-items: start;
  padding-top: 42px; padding-bottom: 46px;
}
.mega__inner--nolinks { grid-template-columns: minmax(0, 1fr) 240px; }
.mega__divider { align-self: stretch; width: 1px; background: var(--line); }
.mega__links { display: grid; gap: 14px; min-width: 210px; align-content: start; }
.mega__links--2col { grid-template-columns: repeat(2, auto); column-gap: 44px; row-gap: 12px; }
.mega__links a {
  display: inline-flex; align-items: center;
  font-family: var(--font-head); font-size: 19px; line-height: 1.25; color: var(--ink);
  transition: color .2s;
}
.mega__links a::before { content: ""; flex: none; width: 0; height: 1px; background: var(--bronze); transition: width .25s var(--ease), margin .25s var(--ease); }
.mega__links a:hover, .mega__links a:focus-visible { color: var(--bronze); }
.mega__links a:hover::before, .mega__links a:focus-visible::before { width: 18px; margin-right: 10px; }
.mega__links a span { display: block; }
.mega__links small { display: block; margin-top: 3px; font-family: var(--font-body); font-size: 10.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #5c5650; }
.mega__links--people { gap: 16px; }
.mega__info .kicker { font-size: 14px; margin-bottom: 6px; color: var(--bronze-dark); }
.mega__title { font-family: var(--font-head); font-weight: 400; font-size: 28px; line-height: 1.1; text-transform: uppercase; color: var(--ink); margin-bottom: 12px; }
.mega__desc { font-size: 14.5px; line-height: 1.75; color: #262626; max-width: 54ch; margin-bottom: 18px; }
.mega__illus { align-self: center; color: var(--bronze); }
.mega__illus svg { display: block; width: 100%; height: auto; }
@media (max-width: 1240px) {
  .mega__inner { grid-template-columns: auto 1px minmax(0, 1fr); }
  .mega__inner--nolinks { grid-template-columns: minmax(0, 1fr); }
  .mega__illus { display: none; }
}

.nav-toggle { display: none; background: none; border: 0; color: inherit; padding: 8px; margin-right: -8px; }
.nav-toggle .ico { width: 30px; height: 30px; stroke-width: 1.3; }
.nav-toggle .ico--close { display: none; }

/* Kaydırınca yarı saydam "buzlu cam" başlık. Zemin ayrı katmanda (::before): backdrop-filter
   başlığın kendisine verilirse içindeki açılır panelin bulanıklığı arkadaki sayfayı göremez. */
.site-header::before {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: rgba(255, 255, 255, 0);
  transition: background-color .35s var(--ease), opacity .25s var(--ease);
}
.site-header.is-scrolled { color: var(--ink); box-shadow: 0 1px 0 rgba(140, 113, 86, .18), 0 10px 30px rgba(0, 0, 0, .08); }
.site-header.is-scrolled::before {
  background: var(--glass-bg);
  -webkit-backdrop-filter: var(--glass-blur);
          backdrop-filter: var(--glass-blur);
}
.site-header.is-scrolled .topbar { max-height: 0; opacity: 0; border-color: transparent; }
.site-header.is-scrolled .header__inner { height: 74px; }
.site-header.is-scrolled .brand__logotype { height: 40px; filter: none; }
.site-header.is-scrolled .nav-item:is(:hover, .is-hover) > .nav-link { color: var(--bronze); }

/* ---------- Menü çubuğu + açılır panel: tek parça ortak cam (masaüstü) ----------
   Paneller kendi camını taşımaz. Menü çubuğunun cam zemini (başlığın ::before'u), açık panelin yüksekliği kadar
   aşağı uzar (main.js .panel-acik ve --panel-h verir). Böylece çubuk ve panel tek bir cam yüzeydir; başlıklar
   arasında geçerken cam kaybolup yeniden belirmez, yalnızca yeni panelin yüksekliğine yumuşakça uzar/kısalır.
   Panel içeriği kapanırken hızlı söner, yenisi kısa bir gecikmeyle belirir; eski ve yeni yazılar üst üste binmez. */
@media (min-width: 1081px) {
  .mega {
    background: none; -webkit-backdrop-filter: none; backdrop-filter: none; box-shadow: none;
    opacity: 1; transform: none;
    transition: visibility 0s linear .16s;
  }
  .mega > .mega__inner { opacity: 0; transform: translateY(-6px); transition: opacity .14s var(--ease), transform .14s var(--ease); }
  .nav-item.is-hover > .mega, html:not(.js) .nav-item:hover > .mega, .nav-item:focus-within > .mega { opacity: 1; transform: none; transition: visibility 0s; }
  .nav-item.is-hover > .mega > .mega__inner, html:not(.js) .nav-item:hover > .mega > .mega__inner, .nav-item:focus-within > .mega > .mega__inner {
    opacity: 1; transform: none;
    transition: opacity .26s var(--ease) .12s, transform .26s var(--ease) .12s;
  }

  .site-header::before {
    bottom: calc(-1 * var(--panel-h, 0px));
    transition: opacity .25s var(--ease), bottom .35s var(--ease), box-shadow .35s var(--ease);
  }
  .site-header.is-scrolled.panel-acik { box-shadow: none; } /* çubuğun alt çizgisi panelle birleşim yerinde görünmesin */
  .site-header.is-scrolled.panel-acik::before { box-shadow: 0 26px 46px rgba(0, 0, 0, .14); }
  /* Sayfa başında çubuk saydamdır: koyu buzlu cam yalnızca panel açıkken belirir. Zemin değişimi, kaydırınca
     açık cama dönerken koyu bir an görünmesin diye saydamlık söndükten sonra yapılır. */
  .site-header:not(.is-scrolled)::before {
    background: rgba(0, 0, 0, .16);
    -webkit-backdrop-filter: blur(8px) saturate(1.15) brightness(.78);
            backdrop-filter: blur(8px) saturate(1.15) brightness(.78);
    opacity: 0;
    transition: opacity .25s var(--ease), bottom .35s var(--ease), box-shadow .35s var(--ease),
                background-color 0s linear .25s, -webkit-backdrop-filter 0s linear .25s, backdrop-filter 0s linear .25s;
  }
  .site-header:not(.is-scrolled).panel-acik::before { opacity: 1; box-shadow: 0 26px 46px rgba(0, 0, 0, .3); }
  /* JS yoksa ortak cam uzayamaz: paneller kendi camıyla açılır */
  html:not(.js) .mega { background: var(--glass-bg); -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur); }
}

/* Sayfa başında (başlık saydam, altında koyu hero varken) açılır panel de koyu buzlu cam olur;
   menü çubuğuyla aynı tonda görünür. Kaydırınca panel yeniden açık buzlu cama döner. */
@media (min-width: 1081px) {
  /* Panel, menü çubuğu gibi hero'nun üzerinde ince buzlu camdır: arkasındaki hero görseli hafif bulanık ve
     hafifçe koyulaşmış olarak görünür. Böylece hero'daki resim değiştirilse de (slaytlar ve iç sayfa başlıkları
     dahil) panel kendiliğinden o resmin rengini alır ve hero'dan ayrı bir koyu bant gibi durmaz.
     Hafif siyah örtü, açık renkli görsellerde de beyaz yazıların okunaklı kalmasını sağlar. */
  .site-header:not(.is-scrolled) .mega { color: rgba(255, 255, 255, .85); }
  .site-header:not(.is-scrolled) .mega__divider { background: rgba(255, 255, 255, .14); }
  .site-header:not(.is-scrolled) .mega__links a,
  .site-header:not(.is-scrolled) .mega__title { color: #fff; }
  .site-header:not(.is-scrolled) .mega__links a:hover,
  .site-header:not(.is-scrolled) .mega__links a:focus-visible { color: var(--bronze-light); }
  .site-header:not(.is-scrolled) .mega__links a::before { background: var(--bronze-light); }
  .site-header:not(.is-scrolled) .mega__links small { color: rgba(255, 255, 255, .55); }
  .site-header:not(.is-scrolled) .mega__info .kicker,
  .site-header:not(.is-scrolled) .mega__illus,
  .site-header:not(.is-scrolled) .mega .link-line { color: var(--bronze-light); }
  .site-header:not(.is-scrolled) .mega .link-line:hover { color: #fff; }
  .site-header:not(.is-scrolled) .mega__desc { color: rgba(255, 255, 255, .78); }
}

/* ==========================================================================
   Hero
   ========================================================================== */
.hero {
  position: relative;
  height: 100vh; min-height: 640px; max-height: 1000px;
  background: #111; color: #fff; overflow: hidden;
}
.hero__slide {
  position: absolute; inset: 0;
  display: flex; align-items: center;
  background-size: cover; background-position: center;
  opacity: 0; visibility: hidden;
  transition: opacity 1.2s var(--ease), visibility 1.2s;
}
.hero__slide.is-active { opacity: 1; visibility: visible; }
/* Fotoğraflı slayt (2. slayt): yazının okunduğu sol taraf ile menü ve alt bölge koyulaştırılır */
.hero__slide--photo { background-position: 62% center; }
.hero__slide--photo::before {
  content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background:
    linear-gradient(90deg, rgba(10, 10, 10, .88) 0%, rgba(10, 10, 10, .55) 42%, rgba(10, 10, 10, .12) 75%, rgba(10, 10, 10, .05) 100%),
    linear-gradient(180deg, rgba(10, 10, 10, .75) 0%, rgba(10, 10, 10, .32) 14%, rgba(10, 10, 10, 0) 30%, rgba(10, 10, 10, 0) 75%, rgba(10, 10, 10, .6) 100%);
}
/* Satranç fotoğrafı (3. slayt): görsel zaten koyu tonlu; yazı tarafı ve menü bölgesi daha hafif
   koyulaştırılır, bronz at figürü sağda parlak kalır */
.hero__slide--satranc { background-position: 46% center; }
.hero__slide--satranc::before {
  background:
    linear-gradient(90deg, rgba(10, 10, 10, .6) 0%, rgba(10, 10, 10, .3) 40%, rgba(10, 10, 10, 0) 60%),
    linear-gradient(180deg, rgba(10, 10, 10, .6) 0%, rgba(10, 10, 10, .15) 18%, rgba(10, 10, 10, 0) 30%, rgba(10, 10, 10, 0) 75%, rgba(10, 10, 10, .45) 100%);
}
/* Piyon ve vezir gölgesi (3. slayt): kare fotoğraf, hero için geniş bir görsele dönüştürüldü
   (hero-piyon-golge.jpg, 2880×1440): fotoğraf yüksekliğin %90'ı kadar, alt kenara oturur ve yatayda %70'te durur
   (gölgedeki taç menünün altında kalır); sol, sağ ve üst kenarları fotoğrafın kenarından üretilmiş koyu, bulanık
   zemine yumuşakça karışır. Görsel kutuyu kaplar; slayt açılınca yavaşça yakınlaşma hareketi sürer. */
.hero__slide--piyon { background: #1c1815; }
.hero__piyon {
  position: absolute; inset: 0; width: 100%; height: 100%; max-width: none;
  object-fit: cover; object-position: 70% 40%;
  transform: scale(1.04); transform-origin: 70% 80%;
  transition: transform 6s ease-out;
}
.hero__slide.is-active .hero__piyon { transform: scale(1); }
.hero__slide--piyon::before {
  background:
    linear-gradient(90deg, rgba(10, 10, 10, .55) 0%, rgba(10, 10, 10, .25) 40%, rgba(10, 10, 10, 0) 60%),
    linear-gradient(180deg, rgba(10, 10, 10, .6) 0%, rgba(10, 10, 10, .15) 18%, rgba(10, 10, 10, 0) 30%, rgba(10, 10, 10, 0) 75%, rgba(10, 10, 10, .45) 100%);
}
.hero__content { position: relative; z-index: 2; padding-top: 100px; }
.hero__title {
  font-family: var(--font-head); font-weight: 400;
  font-size: clamp(36px, 4.2vw, 62px); line-height: 1.1;
  text-transform: uppercase; letter-spacing: .01em;
  margin-bottom: 40px; max-width: 13em;
}
.hero__title, .hero__content .link-line {
  opacity: 0; transform: translateY(30px);
  transition: opacity .9s var(--ease), transform .9s var(--ease);
}
.hero__slide.is-active .hero__title { opacity: 1; transform: none; transition-delay: .5s; }
.hero__slide.is-active .link-line { opacity: 1; transform: none; transition-delay: .7s; }
/* Harf harf belirme (döngüsel): JS başlığı harflere böler; her harf karışık bir gecikmeyle bulanık ve saydam halden
   netleşir, bir süre okunur kalır, sonra yine bulanıklaşarak söner ve döngü baştan başlar. Döngü slayt süresiyle
   aynıdır (6,5 sn): yazı slayt değişirken söner, yeni slaytın yazısı belirerek gelir; slayt durduğunda (fare
   üzerindeyken) yazı kendi döngüsünü sürdürür. Gecikmeler farklı olduğundan harfler hiçbir an aynı evrede olmaz.
   Slayt her açıldığında JS döngüyü o slaytta baştan başlatır. Bölme bitene kadar başlık gizli tutulur. */
.js .hero__title:not(.is-harfli) { opacity: 0; }
.hero__title.is-harfli { opacity: 1; transform: none; transition: none; }
.hero__kelime { display: inline-block; white-space: nowrap; }
.hero__harf { display: inline-block; animation: harf-dongu 6.5s var(--ease) var(--d, 0s) infinite both; }
@keyframes harf-dongu {
  0% { opacity: 0; filter: blur(14px); }
  20%, 78% { opacity: 1; filter: blur(0); }
  96%, 100% { opacity: 0; filter: blur(14px); }
}
.js .hero__slide.is-active .link-line { transition-delay: 1.3s; }

.hero__emblem {
  position: absolute; z-index: 1;
  left: 75%; top: 50%;
  width: min(42vw, 66vh, 620px); aspect-ratio: 1;
  transform: translate(-50%, -46%);
  display: flex; align-items: center; justify-content: center;
}
.hero__emblem::before, .hero__emblem::after {
  content: ""; position: absolute; inset: 0; border-radius: 50%;
  border: 1px solid rgba(179, 154, 126, .45);
}
.hero__emblem::after { inset: -7%; border-style: dashed; border-color: rgba(179, 154, 126, .22); }
.hero__emblem img {
  position: relative; width: auto; height: 84%;
  filter: drop-shadow(0 30px 40px rgba(0, 0, 0, .55));
  transform: scale(.94); transition: transform 6s ease-out;
}
.hero__slide.is-active .hero__emblem img { transform: scale(1); }

.hero__nav { position: absolute; left: 0; right: 0; bottom: 13%; z-index: 3; }
.hero__scroll {
  position: absolute; left: 50%; bottom: 26px; z-index: 3; transform: translateX(-50%);
  color: rgba(255, 255, 255, .7); animation: bob 2.4s ease-in-out infinite;
}
.hero__scroll:hover { color: var(--bronze-light); }
@keyframes bob { 0%, 100% { transform: translate(-50%, 0); } 50% { transform: translate(-50%, 8px); } }

/* ==========================================================================
   Bölünmüş (görsel + metin) bölümler
   ========================================================================== */
.split { position: relative; display: grid; grid-template-columns: 1fr 1fr; }
.split__media { position: relative; background-size: cover; background-position: center; min-height: 640px; }
.split__text { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; }
.split__text > p:not(.kicker) { margin-bottom: 34px; max-width: 540px; }

/* Hakkımızda: görsel sağda */
.split--intro .split__text {
  align-items: flex-end; text-align: right;
  padding: 120px 90px 110px var(--gutter);
}
/* Ana sayfa giriş görseli: görsel ayrı katmanda, yalnızca bu katman yarı saydam (ikon karesi etkilenmez) */
.split__bg { position: absolute; inset: 0; background-size: cover; background-position: center; }
.split__bg--saydam { opacity: .5; }

/* Misyon: görsel solda */
.split--mission .split__media { min-height: 620px; }
.split--mission .split__text { padding: 110px var(--gutter) 110px 100px; }
.split--mission .split__text > p:not(.kicker) { max-width: 520px; }

/* ==========================================================================
   Çalışma alanları
   ========================================================================== */
.section { padding: 120px 0; }
.section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 30px; margin-bottom: 50px; }
.section-head .h2 { margin-bottom: 0; }
.section-head .link-line { margin-bottom: 8px; }

.cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; }
.card { background: var(--ink-2); color: #b8b8b8; display: flex; flex-direction: column; }
.card__img { overflow: hidden; aspect-ratio: 768 / 550; }
.card__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--ease); }
.card:hover .card__img img { transform: scale(1.05); }
.card__body { padding: 26px 32px 34px; display: flex; flex-direction: column; flex: 1; }
.card__head { display: flex; align-items: center; gap: 18px; margin-bottom: 18px; }
.card__head .icon-square { flex: none; }   /* başlık iki satıra düşünce kare küçülmesin */
.card h3 { font-family: var(--font-head); font-weight: 400; font-size: 22px; line-height: 1.15; text-transform: uppercase; color: #fff; }
.card p { font-size: 14px; line-height: 1.75; margin-bottom: 26px; flex: 1; }
.card .link-line { align-self: flex-start; }

/* Çalışma alanları sayfası: ayrıntılı alan kutuları */
.area-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; }
.area-detail {
  display: flex; flex-direction: column;
  border: 1px solid var(--line); background: #fff;
  padding: 38px 40px 36px;
  scroll-margin-top: 110px;
  transition: border-color .3s, box-shadow .3s;
}
.area-detail:target { border-color: var(--bronze); box-shadow: 0 0 0 1px var(--bronze); }
.area-detail__head { display: flex; align-items: center; gap: 18px; margin-bottom: 18px; }
.area-detail h3 { font-family: var(--font-head); font-weight: 400; font-size: 25px; line-height: 1.15; text-transform: uppercase; color: var(--ink); }
.area-detail > p { margin-bottom: 18px; }
.area-detail ul { display: grid; gap: 8px; margin-bottom: 26px; flex: 1; }
.area-detail li { position: relative; padding-left: 26px; font-size: 14px; line-height: 1.6; }
.area-detail li::before { content: ""; position: absolute; left: 0; top: .8em; width: 14px; height: 1px; background: var(--bronze); }
.area-detail .link-line { align-self: flex-start; }

/* ==========================================================================
   İlkeler + hizmet türleri
   ========================================================================== */
.principles { display: grid; grid-template-columns: 44% 56%; padding: 20px 0 120px; }
.principles__text {
  display: flex; align-items: flex-end;
  padding: 0 70px 70px var(--gutter);
}
.quote-slider { display: flex; gap: 34px; width: 100%; }
.quote-slider .dashes { padding-top: 6px; }
.quote-slider__track { display: grid; flex: 1; }
.quote {
  grid-area: 1 / 1; margin: 0; text-align: right;
  opacity: 0; visibility: hidden; transform: translateY(16px);
  transition: opacity .8s var(--ease), transform .8s var(--ease), visibility .8s;
}
.quote.is-active { opacity: 1; visibility: visible; transform: none; }
.quote .h3 { margin-bottom: 22px; }
.quote blockquote { margin: 0 0 26px; }
.quote blockquote p { font-size: 15px; }
.quote figcaption { display: flex; align-items: center; justify-content: flex-end; gap: 18px; }
.quote figcaption span { display: flex; flex-direction: column; font-size: 13px; color: var(--muted); line-height: 1.5; }
.quote figcaption strong { font-family: var(--font-head); font-weight: 400; font-size: 17px; letter-spacing: .06em; text-transform: uppercase; color: var(--bronze); }
/* "AD" işareti: logotipin kuralıyla A ince, D kalın */
.quote__mark { flex: none; width: 50px; height: auto; aspect-ratio: 213.09 / 100.76; fill: var(--bronze); transition: transform .4s var(--ease); }
.quote__mark:hover { transform: scale(1.15); }

.principles__panel {
  position: relative;
  background: #141414 url("../img/arka-plan/koyu-doku.jpg") center / cover no-repeat;
  padding: 110px var(--gutter) 110px 150px;
  color: #fff;
}
.principles__panel::before { content: ""; position: absolute; inset: 0; background: linear-gradient(120deg, rgba(10, 10, 10, .5), rgba(10, 10, 10, .15)); }
.services-grid { position: relative; display: grid; grid-template-columns: 1fr 1fr; max-width: 520px; margin-left: auto; }
.services-grid li {
  display: flex; flex-direction: column; align-items: center; text-align: center;
  padding: 38px 20px 40px;
}
.services-grid li:nth-child(odd) { border-right: 1px solid rgba(255, 255, 255, .16); }
.services-grid li:nth-child(-n + 2) { border-bottom: 1px solid rgba(255, 255, 255, .16); }
.services-grid .ico { width: 52px; height: 52px; color: var(--bronze-light); stroke-width: 1; margin-bottom: 18px; }
.services-grid strong { font-family: var(--font-head); font-weight: 400; font-size: 30px; line-height: 1.1; margin-bottom: 8px; }
.services-grid span { font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #bdb6ae; }

/* ==========================================================================
   Ekip
   ========================================================================== */
.team { padding-top: 40px; }
.team__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px; }
/* İki avukat: kartlar ortada, aralarındaki boşluk sayfanın tam ortasında (bağlantı çizgisi buradan geçer) */
.team__grid.team__grid--2 { grid-template-columns: repeat(2, minmax(0, 360px)); justify-content: center; column-gap: 80px; }
.member__link { display: block; }
.member__img { position: relative; display: block; overflow: hidden; margin-bottom: 20px; }
.member img { width: 100%; aspect-ratio: 1; object-fit: cover; transition: transform .8s var(--ease), filter .4s; }
.member__more {
  position: absolute; left: 0; right: 0; bottom: 0;
  display: flex; align-items: center; justify-content: space-between;
  padding: 15px 20px;
  background: rgba(140, 113, 86, .94); color: #fff;
  font-size: 11px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase;
  transform: translateY(101%); transition: transform .45s var(--ease);
}
.member__more .ico { width: 18px; height: 18px; }
.member__link:hover img, .member__link:focus-visible img { transform: scale(1.05); filter: brightness(1.12); }
.member__link:hover .member__more, .member__link:focus-visible .member__more { transform: none; }
.member h3 { font-family: var(--font-head); font-weight: 400; font-size: 22px; text-transform: uppercase; color: var(--bronze); line-height: 1.2; transition: color .25s; }
.member__link:hover h3 { color: var(--ink); }
.member p { font-size: 14px; color: var(--text); }
@media (hover: none) { .member__more { transform: none; } }

/* ==========================================================================
   İletişim formu
   ========================================================================== */
.split--contact .split__media { min-height: 760px; }
/* Kare piyon–vezir fotoğrafı: gölgedeki taç üst kenara yakın, kırpılmasın diye üstten hizalanır */
.split__media--piyon { background-position: center 30%; }
.split--contact .split__text { padding: 110px var(--gutter) 110px 100px; }
.split--contact .split__text > p.contact__lead { margin: -8px 0 30px; }
.form { width: 100%; max-width: 600px; display: grid; gap: 16px; }
.form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.field { position: relative; display: block; }
.field input, .field select, .field textarea {
  width: 100%; border: 1px solid transparent; border-radius: 0;
  background: var(--field); color: var(--ink);
  font: inherit; font-size: 14px; line-height: 1.5;
  padding: 15px 18px;
  transition: border-color .25s, background-color .25s;
  -webkit-appearance: none; appearance: none;
}
.field textarea { resize: vertical; min-height: 140px; }
.field input:focus, .field select:focus, .field textarea:focus { outline: none; border-color: var(--bronze); background: #fff; }
.field input::placeholder, .field textarea::placeholder { color: #8f8f8f; }
.field.is-invalid input, .field.is-invalid textarea { border-color: #b4553f; }
.field--select select { padding-right: 46px; cursor: pointer; color: #8f8f8f; }
.field--select select.has-value { color: var(--ink); }
.field--select .ico { position: absolute; right: 16px; top: 50%; width: 18px; height: 18px; margin-top: -9px; color: var(--bronze); pointer-events: none; }

.check { display: flex; gap: 12px; align-items: flex-start; font-size: 12.5px; line-height: 1.6; color: var(--muted); cursor: pointer; }
.check input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.check__box { flex: none; width: 20px; height: 20px; margin-top: 1px; border: 1px solid #c9c2b9; display: flex; align-items: center; justify-content: center; background: #fff; transition: background-color .2s, border-color .2s; }
.check__box .ico { width: 14px; height: 14px; stroke-width: 2.2; color: #fff; opacity: 0; }
.check input:checked + .check__box { background: var(--bronze); border-color: var(--bronze); }
.check input:checked + .check__box .ico { opacity: 1; }
.check input:focus-visible + .check__box { outline: 2px solid var(--bronze); outline-offset: 2px; }
.check.is-invalid .check__box { border-color: #b4553f; }
/* Onay cümlesi: tıklanınca aydınlatma metnini açar (kutucuğu işaretlemez) */
.check__link {
  padding: 0; border: 0; background: none; color: inherit; font: inherit; line-height: inherit; text-align: left;
  text-decoration: underline; text-decoration-color: rgba(140, 113, 86, .45); text-underline-offset: 3px;
  transition: color .25s var(--ease), text-decoration-color .25s var(--ease);
}
.check__link:hover, .check__link:focus-visible { color: var(--bronze-dark); text-decoration-color: currentColor; }
.check__link:focus-visible { outline: 2px solid var(--bronze); outline-offset: 2px; }

/* ---------- Hukuki metin penceresi (KVKK aydınlatma metni) ---------- */
html.has-dialog { overflow: hidden; }
.legal-dialog {
  width: min(760px, calc(100vw - 32px)); max-height: min(86vh, 900px);
  padding: 0; border: 0; background: var(--white); color: var(--text);
  box-shadow: 0 30px 80px rgba(0, 0, 0, .35); overflow: hidden;
}
.legal-dialog[open] { display: flex; flex-direction: column; }
.legal-dialog::backdrop { background: rgba(25, 25, 25, .62); }
.legal-dialog__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding: 30px 36px 22px; border-bottom: 1px solid var(--line); }
.legal-dialog__head .kicker { font-size: 14px; margin-bottom: 6px; }
.legal-dialog__title { font-family: var(--font-head); font-weight: 400; font-size: clamp(22px, 2.4vw, 28px); line-height: 1.2; text-transform: uppercase; color: var(--ink); }
.legal-dialog__close {
  flex: none; width: 40px; height: 40px; display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid var(--line); background: none; color: var(--ink);
  transition: color .25s var(--ease), border-color .25s var(--ease);
}
.legal-dialog__close .ico { width: 16px; height: 16px; }
.legal-dialog__close:hover { color: var(--bronze); border-color: var(--bronze); }
.legal-dialog__body { overflow-y: auto; overscroll-behavior: contain; padding: 4px 36px 30px; font-size: 14px; line-height: 1.75; }
.legal-dialog__body > p:first-child { margin-top: 22px; }
.legal-dialog__body h3 { margin: 28px 0 10px; font-family: var(--font-head); font-weight: 400; font-size: 19px; letter-spacing: .02em; text-transform: uppercase; color: var(--ink); }
.legal-dialog__body p + p { margin-top: 10px; }
.legal-dialog__body ul, .legal-dialog__body ol { margin: 10px 0; padding: 0; list-style: none; }
.legal-dialog__body li + li { margin-top: 7px; }
.legal-dialog__body ul li { position: relative; padding-left: 20px; }
.legal-dialog__body ul li::before { content: ""; position: absolute; left: 0; top: .9em; width: 9px; height: 1px; background: var(--bronze); }
.legal-dialog__bentler li { display: flex; gap: 10px; }
.legal-dialog__bentler span { flex: none; width: 18px; color: var(--bronze); font-weight: 700; }
.legal-dialog__body strong { color: var(--ink); }
.legal-dialog__body a { color: var(--bronze-dark); text-decoration: underline; text-underline-offset: 2px; }
.legal-dialog__body .legal-dialog__date { margin-top: 26px; font-size: 12.5px; color: var(--muted); }
.legal-dialog__foot { display: flex; align-items: center; gap: 28px; padding: 18px 36px; border-top: 1px solid var(--line); background: var(--paper); }
.legal-dialog__dismiss {
  padding: 6px 0; border: 0; background: none; color: var(--ink);
  font-size: 12px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase;
  transition: color .25s var(--ease);
}
.legal-dialog__dismiss:hover { color: var(--bronze); }
@media (prefers-reduced-motion: no-preference) {
  .legal-dialog[open] { animation: legal-dialog-in .35s var(--ease); }
  .legal-dialog[open]::backdrop { animation: legal-backdrop-in .35s ease; }
}
@keyframes legal-dialog-in { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes legal-backdrop-in { from { opacity: 0; } to { opacity: 1; } }
@media (max-width: 680px) {
  .legal-dialog { width: calc(100vw - 24px); max-height: 90vh; }
  .legal-dialog__head { padding: 22px 20px 16px; }
  .legal-dialog__head .kicker { font-size: 12px; margin-bottom: 4px; }
  .legal-dialog__title { font-size: 20px; }
  .legal-dialog__body { padding: 0 20px 24px; font-size: 13.5px; }
  .legal-dialog__foot { padding: 14px 20px; gap: 20px; }
  .legal-dialog__foot .btn { flex: 1; padding: 15px 18px; }
}

.form__foot { display: flex; align-items: center; gap: 24px; flex-wrap: wrap; margin-top: 6px; }
.form__status { font-size: 13px; color: var(--bronze-dark); max-width: 360px; line-height: 1.5; }
.form__status.is-error { color: #b4553f; }

/* ==========================================================================
   Marka şeridi
   ========================================================================== */
.brand-band { position: relative; background: var(--paper); padding: 60px 0 54px; text-align: center; }
/* Üst kenarda footer'ın başındakiyle aynı bronz çizgi; ortasındaki baklavayı üstteki görselin köşesi verir.
   z-index 2: görselin gölgesinin (1) üstünde, baklavanın (3) altında. */
.brand-band::before {
  content: ""; position: absolute; left: 0; right: 0; top: 0; z-index: 2; height: 2px; pointer-events: none;
  background: linear-gradient(90deg, rgba(179, 154, 126, .35), rgb(196, 170, 138) 30%, rgb(196, 170, 138) 70%, rgba(179, 154, 126, .35));
}
/* Logotip, açık zeminde koyu */
.brand-band__img {
  display: block; width: min(380px, 100%); height: auto; aspect-ratio: 807.91 / 215.75;
  margin: 0 auto 18px; fill: var(--ink);
}
.brand-band__text { font-family: var(--font-head); font-size: 17px; letter-spacing: .05em; color: var(--bronze); }

/* ==========================================================================
   Sütunlu görsel bölümü (ana sayfanın sonunda marka logosu)
   ========================================================================== */
.career {
  position: relative; color: #fff; text-align: center;
  background: #2a2520 url("../img/fotograflar/kariyer-sutunlar.jpg") center / cover no-repeat fixed;
  padding: 130px 0 120px;
}
.career::before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(20, 17, 14, .78), rgba(20, 17, 14, .62)); }
.career__inner { position: relative; max-width: 720px; display: flex; flex-direction: column; align-items: center; }
/* Ana sayfa: sütunlu görselin üzerinde marka logosu. Logo açık zeminli bir görsel olduğundan koyu fotoğrafta
   renkleri ters çevrilir (koyu yazı açık, bronz figür açık bronz olur), zemini "screen" karışımıyla kaybolur ve
   kenarları elips biçiminde erir. Karışım fotoğrafa ulaşsın diye belirme animasyonu (reveal) kapsayıcıya değil
   logonun kendisine verilir: kapsayıcıdaki opaklık geçişi logoyu bir an siyah kutu gibi gösterirdi. */
.career--marka .career__inner, .page-home .career--marka .career__inner { max-width: none; }
/* Üstteki piyon fotoğrafıyla ve alttaki footer'la uyum: sütun fotoğrafının örtüsü piyonun sıcak kahve tonuna
   yaklaştırılır; üst ve alt kenara hafif bir iç gölge ve tam genişlikte ince bronz birer çizgi gelir. Üst çizginin
   ortasında iletişim görselinin köşesindeki baklava (piyon fotoğrafının sağ alt köşesi tam bu noktaya oturur),
   alt çizginin ortasında footer'ın baklavası durur. */
.career--marka { padding: 72px 0 70px; box-shadow: inset 0 26px 40px -24px rgba(0, 0, 0, .75), inset 0 -26px 40px -24px rgba(0, 0, 0, .75); }
.career--marka::before { background: linear-gradient(180deg, rgba(32, 24, 17, .8), rgba(28, 21, 15, .62)); }
.career--marka::after {
  --bronz-cizgi: linear-gradient(90deg, rgba(179, 154, 126, .15), rgba(179, 154, 126, .85) 30%, rgba(179, 154, 126, .85) 70%, rgba(179, 154, 126, .15));
  /* üst çizgi beyaz alana ve açık renkli fotoğrafa komşu: footer'daki çizgiyle aynı belirginlikte görünsün diye
     2px ve biraz daha parlak (footer çizgisi iki koyu alanın arasında, 1px yeterli) */
  --bronz-cizgi-ust: linear-gradient(90deg, rgba(179, 154, 126, .35), rgb(196, 170, 138) 30%, rgb(196, 170, 138) 70%, rgba(179, 154, 126, .35));
  content: ""; position: absolute; inset: 0; z-index: 2; pointer-events: none;
  background: var(--bronz-cizgi-ust) top / 100% 2px no-repeat, var(--bronz-cizgi) bottom / 100% 1px no-repeat;
}
.career__marka {
  display: block; width: min(460px, 100%); margin: 0 auto;
  filter: invert(1) hue-rotate(180deg);
  mix-blend-mode: screen;
  -webkit-mask-image: radial-gradient(closest-side, #000 72%, rgb(0 0 0 / .6) 84%, transparent);
          mask-image: radial-gradient(closest-side, #000 72%, rgb(0 0 0 / .6) 84%, transparent);
}
/* İletişim'deki marka şeridinin sloganıyla aynı yazı; koyu fotoğrafta açık bronz */
.career__slogan { margin-top: 12px; font-family: var(--font-head); font-size: 17px; letter-spacing: .05em; color: var(--bronze-light); }

/* ==========================================================================
   Alt bilgi
   ========================================================================== */
.site-footer { position: relative; background: #343434; color: #bdbdbd; font-size: 13.5px; }
/* Footer'ın başı (tüm sayfalar): tam genişlikte ince bronz çizgi, ortasında baklava. Ana sayfada çizgiyi
   üstteki marka bölümünün alt kenarı verir; diğer sayfalarda footer'ın üst kenarına çizilir. Üstteki bölüm
   çoğunlukla açık zeminli olduğundan çizgi, ana sayfadaki üst çizgi gibi 2px ve biraz daha parlak. */
.page-inner .site-footer::after {
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: 2px; pointer-events: none;
  background: linear-gradient(90deg, rgba(179, 154, 126, .35), rgb(196, 170, 138) 30%, rgb(196, 170, 138) 70%, rgba(179, 154, 126, .35));
}
@media (min-width: 1081px) {
  .site-footer::before {
    content: ""; position: absolute; left: 50%; top: 0; z-index: 3;
    width: 16px; height: 16px;
    background: var(--white); border: 1px solid var(--bronze);
    box-shadow: 0 0 0 6px var(--white);
    transform: translate(-50%, -50%) rotate(45deg);
  }
}
/* Bina çizimi yazıların altında kendi şeridinde durur (yazıların arkasına girmez); zemini footer ile aynı
   #343434 olduğundan dikişsizdir ve tabanı telif şeridinin çizgisine oturur. Genişlik en fazla 734px
   (yükseklik 160px); dar ekranlarda içerik genişliğine iner. Görsel oranı 393/1802 ≈ .218. */
.footer__grid {
  position: relative;
  display: grid; grid-template-columns: 1.4fr .95fr .95fr 1.4fr; gap: 50px; padding-top: 14px;
  padding-bottom: calc(6px + min(100vw - 40px, 734px) * .218);
  background: url("../img/arka-plan/footer-bina-bayraksiz.jpg") center bottom / min(calc(100% - 40px), 734px) auto no-repeat;
}
/* Dalgalanan bayrak: bina çizimiyle birebir aynı kutuda (aynı genişlik, oran, alt-orta hizası) bir katman.
   Bayrak (bayrak.svg, animasyonu kendi içinde, yavaş dalga) çizimdeki direğin ucuna oturur; konum ve boyut
   çizimin piksel ölçülerinden (1802×393) hesaplandı: bayrak 51,6×34,4 px (uçkurluk dahil; uçkurluğun iç
   kenarı direkte x 1461, üstü direk tepesinde y 17,5), dalga payıyla SVG kutusu x 1459,28 · y 9,76 · 55,04×49,88 px. */
.footer__grid::after {
  content: ""; position: absolute; left: 50%; bottom: 0;
  width: min(calc(100% - 40px), 734px); aspect-ratio: 1802 / 393;
  transform: translateX(-50%);
  background: url("../img/arka-plan/bayrak.svg?v=3") 83.533% 2.844% / 3.054% 12.692% no-repeat;
  pointer-events: none;
}
/* Hareketin azaltılmasını tercih eden kullanıcılara duran bayrak */
@media (prefers-reduced-motion: reduce) {
  .footer__grid::after { background-image: url("../img/arka-plan/bayrak-sabit.svg?v=3"); }
}
.brand--footer { color: #fff; margin-bottom: 20px; }
.brand--footer .brand__logotype { height: 50px; filter: none; }
.footer__contact { display: grid; gap: 9px; margin-bottom: 14px; }
.footer__contact li { display: flex; gap: 12px; line-height: 1.6; }
.footer__contact .ico { width: 17px; height: 17px; color: var(--bronze-light); margin-top: 2px; }
.footer__contact a:hover, .footer__links a:hover { color: var(--bronze-light); }
.footer__follow { color: #fff; font-weight: 700; margin-bottom: 9px; }
.social { display: flex; gap: 8px; }
.social a { width: 36px; height: 36px; display: inline-flex; align-items: center; justify-content: center; background: var(--bronze); color: #fff; }
.social a:hover { background: #fff; color: var(--bronze); }
.social .ico { width: 17px; height: 17px; }
.footer__title { font-size: 13px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #fff; margin: 14px 0 20px; }
.footer__links li { border-bottom: 1px solid rgba(255, 255, 255, .09); }
.footer__links a { display: block; padding: 6px 0; }
/* Ofis haritası: sitenin kendi çizim haritası (ofis-haritasi.svg; harita uygulamalarının alışılmış açık renkleri).
   Dış kaynağa bağlı değildir, dosyadan açıldığında da görünür. Çerçeve sitedeki görsel çerçeveleriyle aynı dilde:
   ince bronz kenar, içte paspartu çizgisi ve altta gölge. Konum nabız atan bronz baklavayla işaretlenir (çizimdeki
   konum noktası: soldan %46, üstten %44,47); kutunun tamamı Google Haritalar'da yol tarifine giden bağlantıdır.
   Yükseklik, footer'ın eski boyunu aşmayacak biçimde 500:208 orandadır. */
.footer__harita {
  position: relative; display: block; aspect-ratio: 500 / 208; background: #f5f5f3; overflow: hidden;
  border: 1px solid rgba(179, 154, 126, .55); box-shadow: 0 20px 40px -22px rgba(0, 0, 0, .8);
}
.footer__harita:focus-visible { outline: 2px solid var(--bronze-light); outline-offset: 3px; }
.footer__harita-cizim {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
  transition: transform 1.2s var(--ease);
}
.footer__harita:hover .footer__harita-cizim { transform: scale(1.04); }
.footer__harita::after { content: ""; position: absolute; inset: 8px; z-index: 1; pointer-events: none; border: 1px solid rgba(140, 113, 86, .35); }
.footer__harita-isaret {
  position: absolute; left: 46%; top: 44.47%; z-index: 2; width: 14px; height: 14px;
  background: var(--bronze); border: 2px solid #fff; transform: translate(-50%, -50%) rotate(45deg);
  box-shadow: 0 3px 8px rgba(0, 0, 0, .35);
}
.footer__harita-isaret::after {
  content: ""; position: absolute; inset: -10px; border: 1.5px solid rgba(140, 113, 86, .85);
  animation: isaret-nabiz 2.6s ease-out infinite;
}
@keyframes isaret-nabiz { from { transform: scale(.55); opacity: .9; } to { transform: scale(1.9); opacity: 0; } }
.footer__harita-ac {
  position: absolute; top: 15px; right: 15px; z-index: 2; display: inline-flex; align-items: center; gap: 8px;
  padding: 6px 10px; background: rgba(28, 24, 20, .82); color: var(--bronze-light);
  font-size: 10.5px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase;
  opacity: 0; transform: translateY(-4px); transition: opacity .35s var(--ease), transform .35s var(--ease);
}
.footer__harita-ac .ico { width: 13px; height: 13px; transform: rotate(-45deg); }
.footer__harita:hover .footer__harita-ac, .footer__harita:focus-visible .footer__harita-ac { opacity: 1; transform: none; }
@media (hover: none) { .footer__harita-ac { opacity: 1; transform: none; } }
.footer__map .footer__note { margin-top: 14px; font-size: 12px; line-height: 1.7; color: #8d8d8d; text-align: justify; hyphens: auto; }
.footer__bottom { border-top: 1px solid rgba(255, 255, 255, .08); padding: 4px 0; font-size: 12.5px; color: #8d8d8d; }

/* Yukarı çık */
.to-top {
  position: fixed; right: 22px; bottom: 22px; z-index: 90;
  width: 46px; height: 46px; display: flex; align-items: center; justify-content: center;
  background: var(--bronze); color: #fff;
  opacity: 0; visibility: hidden; transform: translateY(12px);
  transition: opacity .3s, transform .3s, visibility .3s, background-color .25s;
}
.to-top.is-visible { opacity: 1; visibility: visible; transform: none; }
.to-top:hover { background: var(--ink); }
.to-top .ico { width: 20px; height: 20px; }

/* ==========================================================================
   İç sayfalar
   ========================================================================== */
.page-hero {
  position: relative; display: flex; align-items: center;
  min-height: 560px; padding: 170px 0 110px;
  background: #111 center / cover no-repeat; color: #fff; overflow: hidden;
}
.page-hero--tall { min-height: 640px; padding-bottom: 170px; }
/* Alt kenarda footer'ın başındakiyle aynı bronz çizgi; ortasındaki baklavayı alttaki bölüm verir (avukat profil
   sayfalarında baklava olmadığından çizgi de yok). İletişim'de bilgi kartları çizginin üstüne biner.
   Koyu zeminde kaybolmasın diye çizgi yalnızca en uçlarda hafifçe söner. Ana sayfa hero'sunda da aynı çizgi var. */
.hero::after,
body:not(.page-profile) .page-hero::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; height: 2px; pointer-events: none;
  background: linear-gradient(90deg, rgba(179, 154, 126, .6), rgb(196, 170, 138) 10%, rgb(196, 170, 138) 90%, rgba(179, 154, 126, .6));
}
.page-hero__content { position: relative; z-index: 2; }
.page-hero__title {
  font-family: var(--font-head); font-weight: 400;
  font-size: clamp(42px, 5vw, 68px); line-height: 1.05;
  text-transform: uppercase; letter-spacing: .01em;
  margin: 20px 0 22px;
}
.page-hero__lead { max-width: 520px; font-size: 16px; color: rgba(255, 255, 255, .8); }
.page-hero .hero__emblem { width: min(30vw, 52vh, 440px); top: 56%; }
.page-hero .hero__emblem img { transform: none; }

.breadcrumb {
  display: flex; flex-wrap: wrap; align-items: center; gap: 12px;
  font-size: 11.5px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase;
  color: var(--bronze-light);
}
.breadcrumb::before { content: ""; width: 44px; height: 1px; background: var(--bronze-light); margin-right: 6px; }
.breadcrumb a { color: rgba(255, 255, 255, .78); }
.breadcrumb a:hover { color: var(--bronze-light); }
.breadcrumb span[aria-hidden] { color: rgba(255, 255, 255, .35); }

.section-head--center { justify-content: center; text-align: center; }
.section-head--spaced { margin-top: 110px; }

/* Ana sayfa iletişim özeti */
.contact-list { display: grid; gap: 14px; margin: 0 0 36px; }
.contact-list li { display: flex; align-items: center; gap: 16px; }
.contact-list li > span:last-child { color: var(--ink); line-height: 1.5; }
.contact-list small { display: block; font-size: 10.5px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); }
.contact-list a:hover { color: var(--bronze); }

/* Randevu şeridi */
.cta-band { background: var(--paper); padding: 70px 0; }
.cta-band__inner { display: flex; align-items: center; gap: 36px; }
.cta-band__inner > .icon-square { flex: none; }
.cta-band__text { flex: 1; }
.cta-band .kicker { margin-bottom: 8px; }
.cta-band .h2 { font-size: clamp(26px, 2.6vw, 34px); margin-bottom: 0; }
.cta-band__actions { display: flex; flex-direction: column; align-items: center; gap: 14px; flex: none; }
.cta-band__phone { display: inline-flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 700; letter-spacing: .08em; color: var(--ink); }
.cta-band__phone .ico { width: 18px; height: 18px; color: var(--bronze); }
.cta-band__phone:hover { color: var(--bronze); }

/* Hakkımızda: vizyon, değerler, süreç */
.vision { max-width: 520px; border-left: 2px solid var(--bronze); padding: 4px 0 4px 24px; }
.vision .kicker { margin-bottom: 8px; }

.values__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px; }
.value { text-align: center; padding: 46px 28px 40px; border: 1px solid var(--line); background: #fff; transition: border-color .3s; }
.value:hover { border-color: var(--bronze-light); }
.value .icon-square { width: 74px; height: 74px; margin-bottom: 26px; }
.value .icon-square .ico { width: 36px; height: 36px; }
.value h3 { font-family: var(--font-head); font-weight: 400; font-size: 26px; text-transform: uppercase; color: var(--ink); margin-bottom: 12px; }
.value p { font-size: 14px; line-height: 1.7; color: var(--muted); }

.process { position: relative; background: #141414 url("../img/arka-plan/hero-1.svg") center / cover no-repeat; color: #fff; padding: 110px 0 100px; }
.process::before { content: ""; position: absolute; inset: 0; background: rgba(12, 12, 12, .3); }
.process .container { position: relative; }
.process .h2 { color: #fff; }
.steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid rgba(255, 255, 255, .16); }
.step { padding: 40px 30px 10px 0; }
.step + .step { padding-left: 30px; border-left: 1px solid rgba(255, 255, 255, .16); }
.step__no { display: block; font-family: var(--font-head); font-size: 54px; line-height: 1; color: var(--bronze-light); margin-bottom: 18px; }
.step h3 { font-family: var(--font-head); font-weight: 400; font-size: 23px; text-transform: uppercase; margin-bottom: 10px; }
.step p { font-size: 14px; line-height: 1.7; color: #c4bdb5; }

/* Ekibimiz sayfası */
.team--page { padding-top: 120px; }

/* Avukat profil sayfası */
.profile { padding: 110px 0 100px; }
.profile__grid { display: grid; grid-template-columns: minmax(0, 400px) minmax(0, 1fr); gap: 80px; align-items: start; }
.profile__aside { position: sticky; top: 110px; }
.profile__photo { width: 100%; aspect-ratio: 1; object-fit: cover; }
.profile__contact { background: var(--ink-2); color: #d6d6d6; padding: 30px 30px 32px; }
.profile__contact-title { font-family: var(--font-head); font-weight: 400; font-size: 20px; letter-spacing: .06em; text-transform: uppercase; color: #fff; margin-bottom: 10px; }
.profile__contact li { display: flex; align-items: center; gap: 12px; padding: 11px 0; border-bottom: 1px solid rgba(255, 255, 255, .1); font-size: 14px; }
.profile__contact li .ico { width: 18px; height: 18px; color: var(--bronze-light); }
.profile__contact a:hover { color: var(--bronze-light); }
.profile__contact .btn { width: 100%; margin-top: 24px; }
.profile__contact .btn:hover { background: #fff; color: var(--ink); }
/* Profil sayfasında avukatın adı */
.profile__isim {
  font-size: clamp(46px, 4.6vw, 62px);
  line-height: 1.1; text-transform: none; letter-spacing: 0; margin: 2px 0 22px;
}
/* Kartvizitteki el yazısından birebir çizilmiş ad (SVG, assets/img/imza/); renk siyah */
.profile__isim--imza { color: #000; line-height: 0; margin: 10px 0 26px; }
.profile__imza { display: block; height: clamp(62px, 6.4vw, 84px); width: auto; max-width: 100%; }
.profile__bio p { margin-bottom: 18px; max-width: 680px; }

.profile__facts { display: grid; grid-template-columns: 1fr 1fr; margin-top: 30px; border-top: 1px solid var(--line); }
.fact { padding: 30px 30px 30px 0; border-bottom: 1px solid var(--line); }
.fact:nth-child(even) { padding: 30px 0 30px 30px; border-left: 1px solid var(--line); }
.fact--wide, .fact--wide:nth-child(even) { grid-column: 1 / -1; padding: 30px 0; border-left: 0; }
.fact__head { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.fact__head .ico { width: 26px; height: 26px; color: var(--bronze); stroke-width: 1.2; }
.fact__head h3 { font-family: var(--font-head); font-weight: 400; font-size: 20px; text-transform: uppercase; color: var(--ink); }
.fact li + li { margin-top: 10px; }
.fact li strong { display: block; color: var(--ink); font-weight: 700; font-size: 14.5px; line-height: 1.5; }
.fact li span { display: block; font-size: 13.5px; color: var(--muted); line-height: 1.6; }
.tags { display: flex; flex-wrap: wrap; gap: 10px; }
.tags a { border: 1px solid var(--line); padding: 9px 16px; font-size: 12.5px; letter-spacing: .04em; color: var(--ink); line-height: 1.3; }
.tags a:hover { background: var(--bronze); border-color: var(--bronze); color: #fff; }

.profile-nav { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 50px; padding: 24px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.profile-nav__link { display: inline-flex; align-items: center; gap: 14px; flex: 1; }
.profile-nav__link--next { justify-content: flex-end; text-align: right; }
.profile-nav__link span { display: flex; flex-direction: column; font-family: var(--font-head); font-size: 19px; text-transform: uppercase; color: var(--ink); line-height: 1.3; }
.profile-nav__link small { font-family: var(--font-body); font-size: 10.5px; font-weight: 700; letter-spacing: .18em; color: var(--muted); }
.profile-nav__link .ico { width: 22px; height: 22px; color: var(--bronze); transition: transform .3s var(--ease); }
.profile-nav__link--prev .ico { transform: scaleX(-1); }
.profile-nav__link--prev:hover .ico { transform: scaleX(-1) translateX(4px); }
.profile-nav__link--next:hover .ico { transform: translateX(4px); }
.profile-nav__link:hover span { color: var(--bronze); }
.profile-nav__all { flex: none; width: 52px; height: 52px; display: flex; align-items: center; justify-content: center; border: 1px solid var(--line); color: var(--bronze); }
.profile-nav__all:hover { background: var(--bronze); border-color: var(--bronze); color: #fff; }
.profile-nav__all .ico { width: 20px; height: 20px; }

/* İletişim sayfası */
.info-cards { position: relative; z-index: 3; padding-bottom: 100px; }
.info-cards__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px; margin-top: -70px; }
.info-card { background: #fff; border: 1px solid var(--line); box-shadow: 0 24px 50px rgba(0, 0, 0, .07); padding: 34px 28px; }
.info-card .icon-square { margin-bottom: 22px; }
.info-card h3 { font-family: var(--font-head); font-weight: 400; font-size: 22px; text-transform: uppercase; color: var(--ink); margin-bottom: 8px; }
.info-card p { font-size: 14.5px; line-height: 1.7; }
.info-card a:hover { color: var(--bronze); }

@media (max-width: 1200px) {
  .area-list { grid-template-columns: repeat(2, 1fr); }
  .area-detail { padding: 34px 32px 32px; }
}

@media (max-width: 1080px) {
  .page-hero { min-height: 460px; padding: 140px 0 90px; }
  .page-hero--tall { min-height: 480px; padding-bottom: 90px; }
  .page-hero .hero__emblem { left: 78%; width: min(46vw, 380px); opacity: .45; }
  .values__grid, .info-cards__grid { grid-template-columns: repeat(2, 1fr); }
  .steps { grid-template-columns: repeat(2, 1fr); }
  .step:nth-child(3) { padding-left: 0; border-left: 0; }
  .step:nth-child(n + 3) { border-top: 1px solid rgba(255, 255, 255, .16); margin-top: 30px; }
  .profile { padding: 90px 0 80px; }
  .profile__grid { grid-template-columns: 1fr; gap: 50px; }
  .profile__aside { position: static; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); max-width: 760px; }
  .profile__contact { display: flex; flex-direction: column; justify-content: center; }
}

@media (max-width: 680px) {
  .page-hero, .page-hero--tall { min-height: 420px; padding: 130px 0 70px; background-position: 72% center; }
  .page-hero .hero__emblem { left: 74%; top: 50%; width: 80vw; opacity: .18; }
  .page-hero__lead { font-size: 15px; }
  .section-head--spaced { margin-top: 80px; }
  .area-list, .values__grid, .info-cards__grid, .steps { grid-template-columns: 1fr; }
  .area-detail { padding: 30px 24px 28px; }
  .step, .step + .step { padding: 30px 0 6px; border-left: 0; }
  .step + .step { border-top: 1px solid rgba(255, 255, 255, .16); margin-top: 0; }
  .cta-band__inner { flex-direction: column; align-items: flex-start; gap: 24px; }
  .cta-band__actions { align-items: flex-start; }
  .info-cards__grid { margin-top: -50px; }
  .profile__aside { grid-template-columns: 1fr; }
  .profile__facts { grid-template-columns: 1fr; }
  .fact, .fact:nth-child(even) { padding: 26px 0; border-left: 0; }
  .profile-nav__link span { font-size: 15px; }
  .profile-nav__link small { font-size: 9.5px; letter-spacing: .12em; }
}

/* Kaydırınca beliren öğeler (yalnızca JS açıkken) */
.js .reveal { opacity: 0; transform: translateY(34px); transition: opacity .9s var(--ease), transform .9s var(--ease); }
.js .reveal.is-visible { opacity: 1; transform: none; }

/* ==========================================================================
   Duyarlı tasarım
   ========================================================================== */
@media (max-width: 1200px) {
  .main-nav { gap: 24px; }
  .main-nav__list { gap: 22px; }
  .split--intro .split__text { padding-right: 70px; }
  .split--mission .split__text, .split--contact .split__text { padding-left: 80px; }
  .principles__panel { padding-left: 120px; }
}

@media (max-width: 1080px) {
  :root { --header-h: 78px; }
  .topbar { display: none; }
  .nav-toggle { display: inline-flex; }
  .brand__logotype { height: 42px; }
  .main-nav {
    position: fixed; inset: 0 0 0 auto; z-index: -1;
    width: min(400px, 100%);
    flex-direction: column; align-items: stretch; justify-content: flex-start; gap: 30px;
    padding: 96px 32px 40px;
    background: var(--ink); color: #fff;
    overflow-y: auto; overscroll-behavior: contain;
    transform: translateX(100%); visibility: hidden;
    transition: transform .45s var(--ease), visibility .45s;
  }
  .main-nav__list { flex-direction: column; gap: 0; height: auto; }
  .nav-item { display: grid; grid-template-columns: 1fr auto; align-items: center; border-bottom: 1px solid rgba(255, 255, 255, .08); }
  .main-nav .nav-link { justify-self: start; font-family: var(--font-head); font-size: 24px; text-transform: uppercase; letter-spacing: .04em; padding: 12px 0; }
  .main-nav .nav-link::after { bottom: 8px; }
  .sub-toggle { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; margin-right: -10px; color: var(--bronze-light); }
  .sub-toggle .ico { width: 20px; height: 20px; transition: transform .3s var(--ease); }
  .nav-item.is-open .sub-toggle .ico { transform: rotate(180deg); }
  .mega {
    position: static; grid-column: 1 / -1;
    background: none; -webkit-backdrop-filter: none; backdrop-filter: none; box-shadow: none; border: 0;
    opacity: 1; visibility: visible; transform: none; pointer-events: auto;
    max-height: 0; overflow: hidden; transition: max-height .4s var(--ease);
  }
  .nav-item:is(:hover, .is-hover) > .mega, .nav-item:focus-within > .mega { opacity: 1; visibility: visible; max-height: 0; transition: max-height .4s var(--ease); }
  .nav-item.is-open > .mega { max-height: 720px; }
  .mega .container { padding: 0; }
  .mega__inner { display: block; padding: 0 0 18px; }
  .mega__divider, .mega__illus, .mega__info .kicker, .mega__title { display: none; }
  .mega__links { gap: 10px; min-width: 0; margin: 2px 0 14px; }
  .mega__links--2col { grid-template-columns: 1fr; }
  .mega__links a { font-size: 17px; color: #e4ded6; }
  .mega__links small { color: #8f8a84; }
  .mega__desc { font-size: 13px; line-height: 1.7; color: #a39d96; margin-bottom: 12px; }
  .mega .link-line { color: var(--bronze-light); }
  .main-nav__cta { color: var(--bronze-light); align-self: flex-start; }
  .main-nav__contact { display: grid; gap: 10px; font-size: 13px; color: #bdbdbd; }
  .main-nav__contact a { display: flex; align-items: center; gap: 10px; }
  .main-nav__contact .ico { width: 17px; height: 17px; color: var(--bronze-light); }
  body.nav-open { overflow: hidden; }
  body.nav-open .main-nav { transform: none; visibility: visible; }
  body.nav-open .nav-toggle { color: #fff; position: relative; z-index: 2; }
  body.nav-open .nav-toggle .ico--open { display: none; }
  body.nav-open .nav-toggle .ico--close { display: block; }
  body.nav-open .site-header { box-shadow: none; color: #fff; }
  .site-header.is-scrolled .nav-item:is(:hover, .is-hover) > .nav-link { color: var(--bronze-light); }
  .nav-backdrop { position: fixed; inset: 0; z-index: 99; background: rgba(0, 0, 0, .5); opacity: 0; visibility: hidden; transition: opacity .4s, visibility .4s; }
  body.nav-open .nav-backdrop { opacity: 1; visibility: visible; }

  .hero__emblem { left: 74%; width: min(52vw, 60vh); opacity: .55; }

  .split { grid-template-columns: 1fr; }
  .split .split__media { min-height: 0; aspect-ratio: 16 / 10; margin-top: 0; order: -1; }
  /* Kare piyon–vezir fotoğrafı mobilde de kare gösterilir (taç ve piyon kırpılmaz) */
  .split .split__media.split__media--piyon { aspect-ratio: 1; }
  .split .split__text,
  .split--intro .split__text,
  .split--mission .split__text,
  .split--contact .split__text { align-items: flex-start; text-align: left; padding: 80px 24px; max-width: 760px; margin: 0 auto; width: 100%; }

  .cards { grid-template-columns: repeat(2, 1fr); }

  .principles { grid-template-columns: 1fr; padding-top: 0; }
  .principles__text { padding: 0 24px 70px; max-width: 760px; margin: 0 auto; width: 100%; }
  .principles__panel { padding: 70px 24px; }
  .services-grid { margin: 0 auto; }

  .team__grid { grid-template-columns: repeat(2, 1fr); }
  .footer__grid { grid-template-columns: 1fr 1fr; gap: 32px 50px; }
  .career { background-attachment: scroll; }
}

@media (max-width: 680px) {
  body { font-size: 14.5px; }
  .section { padding: 90px 0; }
  .brand__logotype { height: 40px; }

  .hero { min-height: 600px; }
  .hero__slide { background-position: 72% center; }
  .hero__slide.hero__slide--photo { background-position: 56% center; }
  .hero__slide.hero__slide--satranc { background-position: 66% center; }
  .hero__piyon { object-position: 68% 40%; }
  .hero__slide--photo::before { background: linear-gradient(180deg, rgba(10, 10, 10, .62) 0%, rgba(10, 10, 10, .5) 45%, rgba(10, 10, 10, .82) 100%); }
  .hero__content { padding-top: 40px; }
  .hero__emblem { left: 70%; top: 38%; width: 92vw; opacity: .22; }
  .hero__nav { bottom: 10%; }

  .split .split__media { aspect-ratio: 4 / 3; }
  .section-head { flex-direction: column; align-items: flex-start; }
  .cards { grid-template-columns: 1fr; }
  .card__body { padding: 24px 24px 30px; }

  .quote-slider { gap: 22px; }
  .services-grid li { padding: 30px 10px 32px; }
  .services-grid strong { font-size: 24px; }
  .services-grid span { font-size: 10px; letter-spacing: .1em; }

  .team__grid { gap: 30px 18px; }
  .team__grid.team__grid--2 { grid-template-columns: repeat(2, 1fr); column-gap: 18px; }
  .member h3 { font-size: 19px; }
  .form__row { grid-template-columns: 1fr; }
  .form__foot .btn { width: 100%; }
  .footer__grid { grid-template-columns: 1fr; padding-top: 14px; }
  .footer__map { margin-bottom: 22px; }   /* not, alttaki bina çizimine yapışmasın */
  .brand-band { padding: 46px 0 42px; }
  .career--marka { padding: 52px 0 50px; }
  .career__slogan { font-size: 15px; }
  .brand-band__text { font-size: 15px; }
}

@media (max-width: 380px) {
  .header__inner { gap: 12px; }
  .brand__logotype { height: 36px; }
}

/* ==========================================================================
   Referans yerleşim (masaüstü) — ana sayfa + tüm sayfalardaki bölünmüş bölümler
   Görsel ve metin panelleri üst üste binmeden, aynı hizadan başlayarak yan yana
   durur; görsel hero'ya taşmaz. Mobil düzen (1080px ve altı) değişmez.
   ========================================================================== */
@media (min-width: 1081px) {
  /* Tipografi */
  .page-home main .kicker { font-size: 16px; letter-spacing: 0; margin-bottom: 24px; }
  .page-home main .h2 { font-size: 35px; line-height: 1.2; margin-bottom: 30px; }
  .page-home main .link-line { gap: 12px; font-size: 15px; letter-spacing: 2px; }
  .page-home main .link-line::before, .page-home main .link-line--both::after { width: 3.5em; }
  .page-home main .link-line:hover::before, .page-home main .link-line--both:hover::after { width: 4.5em; }

  /* Hero: içerik dikeyde ortada, yatay slayt çizgileri "Detaylı bilgi" bağlantısının altında */
  .page-home .hero { --hero-title: clamp(52px, 5.15vw, 74px); }
  .page-home .hero__content { padding-top: 0; }
  .page-home .hero__title { font-size: var(--hero-title); line-height: 1.2; margin-bottom: 30px; }
  .page-home .hero .link-line { font-size: 17px; color: var(--bronze); }
  .page-home .hero .link-line::before { background: var(--bronze); }
  .page-home .hero .link-line:hover { color: var(--bronze-light); }
  /* Slayt çizgileri hero'nun alt ortasında, alt kenardaki baklavanın hemen üstünde (çizgilerin ortası baklavanın
     ucundan ~36px yukarıda); baklavayla aynı eksende ve biraz daha geniş aralıkla */
  .page-home .hero__nav { bottom: 44px; }
  .page-home .hero__nav .dashes { justify-content: center; gap: 12px; }
  .page-home .hero__nav .dashes button { width: 34px; }
  .page-home .hero__scroll { display: none; }

  /* Bölünmüş bölümler (tüm sayfalar: ana sayfa, hakkımızda, ekibimiz, iletişim): ortak panel ölçüleri */
  .split .split__media { min-height: 0; }
  .split .split__text > .kicker { font-size: 16px; letter-spacing: 0; margin-bottom: 24px; }
  .split .split__text > .h2 { font-size: 35px; line-height: 1.2; margin-bottom: 30px; }
  .split .split__text > p:not(.kicker) { max-width: 600px; font-size: 16px; line-height: 1.6; color: #181818; margin-bottom: 60px; }
  .split .split__text > p:not(.kicker):has(+ p) { margin-bottom: 20px; }
  .split .split__text > .link-line { gap: 12px; font-size: 15px; letter-spacing: 2px; }
  .split .split__text > .link-line::before { width: 3.5em; }
  .split .split__text > .link-line:hover::before { width: 4.5em; }

  /* Panel yerine içerik belirir (beyaz panel sabit kalır) */
  .js .split__text.reveal { opacity: 1; transform: none; }
  .js .split__text.reveal > * { opacity: 0; transform: translateY(34px); transition: opacity .9s var(--ease), transform .9s var(--ease); }
  .js .split__text.reveal.is-visible > * { opacity: 1; transform: none; }

  /* Giriş (ana sayfa / hakkımızda): görsel sağda, metin paneli solda */
  .split--intro .split__text { padding: 120px 60px 120px var(--gutter); }

  /* Misyon, ekip anlayışı ve iletişim: görsel solda, metin paneli sağda */
  .split--mission .split__text,
  .split--contact .split__text { padding: 120px var(--gutter) 120px 60px; }
  .split--contact .split__text > p:not(.kicker) { margin-bottom: 30px; }
  /* Geniş ekranlarda kare fotoğraf aşırı kırpılmasın: görsel alanı en fazla 1,15:1 yatay olur */
  .split--contact .split__media--piyon { min-height: 43.5vw; }

  /* Çalışma alanları: başlık şeridi görselin alt kenarına biner */
  .page-home .section-head { margin-bottom: 30px; }
  .page-home .section-head .link-line { margin-bottom: 4px; }
  .page-home .cards { gap: 40px; }
  .page-home .card { background: #353535; }
  .page-home .card__body { padding: 0 32px 40px 30px; }
  .page-home .card__head { position: relative; min-height: 59px; gap: 12px; margin: -59px -32px 22px 0; padding-right: 23px; background: #353535; }
  .page-home .card__head .icon-square--sm { flex: none; width: 59px; height: 59px; }
  .page-home .card__head .icon-square--sm .ico { width: 30px; height: 30px; }
  .page-home .card h3 { font-size: 23px; }
  .page-home .card p { font-size: 16px; line-height: 1.6; color: rgba(255, 255, 255, .8); margin-bottom: 30px; }
  .page-home .card .link-line { font-size: 13px; }

  /* İlkeler: metin paneli solda, koyu panel sağda */
  .page-home .principles { grid-template-columns: 1fr 1fr; padding: 0; }
  .page-home .principles__text { padding: 120px 60px 120px var(--gutter); }
  .page-home .principles__panel {
    display: flex; flex-direction: column; justify-content: flex-end;
    padding: 120px var(--gutter) 120px 60px;
  }
  .page-home .services-grid { width: 100%; max-width: 480px; margin-left: 0; }
  .page-home .quote-slider .dashes { align-self: center; padding-top: 0; }
  .page-home .quote-slider__track { padding-right: 30px; }
  .page-home .dashes--vertical button::before { background: var(--bronze); }
  .page-home .dashes--vertical button.is-active::before { background: #181818; }
  .page-home .quote .h3 { font-size: 35px; line-height: 1.2; margin-bottom: 15px; }
  .page-home .quote blockquote { margin-bottom: 30px; }
  .page-home .quote blockquote p { font-size: 16px; line-height: 1.6; color: #181818; }
  .page-home .quote__mark { width: 56px; }

  /* Ekip */
  .page-home .team { padding-top: 120px; }
  .page-home .member__img { margin-bottom: 30px; }
  .page-home .member h3 { font-size: 23px; }
  .page-home .member p { font-size: 16px; color: #353535; }
}

/* ==========================================================================
   Görsel çerçeveleri ve bağlantısı — tüm sayfalardaki bölünmüş bölümler
   Görseller tam boy kalır; içlerinde ince bronz paspartu çerçevesi, metne doğru hafif bir gölge
   (derinlik) vardır. Görsellerin sayfa ortasına bakan köşelerinde bronz baklavalar durur:
   köşede buluşan görselleri doğrudan, aralarında başka bölüm olan görselleri ise ortadan inen
   ince bronz bir çizgiyle (içeriğin arkasından geçer) birbirine bağlar.
   Ana sayfa zinciri: hero ◇ giriş ◇ misyon ◇ — ilkeler ◇ — iletişim ◇ (çizgiler çalışma alanları ve ekip
   bölümlerinden geçer; son baklava iletişim görselinin sağ alt köşesinde).
   Ekibimiz:  sayfa başlığı ◇ — ekip anlayışı ◇ (çizgi avukat kartlarının arasından geçer; alttaki baklava
              görselin sağ alt köşesinde, footer'ın başında).
   İletişim:  sayfa başlığı ◇ — randevu ◇ (çizgi 2. ve 3. bilgi kartının arasından geçer; alttaki baklava
              randevu görselinin sağ alt köşesinde).
   Hakkımızda: sayfa başlığı ◇ giriş ◇ misyon ◇ — çalışma yöntemi ◇ (çizgi değer kartlarının arasından geçer).
   Çalışma Alanları: sayfa başlığının alt kenarında baklava.
   ========================================================================== */
.split__media::after,
.page-home .principles__panel::after {
  content: ""; position: absolute; inset: 26px; pointer-events: none;
  border: 1px solid rgba(179, 154, 126, .7);
}
.split--intro .split__media::after { border-color: rgba(140, 113, 86, .55); } /* açık mermer görselde koyu bronz */
@media (min-width: 1081px) {
  /* z-index: gölge komşu bölümün zemininin altında kalmasın */
  .split__media, .page-home .principles__panel { z-index: 1; }
  .split--intro .split__media,
  .page-home .principles__panel { box-shadow: -28px 0 50px -28px rgba(40, 28, 18, .5); }
  .split--mission .split__media,
  .split--contact .split__media { box-shadow: 28px 0 50px -28px rgba(40, 28, 18, .5); }

  /* Bağlantı baklavaları (bölüm sınırında, sayfanın tam ortasında) */
  .split--intro + .split--mission::before,
  .split--intro::before,
  .page-home .split--mission::after,
  .page-home .principles::before,
  .page-home .principles::after,
  .page-home .split--contact::before,
  .page-home .split--contact::after,
  .page-team .team::after,
  .page-team .split--mission::before,
  .page-team .split--mission::after,
  .page-contact .split--contact::before,
  .page-contact .split--contact::after,
  .page-about .split--mission::after,
  .page-about .process::after,
  .page-contact .info-cards::after,
  .page-practice .practice::after {
    content: ""; position: absolute; left: 50%; z-index: 3;
    width: 16px; height: 16px;
    background: var(--white); border: 1px solid var(--bronze);
    box-shadow: 0 0 0 6px var(--white);
  }
  /* bölümün üst kenarında */
  .split--intro + .split--mission::before,
  .split--intro::before,
  .page-home .principles::before,
  .page-home .split--contact::before,
  .page-team .team::after,
  .page-team .split--mission::before,
  .page-contact .split--contact::before,
  .page-about .process::after,
  .page-contact .info-cards::after,
  .page-practice .practice::after { top: 0; transform: translate(-50%, -50%) rotate(45deg); }
  .page-practice .practice { position: relative; }
  /* bölümün alt kenarında */
  .page-home .split--mission::after,
  .page-home .principles::after,
  .page-team .split--mission::after,
  .page-about .split--mission::after,
  .page-home .split--contact::after,
  .page-contact .split--contact::after { bottom: 0; transform: translate(-50%, 50%) rotate(45deg); }
  .page-home .principles { position: relative; }

  /* Aradaki bölümlerden geçen bağlantı çizgisi: z-index -1 ile kartların ve yazıların arkasında kalır */
  .page-home .practice,
  .page-home .team,
  .page-team .team,
  .page-about .values { position: relative; z-index: 0; }
  /* Ekibimiz: bölümün üst kenarındaki baklava, sayfa başlığının bronz çizgisinin (z-index 2) üstünde kalsın;
     bölümün zemini olmadığından katmanı yükseltmek alttaki görselin gölgesini örtmez */
  .page-team .team { z-index: 3; }
  .page-home .practice::before,
  .page-home .team::before,
  .page-team .team::before,
  .page-about .values::before,
  .page-contact .info-cards::before {
    content: ""; position: absolute; left: 50%; top: 0; bottom: 0; z-index: -1;
    width: 1px; background: rgba(140, 113, 86, .45);
  }
  /* bilgi kartları başlığın üstüne 70px taşar (ızgaranın eksi payı bölümün üst kenarını da yukarı çeker);
     baklava ve çizgi, koyu başlıkla açık zeminin birleştiği gerçek sınırdan başlar */
  .page-contact .info-cards::after,
  .page-contact .info-cards::before { top: 70px; }
  /* ortalı başlık: çizgi harflerin arasından geçmesin, başlığın üstünde ve altında kesilsin */
  .page-about .values .section-head--center > div { background: var(--white); padding: 0 28px; }
}
@media (max-width: 1080px) {
  .split__media::after,
  .page-home .principles__panel::after { inset: 14px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition-duration: .01ms !important; transition-delay: 0s !important; }
  .js .reveal { opacity: 1; transform: none; }
}