/* ==========================================================================
   ESA ÇEVRE DANIŞMANLIK — Tasarım Sistemi v3
   --------------------------------------------------------------------------
   YÖN: PREMIUM INDUSTRIAL CONSULTING

   v2'de sistem doğruydu ama sunum fazla "tasarım sistemi demosu"ydu:
   koyu/açık bant ritmi tekrarlıydı ve her bölüm aynı
   etiket + başlık + paragraf kalıbındaydı.

   v3'te değişen üç şey:

   1) FOTOĞRAF MERKEZE ALINDI
      Hero artık koyu bir kutu değil: solda dolu petrol paneli,
      sağda sayfa kenarına taşan tam boy fotoğraf alanı. Metin
      fotoğrafın üstünde durmadığı için gerçek fotoğraf geldiğinde
      perdeyle boğulmayacak. Yer tutucular orta tonlu "fotoğraf alanı"
      olarak işleniyor; kompozisyon şimdiden doğru okunuyor.

   2) RİTİM SEYRELDİ
      Koyu zemin yalnızca ÜÇ yerde: hero paneli, saha bandı, kapanış.
      Aradaki her şey açık zeminde; bölümler renkle değil kompozisyonla
      ayrışıyor.

   3) HER BÖLÜM FARKLI KONUŞUYOR
      Bazısında etiket yok, bazısı büyük ifadeyle açılıyor; sektörler
      gerçek bir kapsam matrisi, süreç kesintisiz bir yatay ray,
      hizmetler görsel önizlemeli editoryal dizin.

   AMBER ve MONO dozu düşürüldü: amber yalnızca aktif durum, marka
   işareti ve birincil eylem; mono yalnızca etiket, indeks ve veri.

   İÇİNDEKİLER
   00 Tokenlar · 01 Reset · 02 Tipografi · 03 Yerleşim
   04 Düğme/bağlantı · 05 Etiket · 06 Fotoğraf alanı
   07 Header · 08 Hero + istasyon rayı · 09 Tanım
   10 Ana hizmet · 11 Hizmet dizini · 12 Saha bandı
   13 Süreç rayı · 14 Sektör matrisi · 15 Bölgeler
   16 Bilgi merkezi · 17 SSS · 18 Kapanış · 19 Footer
   20 Hizmet sayfası bileşenleri · 21 Yardımcılar
   22 Hareket ve erişilebilirlik
   ========================================================================== */


/* ==========================================================================
   00 — TOKENLAR
   ========================================================================== */

:root {
  /* --- Nötrler: marka petrolüne meyilli soğuk mineral --- */
  --c-ink:        #0c2126;   /* en koyu zemin */
  --c-panel:      #103741;   /* hero paneli — ink'ten daha dolu */
  --c-brand:      #14505c;   /* marka petrolü, yapısal renk */
  --c-text:       #10232a;
  --c-muted:      #4a656e;   /* ikincil metin (AA) */
  --c-faint:      #6e878e;   /* üçüncül / mono etiket */
  --c-line:       #dae1e0;
  --c-line-2:     #c2cdcb;
  --c-paper:      #f1f4f3;   /* açık mineral zemin */
  --c-paper-2:    #e7ecea;
  --c-surface:    #ffffff;

  /* --- Fotoğraf alanı yer tutucusu --- */
  --c-slot:       #c6cfce;
  --c-slot-ink:   #3d5259;

  /* --- Aksan: GERÇEK ESA marka turuncusu ---
     Kaynak: assets/img/brand/esa-logo.png ("ESA ÇEVRE" kelime markası).
     Uydurulmuş bir renk değil, kurumsal kimlikten örneklendi.
     Beyaz üstünde 3.1:1 -> küçük metinde kullanılmaz; metin gerektiğinde
     --c-signal-dim (5.4:1) kullanılır. Düğmede koyu metinle eşlenir. */
  --c-signal:     #fc5f00;
  --c-signal-ink: #24100a;   /* turuncu üstünde okunabilir metin */
  --c-signal-dim: #b34300;   /* açık zeminde turuncu tonlu metin */

  /* --- Koyu zemin üstü --- */
  --c-on-dark:      rgba(255,255,255,.78);
  --c-on-dark-soft: rgba(255,255,255,.55);
  --c-line-dark:    rgba(255,255,255,.16);

  /* --- Tipografi --- */
  --ff: "Archivo", "Segoe UI", system-ui, -apple-system, Arial, sans-serif;
  --ff-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Consolas, monospace;

  /* Genişlik ekseni yalnızca en büyük anlarda; bölüm başlıkları daha sakin */
  --wd-hero: 110%;
  --wd-head: 104%;

  --fs-100: .6875rem;
  --fs-200: .75rem;
  --fs-300: .8125rem;
  --fs-400: .875rem;
  --fs-500: 1rem;
  --fs-600: 1.0625rem;
  --fs-lead: clamp(1.0625rem, .99rem + .34vw, 1.1875rem);

  --fs-h4: clamp(1.0625rem, 1.01rem + .24vw, 1.1875rem);
  --fs-h3: clamp(1.1875rem, 1.1rem + .45vw, 1.4375rem);
  --fs-h2: clamp(1.625rem, 1.35rem + 1.25vw, 2.375rem);
  --fs-h1: clamp(2.125rem, 1.55rem + 2.3vw, 3.375rem);
  --fs-statement: clamp(1.5rem, 1.2rem + 1.4vw, 2.25rem);

  --lh-tight: 1.07;
  --lh-snug: 1.22;
  --lh-body: 1.62;

  /* --- Aralık --- */
  --sp-1: .25rem;  --sp-2: .5rem;   --sp-3: .75rem;  --sp-4: 1rem;
  --sp-5: 1.25rem; --sp-6: 1.5rem;  --sp-8: 2rem;    --sp-10: 2.5rem;
  --sp-12: 3rem;   --sp-16: 4rem;   --sp-20: 5rem;

  --section-y: clamp(3.5rem, 6vw, 6rem);

  /* --- Yerleşim --- */
  --container: 82rem;
  --gutter: clamp(1.25rem, 4vw, 3.5rem);
  --measure: 62ch;

  /* Container kenarından ekran kenarına mesafe. Görselleri sayfa
     kenarına taşırmak için kullanılır. Grid sütununda calc(50% - 50vw)
     YANLIŞ sonuç verir (yüzde sütuna göre hesaplanır). */
  --bleed: calc((100vw - min(var(--container), 100vw)) / 2 + var(--gutter));

  --radius: 2px;

  --ease: cubic-bezier(.22, .61, .28, 1);
  --dur: 180ms;
  --dur-2: 340ms;

  --z-header: 100;
  --z-drawer: 200;

  /* Site tek temalıdır (açık). Bunu bildirmezsek tarayıcı, kullanıcının
     işletim sistemi koyu temadaysa form kontrollerini KOYU çizer ve
     input'lar okunamaz hale gelir. */
  color-scheme: light;
}


/* ==========================================================================
   01 — RESET
   ========================================================================== */

*, *::before, *::after { box-sizing: border-box; }

html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
  scroll-padding-top: 5.5rem;
}

body {
  margin: 0;
  background: var(--c-surface);
  color: var(--c-text);
  font-family: var(--ff);
  font-size: var(--fs-500);
  line-height: var(--lh-body);
  font-synthesis-weight: none;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-wrap: break-word;
  overflow-x: hidden;          /* yatay taşma sigortası */
}

img, svg, video, picture { display: block; max-width: 100%; }
img { height: auto; }

button, input, select, textarea { font: inherit; color: inherit; }
button { background: none; border: 0; }

ul, ol { margin: 0; padding: 0; list-style: none; }
dl, dd { margin: 0; }
h1, h2, h3, h4, h5, h6, p, figure, blockquote { margin: 0; }
table { border-collapse: collapse; }
hr { border: 0; border-top: 1px solid var(--c-line); margin: 0; }

a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: .18em; }

::selection { background: var(--c-brand); color: #fff; }

:focus-visible {
  outline: 2px solid var(--c-signal);
  outline-offset: 3px;
  border-radius: 1px;
}

.skip-link {
  position: absolute; left: -9999px; top: 0; z-index: 999;
  background: var(--c-ink); color: #fff;
  padding: var(--sp-3) var(--sp-5);
  font-size: var(--fs-400);
}
.skip-link:focus { left: var(--sp-4); top: var(--sp-4); }


/* ==========================================================================
   02 — TİPOGRAFİ
   ========================================================================== */

h1, h2, h3, h4 {
  font-weight: 700;
  letter-spacing: -.026em;
  line-height: var(--lh-snug);
  text-wrap: balance;
}
h1 { font-size: var(--fs-h1); line-height: var(--lh-tight); font-stretch: var(--wd-hero); letter-spacing: -.032em; }
h2 { font-size: var(--fs-h2); line-height: 1.12; font-stretch: var(--wd-head); }
h3 { font-size: var(--fs-h3); }
h4 { font-size: var(--fs-h4); letter-spacing: -.02em; }

p { text-wrap: pretty; }
p, li, dd, dt, td, th { font-stretch: normal; }

.lead {
  font-size: var(--fs-lead);
  line-height: 1.58;
  color: var(--c-muted);
  max-width: 52ch;
}

/* Büyük ifade — bölüm başlığı yerine geçtiği yerlerde */
.statement {
  font-size: var(--fs-statement);
  font-weight: 600;
  font-stretch: var(--wd-head);
  letter-spacing: -.028em;
  line-height: 1.22;
  text-wrap: balance;
}

.prose { max-width: var(--measure); }
.prose > * + * { margin-top: var(--sp-5); }
.prose a { color: var(--c-brand); }
.prose a:hover { color: var(--c-text); }

/* Mono yalnızca: etiket · indeks · metadata · veri */
.mono {
  font-family: var(--ff-mono);
  font-size: var(--fs-100);
  font-weight: 500;
  letter-spacing: .13em;
  text-transform: uppercase;
  font-stretch: normal;
}


/* ==========================================================================
   03 — YERLEŞİM
   ========================================================================== */

.container {
  width: 100%;
  max-width: var(--container);
  margin-inline: auto;
  padding-inline: var(--gutter);
}

.section { padding-block: var(--section-y); }
.section--tight { padding-block: clamp(2.5rem, 4.5vw, 4rem); }
.section--ruled { border-top: 1px solid var(--c-line); }
.section--paper { background: var(--c-paper); }
.section--dark { background: var(--c-ink); color: var(--c-on-dark); }
.section--dark h1, .section--dark h2, .section--dark h3, .section--dark h4 { color: #fff; }

/* Bölüm başlığı — varsayılan asimetrik kurulum.
   Her bölüm bunu kullanmaz; bazıları büyük ifadeyle veya tablo
   başlığıyla açılır. Kalıp tekrarı bilinçli olarak kırıldı. */
.section__head {
  display: grid;
  gap: var(--sp-5);
  margin-bottom: clamp(2rem, 3.5vw, 3rem);
}
@media (min-width: 62rem) {
  .section__head {
    grid-template-columns: minmax(0, 6fr) minmax(0, 5fr);
    gap: clamp(2rem, 6vw, 5rem);
    align-items: end;
  }
}
.section__head p { color: var(--c-muted); max-width: 52ch; }
.section--dark .section__head p { color: var(--c-on-dark); }

/* Bölüm başlığının ikinci varyantı: başlık solda, bağlantı sağda,
   altında kalın bir ayraç. Etiket+başlık+paragraf tekrarını kırar. */
.head-row {
  display: flex; flex-wrap: wrap; align-items: baseline;
  justify-content: space-between; gap: var(--sp-4);
  padding-bottom: var(--sp-5);
  border-bottom: 2px solid var(--c-text);
  margin-bottom: clamp(1.75rem, 3vw, 2.75rem);
}
.head-row__title { display: flex; align-items: baseline; gap: var(--sp-4); flex-wrap: wrap; }
.head-row .mono { color: var(--c-faint); white-space: nowrap; }


/* ==========================================================================
   04 — DÜĞMELER VE BAĞLANTILAR
   ========================================================================== */

.btn {
  display: inline-flex; align-items: center; gap: var(--sp-3);
  min-height: 3rem;
  padding: .875rem 1.5rem;
  border: 1px solid transparent;
  border-radius: var(--radius);
  font-size: var(--fs-400);
  font-weight: 600;
  letter-spacing: -.005em;
  text-decoration: none;
  cursor: pointer;
  transition: background-color var(--dur) var(--ease),
              border-color var(--dur) var(--ease),
              color var(--dur) var(--ease);
}
.btn svg { flex: none; transition: transform var(--dur) var(--ease); }
.btn:hover svg { transform: translateX(3px); }

.btn--signal { background: var(--c-signal); color: var(--c-signal-ink); }
.btn--signal:hover { background: #e05400; color: #fff; }

.btn--brand { background: var(--c-brand); color: #fff; }
.btn--brand:hover { background: var(--c-ink); }

.btn--ghost { border-color: var(--c-line-2); color: var(--c-text); }
.btn--ghost:hover { border-color: var(--c-text); background: var(--c-text); color: #fff; }

.btn--on-dark { border-color: rgba(255,255,255,.34); color: #fff; }
.btn--on-dark:hover { background: #fff; color: var(--c-ink); border-color: #fff; }

.btn--sm { min-height: 2.375rem; padding: .5rem 1rem; font-size: var(--fs-300); }

.link {
  display: inline-flex; align-items: center; gap: var(--sp-2);
  padding: .4375rem 0;
  font-size: var(--fs-400); font-weight: 600;
  text-decoration: none; color: var(--c-brand);
  background-image: linear-gradient(var(--c-line-2), var(--c-line-2));
  background-size: 100% 1px; background-repeat: no-repeat; background-position: 0 100%;
  transition: color var(--dur) var(--ease), background-size var(--dur-2) var(--ease);
}
.link:hover {
  color: var(--c-text);
  background-image: linear-gradient(var(--c-signal), var(--c-signal));
  background-size: 100% 2px;
}
.link svg { transition: transform var(--dur) var(--ease); }
.link:hover svg { transform: translateX(3px); }

.link--on-dark { color: #fff; background-image: linear-gradient(var(--c-line-dark), var(--c-line-dark)); }
.link--on-dark:hover { color: var(--c-signal); }


/* ==========================================================================
   05 — ETİKET
   ========================================================================== */

.eyebrow {
  display: block;
  font-family: var(--ff-mono);
  font-size: var(--fs-100);
  font-weight: 500;
  letter-spacing: .13em;
  text-transform: uppercase;
  color: var(--c-faint);
  margin-bottom: var(--sp-4);
}
.eyebrow::before {
  content: "";
  display: inline-block;
  width: 1.25rem; height: 1px;
  margin-right: var(--sp-3);
  vertical-align: middle;
  background: currentColor;
}
.eyebrow--on-dark { color: var(--c-on-dark-soft); }
.eyebrow--plain::before { display: none; }


/* ==========================================================================
   06 — FOTOĞRAF ALANI VE EDİTORYAL SAHNE
   --------------------------------------------------------------------------
   Gerçek fotoğraf yokken slot BOŞ BIRAKILMAZ: components/scene.php
   içindeki vektörel editoryal görsel çizilir. Sahne renkleri CSS
   değişkenlerinden gelir, böylece aynı çizim açık ve koyu bölümlerde
   iki ayrı tonda çalışır. 'src' verildiği anda sahne hiç basılmaz.
   ========================================================================== */

.imgslot {
  position: relative;
  margin: 0;
  aspect-ratio: var(--slot-ratio, 4 / 3);
  overflow: hidden;
  background: var(--c-paper-2);
}
.imgslot__img {
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: var(--slot-focus, 50% 50%);
}

.imgslot__art { position: absolute; inset: 0; }

/* Sahne — AÇIK zemin tonu (varsayılan) */
.scene {
  display: block;
  width: 100%; height: 100%;
  --sc-sky:    #e6ecea;
  --sc-ground: #d9e2e0;
  --sc-far:    #c3d0cf;
  --sc-mid:    #8fa6a9;
  --sc-near:   #2b4a53;
  --sc-line:   rgba(43,74,83,.20);
  --sc-paper:  #ffffff;
  --sc-acc:    var(--c-signal);
}

/* Sahne — KOYU zemin tonu. Aynı işaretleme, ters ton. */
.field .scene,
.cta-band .scene,
.drawer .scene {
  --sc-sky:    #0e2b33;
  --sc-ground: #10323a;
  --sc-far:    #17414b;
  --sc-mid:    #2a5d69;
  --sc-near:   #cbd8d7;
  --sc-line:   rgba(255,255,255,.14);
  --sc-paper:  #dde6e5;
}

/* Hero fotoğraf sütunu biraz daha doygun: sayfanın en güçlü görseli */
.hero__media .scene {
  --sc-sky:    #dde6e4;
  --sc-ground: #ccd8d6;
  --sc-far:    #aebfbe;
  --sc-mid:    #6d888d;
  --sc-near:   #17353f;
}

/* ==========================================================================
   07 — HEADER
   ========================================================================== */

/* Başlık artık AÇIK zeminde: gerçek çok renkli ESA logosu doğru
   ortamında duruyor ve site "gerçek kurumsal firma" gibi açılıyor.
   Yardımcı çubuk üstte koyu petrol şerit olarak kalıyor. */
.site-header {
  position: sticky; top: 0; z-index: var(--z-header);
  background: var(--c-surface);
  color: var(--c-text);
  border-bottom: 1px solid var(--c-line);
}
.site-header[data-scrolled="true"] { box-shadow: 0 6px 20px -14px rgba(12,33,38,.5); }
.site-header[data-scrolled="true"] .utilbar { display: none; }

.utilbar {
  background: var(--c-panel); color: var(--c-on-dark);
  font-size: var(--fs-200);
}
.utilbar__inner {
  display: flex; align-items: center; justify-content: space-between;
  gap: var(--sp-6); min-height: 2.375rem;
}
.utilbar__badge {
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .1em; text-transform: uppercase;
  line-height: 1.4; color: var(--c-on-dark-soft); min-width: 0;
}
.utilbar__badge::before {
  content: ""; display: inline-block;
  width: 5px; height: 5px; margin-right: var(--sp-2);
  vertical-align: middle; background: var(--c-signal);
}
.utilbar__list { display: flex; align-items: center; gap: var(--sp-6); flex: none; }
.utilbar__list a { white-space: nowrap; display: inline-flex; align-items: center; min-height: 2rem; }
.utilbar a { color: #fff; text-decoration: none; }
.utilbar a:hover { color: var(--c-signal); }
@media (max-width: 61.99rem) { .utilbar__hide-sm { display: none; } }
@media (max-width: 47.99rem) { .utilbar__inner { padding-block: var(--sp-2); } }

.navbar {
  display: flex; align-items: center; justify-content: space-between;
  gap: var(--sp-6); min-height: 4.25rem;
  transition: min-height var(--dur-2) var(--ease);
}
.site-header[data-scrolled="true"] .navbar { min-height: 3.5rem; }

/* Gerçek ESA logosu. Oran korunur; gölge/glow/gradient uygulanmaz. */
.brand { display: inline-flex; align-items: center; text-decoration: none; }
.brand__logo {
  width: auto;
  height: 2.75rem;                 /* 350x100 -> ~154x44 */
  transition: height var(--dur-2) var(--ease);
}
.site-header[data-scrolled="true"] .brand__logo { height: 2.375rem; }
.brand__logo--knockout { height: 2.5rem; }
@media (max-width: 29.99rem) { .brand__logo { height: 2.375rem; } }

.nav { display: none; }
@media (min-width: 62rem) { .nav { display: flex; align-items: center; gap: 2px; } }

.nav__item { position: relative; }
.nav__link {
  display: inline-flex; align-items: center; gap: var(--sp-2);
  padding: .625rem .75rem;
  font-size: var(--fs-400); font-weight: 500;
  color: var(--c-text); text-decoration: none;
  border-bottom: 2px solid transparent;
  transition: color var(--dur) var(--ease), border-color var(--dur) var(--ease);
}
.nav__link:hover { color: var(--c-brand); border-bottom-color: var(--c-line-2); }
.nav__link[aria-current="page"] { color: var(--c-brand); border-bottom-color: var(--c-signal); }
.nav__caret { transition: transform var(--dur) var(--ease); }
.nav__item[data-open="true"] .nav__link { color: var(--c-brand); }
.nav__item[data-open="true"] .nav__caret { transform: rotate(180deg); }

.mega {
  position: absolute; top: calc(100% + .5rem); left: 50%;
  transform: translateX(-50%) translateY(-4px);
  width: min(58rem, calc(100vw - 3rem));
  background: var(--c-panel);
  border: 1px solid var(--c-line-dark);
  box-shadow: 0 30px 60px -30px rgba(0,0,0,.7);
  padding: var(--sp-6) var(--sp-8) var(--sp-5);
  opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity var(--dur) var(--ease), transform var(--dur) var(--ease), visibility var(--dur);
}
.nav__item[data-open="true"] .mega {
  opacity: 1; visibility: visible; pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}
.mega__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.mega__col { padding-inline: var(--sp-5); border-left: 1px solid var(--c-line-dark); }
.mega__col:first-child { padding-left: 0; border-left: 0; }
.mega__col:last-child { padding-right: 0; }
.mega__title {
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .13em; text-transform: uppercase;
  color: var(--c-on-dark-soft); margin-bottom: var(--sp-4);
}
.mega__link {
  display: block; padding: .375rem 0;
  font-size: var(--fs-400); color: var(--c-on-dark); text-decoration: none;
  transition: color var(--dur) var(--ease), padding-left var(--dur) var(--ease);
}
.mega__link:hover { color: #fff; padding-left: 5px; }
.mega__foot {
  display: flex; align-items: center; justify-content: space-between;
  gap: var(--sp-4); margin-top: var(--sp-6); padding-top: var(--sp-5);
  border-top: 1px solid var(--c-line-dark);
  font-size: var(--fs-300); color: var(--c-on-dark-soft);
}

.nav-actions { display: flex; align-items: center; gap: var(--sp-3); }
@media (max-width: 29.99rem) { .nav-actions .btn { display: none; } }

.nav-toggle {
  display: inline-flex; flex-direction: column; justify-content: center; gap: 5px;
  width: 2.75rem; height: 2.75rem; padding: 0 .625rem;
  border: 1px solid var(--c-line-2); border-radius: var(--radius);
  cursor: pointer;
}
@media (min-width: 62rem) { .nav-toggle { display: none; } }
.nav-toggle span {
  display: block; height: 1.5px; background: var(--c-text);
  transition: transform var(--dur) var(--ease), opacity var(--dur) var(--ease);
}
.nav-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.nav-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }

.drawer {
  position: fixed; inset: 0; z-index: var(--z-drawer);
  background: var(--c-ink); color: var(--c-on-dark);
  padding: var(--sp-5) 0 var(--sp-16);
  overflow-y: auto; overscroll-behavior: contain;
  opacity: 0; visibility: hidden; transform: translateY(-6px);
  transition: opacity var(--dur) var(--ease), transform var(--dur) var(--ease), visibility var(--dur);
}
.drawer[data-open="true"] { opacity: 1; visibility: visible; transform: none; }
@media (min-width: 62rem) { .drawer { display: none; } }

.drawer__head {
  display: flex; align-items: center; justify-content: space-between;
  padding-bottom: var(--sp-4); border-bottom: 1px solid var(--c-line-dark);
  margin-bottom: var(--sp-5);
}
.drawer__close {
  width: 2.75rem; height: 2.75rem; display: grid; place-items: center;
  border: 1px solid var(--c-line-dark); border-radius: var(--radius);
  color: #fff; cursor: pointer;
}
.drawer__group { border-top: 1px solid var(--c-line-dark); padding-block: var(--sp-4); }
.drawer__group:first-of-type { border-top: 0; padding-top: 0; }
.drawer__label {
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .13em; text-transform: uppercase;
  color: var(--c-on-dark-soft); margin-bottom: var(--sp-3);
}
.drawer__link {
  display: flex; align-items: center; min-height: 2.75rem;
  font-size: 1rem; color: var(--c-on-dark); text-decoration: none;
}
.drawer__link--lg {
  font-size: 1.375rem; font-weight: 600;
  font-stretch: var(--wd-head); letter-spacing: -.02em; color: #fff;
  min-height: 3rem;
}
.drawer__actions { display: grid; gap: var(--sp-3); margin-top: var(--sp-6); }
.drawer__actions .btn { justify-content: center; }

body.is-locked { overflow: hidden; }


/* ==========================================================================
   08 — HERO
   --------------------------------------------------------------------------
   Solda dolu petrol paneli, sağda sayfa kenarına taşan tam boy fotoğraf.
   Metin fotoğrafın ÜSTÜNDE değil — gerçek fotoğraf geldiğinde perdeyle
   boğulmaz, tam gücüyle görünür. Mobilde fotoğraf en üste geçer.

   Üç istasyonun metni her zaman görünür; yalnızca fotoğraf değişir.
   ========================================================================== */

.hero { position: relative; background: var(--c-panel); color: #fff; }

.hero__grid { display: grid; }
@media (min-width: 62rem) {
  .hero__grid { grid-template-columns: minmax(0, 47fr) minmax(0, 53fr); align-items: stretch; }
}
/* Laptop aralığında panele daha fazla pay: metin sıkışmasın */
@media (min-width: 62rem) and (max-width: 81.99rem) {
  .hero__grid { grid-template-columns: minmax(0, 55fr) minmax(0, 45fr); }
}

/* --- Sol panel --- */
.hero__panel {
  position: relative;
  display: flex; flex-direction: column; justify-content: center;
  padding-block: clamp(2.5rem, 5vw, 5rem);
}
@media (min-width: 62rem) {
  .hero__panel {
    min-height: min(38rem, calc(100dvh - 6.5rem));
    padding-right: clamp(1.5rem, 4vw, 4rem);
  }
  /* Panel rengi container'ın solundan sayfa kenarına kadar uzar */
  .hero__panel::before {
    content: "";
    position: absolute; top: 0; bottom: 0; right: 0;
    left: calc(var(--bleed) * -1);
    background: var(--c-panel);
    z-index: 0;
  }
  .hero__panel > * { position: relative; z-index: 1; }
}
@supports not (height: 100dvh) {
  @media (min-width: 62rem) { .hero__panel { min-height: min(38rem, calc(100vh - 6.5rem)); } }
}

.hero h1 { color: #fff; max-width: 14ch; }
.hero__lead {
  margin-top: var(--sp-5);
  font-size: var(--fs-lead); line-height: 1.55;
  color: var(--c-on-dark);
  max-width: 42ch;
}
.hero__actions { display: flex; flex-wrap: wrap; gap: var(--sp-3); margin-top: var(--sp-8); }

.hero__trust {
  display: grid; gap: var(--sp-2) var(--sp-5);
  margin-top: clamp(2rem, 4vw, 3rem);
  padding-top: var(--sp-5);
  border-top: 1px solid var(--c-line-dark);
}
.hero__trust li {
  display: flex; align-items: center; gap: var(--sp-2);
  font-size: var(--fs-300); color: var(--c-on-dark-soft);
}
.hero__trust li::before {
  content: ""; width: 5px; height: 5px; flex: none; background: var(--c-signal);
}
@media (min-width: 30rem) and (max-width: 61.99rem) { .hero__trust { grid-template-columns: repeat(2, auto); justify-content: start; } }

/* --- Sağ fotoğraf sütunu --- */
.hero__media { position: relative; }
@media (max-width: 61.99rem) {
  /* Mobil: sayfa fotoğrafla açılır */
  .hero__media { order: -1; margin-inline: calc(var(--gutter) * -1); }
  .hero__frame { display: none; }
  .hero__frame[data-active="true"] { display: block; }
  .hero__frame .imgslot { aspect-ratio: 5 / 4; }
}
@media (min-width: 48rem) and (max-width: 61.99rem) {
  .hero__frame .imgslot { aspect-ratio: 2 / 1; }
}
@media (min-width: 62rem) {
  .hero__media { margin-right: calc(var(--bleed) * -1); margin-left: clamp(1.5rem, 3vw, 3rem); }
  .hero__frame {
    position: absolute; inset: 0;
    opacity: 0;
    transition: opacity 520ms var(--ease);
  }
  .hero__frame[data-active="true"] { opacity: 1; }
  .hero__frame .imgslot { position: absolute; inset: 0; aspect-ratio: auto; }
}

/* --- İstasyon rayı: hero'nun altında, AÇIK zeminde --- */
.stations { background: var(--c-surface); border-bottom: 1px solid var(--c-line); }
.stations__list { display: grid; }
@media (min-width: 48rem) { .stations__list { grid-template-columns: repeat(3, 1fr); } }

.station {
  position: relative; display: block;
  padding: var(--sp-5) var(--sp-6) var(--sp-5) 0;
  border-top: 1px solid var(--c-line);
  text-decoration: none; color: inherit;
  transition: background-color var(--dur) var(--ease);
}
.station:first-child { border-top: 0; }
@media (min-width: 48rem) {
  .station { border-top: 0; border-left: 1px solid var(--c-line); padding-left: var(--sp-6); }
  .station:first-child { border-left: 0; padding-left: 0; }
}
.station:hover { background: var(--c-paper); }

.station::after {
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: 2px;
  background: var(--c-signal);
  transform: scaleX(0); transform-origin: left;
  transition: transform var(--dur-2) var(--ease);
}
.station[data-active="true"]::after { transform: scaleX(1); }

.station__no, .station__title, .station__note { display: block; }
.station__no {
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .13em; color: var(--c-faint);
  transition: color var(--dur) var(--ease);
}
.station[data-active="true"] .station__no { color: var(--c-signal-dim); }
.station__title {
  margin-top: var(--sp-2);
  font-size: var(--fs-h4); font-weight: 600;
  font-stretch: var(--wd-head); letter-spacing: -.02em; line-height: 1.2;
}
.station__note {
  margin-top: var(--sp-2);
  font-size: var(--fs-300); line-height: 1.5; color: var(--c-muted);
  max-width: 36ch;
}


/* ==========================================================================
   09 — TANIM  (AEO çekirdeği)
   --------------------------------------------------------------------------
   Etiket+başlık+paragraf kalıbı yerine: büyük ifade solda, kurumsal
   tanım ve künye sağda tek sütunda akar.
   ========================================================================== */

.def { display: grid; gap: clamp(2rem, 4vw, 3.5rem); }
@media (min-width: 64rem) {
  .def { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(2.5rem, 6vw, 5.5rem); }
}
.def__statement {
  /* Bölüm başlığı olarak da çalışıyor: .statement ölçeğinden daha büyük */
  font-size: clamp(1.75rem, 1.25rem + 2.1vw, 3rem);
  letter-spacing: -.034em;
  line-height: 1.1;
  max-width: 12ch;
}
@media (min-width: 64rem) { .def > div:first-child { position: sticky; top: 7rem; align-self: start; } }
.def__body { color: var(--c-muted); max-width: 58ch; }

.facts { margin-top: clamp(1.75rem, 3vw, 2.5rem); border-top: 1px solid var(--c-line); }
.facts__row {
  display: grid; grid-template-columns: minmax(6.5rem, 9rem) 1fr;
  gap: var(--sp-4);
  padding-block: var(--sp-4);
  border-bottom: 1px solid var(--c-line);
  font-size: var(--fs-400);
}
.facts__k {
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .13em; text-transform: uppercase;
  color: var(--c-faint); padding-top: .2rem;
}
.facts__v { color: var(--c-text); }


/* ==========================================================================
   10 — ANA HİZMET
   --------------------------------------------------------------------------
   Fotoğraf sayfanın sol kenarına taşar; metin sağda ölçülü bir kolonda.
   Kart yok — maddeler ince satırlarla ayrılır.
   ========================================================================== */

/* Mobil/tablet varsayılanı önce tanımlanır; masaüstü kuralı sonra gelir,
   böylece aspect-ratio geri gelip height:100%'ü ezmez. */
.core { display: grid; gap: clamp(2rem, 4vw, 3rem); align-items: start; }
.core__media .imgslot { aspect-ratio: 3 / 2; }
@media (max-width: 63.99rem) {
  .core__media { margin-inline: calc(var(--gutter) * -1); }
}
@media (min-width: 64rem) {
  .core {
    grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
    gap: clamp(2.5rem, 5vw, 4.5rem);
    align-items: stretch;         /* fotoğraf metin yüksekliğine uzar */
  }
  .core__media { margin-left: calc(var(--bleed) * -1); }
  /* Sabit oran yerine sütun yüksekliği: altta ölü alan kalmıyor */
  .core__media .imgslot { height: 100%; aspect-ratio: auto; min-height: 32rem; }
}

.core__points { margin-top: clamp(1.75rem, 3vw, 2.25rem); border-top: 1px solid var(--c-line); }
.core__point { padding-block: var(--sp-6); border-bottom: 1px solid var(--c-line); }
.core__point h3 {
  font-size: var(--fs-h4); font-weight: 600;
  display: flex; align-items: baseline; gap: var(--sp-3);
}
.core__point h3::before {
  content: ""; width: .4375rem; height: .4375rem; flex: none; background: var(--c-signal);
}
.core__point p { margin-top: var(--sp-2); color: var(--c-muted); font-size: var(--fs-400); line-height: 1.6; }


/* ==========================================================================
   11 — HİZMET DİZİNİ
   --------------------------------------------------------------------------
   Kart galerisi değil, editoryal dizin — ve artık AÇIK zeminde:
   sayfanın ortası koyu bir bant değil. Bir satıra gelindiğinde yalnızca
   sağdaki fotoğraf değişir; tüm başlık ve açıklamalar her zaman görünür.
   ========================================================================== */

.xindex { display: grid; gap: clamp(2rem, 4vw, 3rem); }
@media (min-width: 68rem) {
  .xindex { grid-template-columns: minmax(0, 13fr) minmax(0, 8fr); gap: clamp(2.5rem, 5vw, 4.5rem); }
}

.xindex__list { border-top: 1px solid var(--c-line); }

.xrow {
  position: relative;
  display: grid;
  grid-template-columns: 2.25rem 1fr;
  align-items: baseline;
  gap: var(--sp-2) var(--sp-4);
  padding: var(--sp-6) 0;
  border-bottom: 1px solid var(--c-line);
  text-decoration: none; color: inherit;
}
@media (min-width: 48rem) {
  .xrow { grid-template-columns: 2.75rem minmax(0, 13.5rem) minmax(0, 1fr) auto; align-items: center; }
}
.xrow__no {
  font-family: var(--ff-mono); font-size: var(--fs-200);
  letter-spacing: .1em; color: var(--c-faint);
  transition: color var(--dur) var(--ease);
}
.xrow__label {
  font-size: clamp(1.0625rem, 1rem + .35vw, 1.25rem);
  font-weight: 600; font-stretch: var(--wd-head); letter-spacing: -.024em;
  transition: color var(--dur) var(--ease);
}
.xrow__note { grid-column: 2 / -1; font-size: var(--fs-300); line-height: 1.55; color: var(--c-muted); }
@media (min-width: 48rem) { .xrow__note { grid-column: auto; } }
.xrow__go { color: var(--c-line-2); transition: transform var(--dur) var(--ease), color var(--dur) var(--ease); }
@media (max-width: 47.99rem) { .xrow__go { display: none; } }

.xrow::before {
  content: ""; position: absolute;
  left: calc(var(--gutter) * -1); top: -1px; bottom: -1px;
  width: 3px; background: var(--c-signal);
  transform: scaleY(0);
  transition: transform var(--dur) var(--ease);
}
.xrow:hover::before, .xrow:focus-visible::before, .xrow[data-active="true"]::before { transform: scaleY(1); }
.xrow:hover .xrow__no, .xrow[data-active="true"] .xrow__no { color: var(--c-signal-dim); }
.xrow:hover .xrow__label { color: var(--c-brand); }
.xrow:hover .xrow__go { color: var(--c-brand); transform: translateX(4px); }

.xindex__preview { display: none; }
@media (min-width: 68rem) {
  .xindex__preview { display: block; position: sticky; top: 6.5rem; }
  .xindex__frame { position: relative; aspect-ratio: 4 / 5; background: var(--c-slot); }
  .xindex__frame .imgslot {
    position: absolute; inset: 0; aspect-ratio: auto;
    opacity: 0; transition: opacity var(--dur-2) var(--ease);
  }
  .xindex__frame .imgslot[data-active="true"] { opacity: 1; }
  .xindex__caption {
    margin-top: var(--sp-3);
    font-family: var(--ff-mono); font-size: var(--fs-100);
    letter-spacing: .13em; text-transform: uppercase; color: var(--c-faint);
  }
}


/* ==========================================================================
   12 — SAHA BANDI
   --------------------------------------------------------------------------
   Sayfanın büyük fotoğraf anı. Solda perde üzerinde tek bir ifade,
   sağda ekip fotoğrafı alanı — "bu işi kim yapıyor" sorusuna yer.
   ========================================================================== */

.field { position: relative; background: var(--c-ink); color: #fff; isolation: isolate; }
.field__media { position: absolute; inset: 0; z-index: -2; }
.field__media .imgslot { position: absolute; inset: 0; aspect-ratio: auto; }
.field__scrim {
  position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(78deg, rgba(12,33,38,.96) 0%, rgba(12,33,38,.88) 40%, rgba(12,33,38,.34) 100%);
}

.field__inner {
  position: relative;
  display: grid; gap: clamp(2rem, 4vw, 3rem);
  padding-block: clamp(3.5rem, 7vw, 6.5rem);
}
@media (min-width: 64rem) {
  .field__inner {
    grid-template-columns: minmax(0, 6fr) minmax(0, 4fr);
    align-items: end; gap: clamp(2.5rem, 6vw, 5rem);
  }
}
.field__body h2 { color: #fff; max-width: 16ch; }
.field__body p {
  margin-top: var(--sp-5);
  font-size: var(--fs-lead); line-height: 1.58; color: var(--c-on-dark);
  max-width: 46ch;
}

.field__team .imgslot { aspect-ratio: 4 / 5; }
/* Ekip sahnesi bandın zemininden bir tık açık: figürler öne çıksın */
.field__team .scene { --sc-sky: #14343c; --sc-ground: #173a43; --sc-mid: #33707d; }
.field__caption {
  margin-top: var(--sp-3);
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .13em; text-transform: uppercase; color: var(--c-on-dark-soft);
}
@media (max-width: 63.99rem) { .field__team { max-width: 18rem; } }


/* ==========================================================================
   13 — SÜREÇ RAYI
   --------------------------------------------------------------------------
   Beş kutu değil: kesintisiz bir yatay çizgi üzerinde beş durak.
   ========================================================================== */

.flow { position: relative; padding-top: 1px; }
.flow__track { display: grid; gap: var(--sp-8) var(--sp-6); }
@media (min-width: 44rem) { .flow__track { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 72rem) {
  .flow__track { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--sp-5); }
  .flow::before {
    content: ""; position: absolute; left: 0; right: 0; top: 0;
    height: 1px; background: var(--c-line-2);
  }
}

.flow__step { position: relative; padding-top: var(--sp-6); }
@media (max-width: 71.99rem) { .flow__step { border-top: 1px solid var(--c-line-2); } }
.flow__step::before {
  content: ""; position: absolute; top: -3px; left: 0;
  width: 7px; height: 7px; background: var(--c-signal);
}
.flow__no {
  font-family: var(--ff-mono); font-size: var(--fs-200);
  letter-spacing: .1em; color: var(--c-faint);
}
.flow__title { margin-top: var(--sp-2); font-size: var(--fs-h4); font-weight: 600; }
.flow__body { margin-top: var(--sp-3); font-size: var(--fs-300); line-height: 1.6; color: var(--c-muted); }


/* ==========================================================================
   14 — SEKTÖR MATRİSİ
   --------------------------------------------------------------------------
   Kart ızgarası değil, gerçek bir kapsam matrisi: hangi sektörde hangi
   yükümlülük öne çıkıyor. Veri config/taxonomy.php'den türetiliyor;
   danışmanlık raporlarındaki kapsam tablosuyla aynı okuma biçimi.
   Mobilde tablo yerine sektör başına liste gösterilir.
   ========================================================================== */

.matrix-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.matrix {
  width: 100%;
  min-width: 48rem;
  table-layout: fixed;          /* veri sütunları eşit genişlikte */
  border-top: 1px solid var(--c-text);
  font-size: var(--fs-300);
}
.matrix thead th:first-child, .matrix tbody th { width: 34%; }
.matrix th, .matrix td { text-align: left; vertical-align: top; }

.matrix thead th {
  padding: var(--sp-4) var(--sp-2);
  font-family: var(--ff-mono); font-size: var(--fs-100);
  font-weight: 500; letter-spacing: .1em; text-transform: uppercase;
  color: var(--c-faint);
  border-bottom: 1px solid var(--c-line-2);
  text-align: center;
}
.matrix thead th:first-child { padding-left: 0; text-align: left; }

.matrix tbody th {
  padding: var(--sp-5) var(--sp-4) var(--sp-5) 0;
  border-bottom: 1px solid var(--c-line);
  font-weight: 600;
}
.matrix__name { font-size: var(--fs-h4); letter-spacing: -.02em; display: block; }
.matrix__desc {
  display: block; margin-top: var(--sp-2);
  font-size: var(--fs-300); font-weight: 400; line-height: 1.55;
  color: var(--c-muted); max-width: 40ch;
}
.matrix tbody td {
  padding: var(--sp-5) var(--sp-2);
  border-bottom: 1px solid var(--c-line);
  text-align: center;
}
.matrix tbody tr:hover th, .matrix tbody tr:hover td { background: var(--c-paper); }

.matrix__mark { display: inline-block; width: .5rem; height: .5rem; background: var(--c-signal); }
.matrix__mark--off { background: var(--c-line-2); width: .3125rem; height: .3125rem; }
.matrix__legend {
  display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2) var(--sp-6);
  margin-top: var(--sp-5);
  font-size: var(--fs-300); color: var(--c-muted);
}
.matrix__legend span { display: inline-flex; align-items: center; gap: var(--sp-2); }

/* Mobil karşılığı */
.sector-list { border-top: 1px solid var(--c-text); }
.sector-item { padding-block: var(--sp-5); border-bottom: 1px solid var(--c-line); }
.sector-item h3 { font-size: var(--fs-h4); font-weight: 600; }
.sector-item p { margin-top: var(--sp-2); font-size: var(--fs-300); line-height: 1.55; color: var(--c-muted); }
.sector-item__links { display: flex; flex-wrap: wrap; gap: var(--sp-2) var(--sp-4); margin-top: var(--sp-3); }
.sector-item__links a {
  display: inline-block; padding: .375rem 0 .3125rem;
  font-size: var(--fs-300); font-weight: 500; color: var(--c-brand); text-decoration: none;
  box-shadow: inset 0 -1px 0 var(--c-line-2);
  transition: box-shadow var(--dur) var(--ease);
}
.sector-item__links a:hover { box-shadow: inset 0 -2px 0 var(--c-signal); }

@media (min-width: 62rem) { .sector-list { display: none; } }
@media (max-width: 61.99rem) { .matrix-wrap { display: none; } }


/* ==========================================================================
   15 — BÖLGELER
   --------------------------------------------------------------------------
   Kart değil: üstte bölgeye özgü editoryal görsel, altında bilgi.
   Çerçeve, gölge ve köşe yuvarlaması yok; öğeler ince bir çizgiyle ayrılır.
   Hover'da yalnızca görsel çok hafif yaklaşır ve başlık marka rengine döner.
   ========================================================================== */

.regions { display: grid; gap: clamp(2rem, 3.5vw, 3rem) clamp(1.5rem, 3vw, 2.75rem); }
@media (min-width: 52rem) { .regions { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 76rem) { .regions { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

.region__link { display: block; color: inherit; text-decoration: none; }

.region__visual {
  display: block;
  overflow: hidden;
  background: var(--c-paper-2);
}
.region__img { transition: transform 600ms var(--ease); }
.region__link:hover .region__img { transform: scale(1.035); }

.region__body { display: block; padding-top: var(--sp-4); border-top: 2px solid var(--c-text); margin-top: var(--sp-4); }

.region__name {
  display: flex; align-items: baseline; flex-wrap: wrap; gap: var(--sp-3);
  font-size: var(--fs-h4); font-weight: 700; letter-spacing: -.022em;
  transition: color var(--dur) var(--ease);
}
.region__link:hover .region__name { color: var(--c-brand); }
.region__hq {
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .1em; text-transform: uppercase; font-weight: 500;
  color: var(--c-signal-dim); border: 1px solid currentColor; padding: 1px 6px;
}
.region__zones {
  display: block; margin-top: var(--sp-3);
  font-size: var(--fs-300); line-height: 1.65; color: var(--c-text);
}
.region__note {
  display: block; margin-top: var(--sp-2);
  font-size: var(--fs-300); line-height: 1.55; color: var(--c-muted);
}
.region__go {
  display: inline-flex; align-items: center; gap: var(--sp-2);
  margin-top: var(--sp-4);
  font-size: var(--fs-300); font-weight: 600; color: var(--c-brand);
}
.region__go svg { transition: transform var(--dur) var(--ease); }
.region__link:hover .region__go svg { transform: translateX(3px); }

/* ==========================================================================
   16 — BİLGİ MERKEZİ
   ========================================================================== */

.insights { border-top: 1px solid var(--c-line); }
.insight {
  display: grid; gap: var(--sp-2);
  padding-block: var(--sp-5);
  border-bottom: 1px solid var(--c-line);
}
@media (min-width: 56rem) {
  .insight { grid-template-columns: minmax(0, 11rem) minmax(0, 1fr); gap: var(--sp-6); align-items: baseline; }
}
.insight__meta {
  display: flex; align-items: center; gap: var(--sp-2);
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .13em; text-transform: uppercase; color: var(--c-faint);
}
.insight__title { font-size: var(--fs-h4); font-weight: 600; max-width: 52ch; }

/* Kaynak bağlantısı — panelden yayımlanan kayıtlarda çıkar.
   İki sütunlu düzende başlığın altına, ikinci sütuna hizalanır;
   aksi hâlde ızgarada tarih sütununa düşerdi. */
.insight__src { font-size: var(--fs-200); }
.insight__src a { color: var(--c-muted); }
@media (min-width: 56rem) {
  .insight__src { grid-column: 2; margin-top: calc(var(--sp-2) * -1); }
}


/* ==========================================================================
   17 — SSS  (native <details>, JS'siz çalışır)
   ========================================================================== */

.faq { border-top: 1px solid var(--c-line); }
.faq__item { border-bottom: 1px solid var(--c-line); }
.faq__q {
  display: flex; align-items: flex-start; gap: var(--sp-4);
  padding: var(--sp-5) 0;
  font-size: var(--fs-h4); font-weight: 600;
  font-stretch: var(--wd-head); letter-spacing: -.02em;
  cursor: pointer; list-style: none;
  transition: color var(--dur) var(--ease);
}
.faq__q::-webkit-details-marker { display: none; }
.faq__q:hover { color: var(--c-brand); }
.faq__sign { position: relative; flex: none; width: 1rem; height: 1rem; margin: .35rem 0 0 auto; }
.faq__sign::before, .faq__sign::after {
  content: ""; position: absolute; background: var(--c-signal-dim);
  transition: transform var(--dur) var(--ease), opacity var(--dur) var(--ease);
}
.faq__sign::before { top: 50%; left: 0; width: 100%; height: 1.5px; transform: translateY(-50%); }
.faq__sign::after { left: 50%; top: 0; height: 100%; width: 1.5px; transform: translateX(-50%); }
.faq__item[open] .faq__sign::after { transform: translateX(-50%) rotate(90deg); opacity: 0; }
.faq__a { padding-bottom: var(--sp-6); max-width: var(--measure); color: var(--c-muted); font-size: var(--fs-400); line-height: 1.7; }


/* ==========================================================================
   18 — KAPANIŞ
   ========================================================================== */

.cta-band { position: relative; background: var(--c-ink); color: #fff; isolation: isolate; overflow: hidden; }
.cta-band__media { position: absolute; inset: 0; z-index: -2; }
.cta-band__media .imgslot { position: absolute; inset: 0; aspect-ratio: auto; }
.cta-band__scrim {
  position: absolute; inset: 0; z-index: -1;
  /* Örtü ARTIK DAHA HAFİF: altındaki görsel bir figür değil,
     soyut bir yapı dokusu. Ağır örtü onu tamamen yutuyordu —
     bant düz bir bloğa dönüşmüştü. Metnin durduğu sol taraf
     yine kapalı, sağ taraf dokuyu geçiriyor. */
  background: linear-gradient(96deg, rgba(12,33,38,.94) 0%, rgba(12,33,38,.86) 52%, rgba(12,33,38,.46) 100%);
}
.cta-band__inner {
  position: relative;
  display: grid; gap: var(--sp-8);
  padding-block: clamp(3.25rem, 6vw, 5.5rem);
}
@media (min-width: 60rem) {
  .cta-band__inner { grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); align-items: end; gap: clamp(2.5rem, 6vw, 5rem); }
}
.cta-band h2 { color: #fff; max-width: 18ch; }
.cta-band p { margin-top: var(--sp-5); color: var(--c-on-dark); max-width: 52ch; }
.cta-band__actions { display: flex; flex-direction: column; gap: var(--sp-4); }
.cta-band__actions .btn { justify-content: center; }
.cta-band__phone {
  display: flex; align-items: center; justify-content: center; gap: var(--sp-2);
  font-family: var(--ff-mono); font-size: var(--fs-300); letter-spacing: .04em;
  color: var(--c-on-dark); text-decoration: none; min-height: 2.5rem;
}
.cta-band__phone:hover { color: var(--c-signal); }


/* ==========================================================================
   19 — FOOTER
   ========================================================================== */

.site-footer { background: var(--c-ink); color: var(--c-on-dark); font-size: var(--fs-400); }
.footer__top { display: grid; gap: var(--sp-10); padding-block: clamp(3rem, 5vw, 4.25rem); }
@media (min-width: 48rem) { .footer__top { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 68rem) { .footer__top { grid-template-columns: minmax(0, 4fr) repeat(3, minmax(0, 3fr)); gap: var(--sp-8); } }

.footer__about { margin-top: var(--sp-5); font-size: var(--fs-300); line-height: 1.7; color: var(--c-on-dark-soft); max-width: 36ch; }
.footer__title {
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .13em; text-transform: uppercase;
  color: var(--c-on-dark-soft); margin-bottom: var(--sp-4);
}
.footer__list li + li { margin-top: .375rem; }
.footer__list a {
  display: inline-flex; align-items: center; min-height: 2.25rem;
  color: var(--c-on-dark); text-decoration: none; font-size: var(--fs-400);
  transition: color var(--dur) var(--ease);
}
.footer__list a:hover { color: var(--c-signal); }
@media (min-width: 30rem) and (max-width: 67.99rem) {
  .footer__list--split { columns: 2; column-gap: var(--sp-6); }
  .footer__list--split li { break-inside: avoid; }
}

.footer__contact, .footer__contact address { font-style: normal; line-height: 1.7; }
.footer__contact a {
  display: inline-flex; align-items: center; min-height: 2.5rem;
  color: #fff; text-decoration: none;
}
.footer__contact a:hover { color: var(--c-signal); }
.footer__contact dt {
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .1em; text-transform: uppercase;
  color: var(--c-faint); margin-top: var(--sp-4);
}
.footer__contact dt:first-child { margin-top: 0; }
.footer__contact dd { margin-top: 2px; }

.footer__bottom {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: var(--sp-4); padding-block: var(--sp-5);
  border-top: 1px solid var(--c-line-dark);
  font-size: var(--fs-300); color: var(--c-on-dark-soft);
}
.footer__legal { display: flex; flex-wrap: wrap; gap: var(--sp-5); }
.footer__legal a {
  display: inline-flex; align-items: center; min-height: 2.5rem;
  color: var(--c-on-dark-soft); text-decoration: none;
}
.footer__legal a:hover { color: #fff; }


/* ==========================================================================
   20 — HİZMET SAYFASI BİLEŞENLERİ
   (templates/service.php · templates/stub.php · 404.php)
   Bu faz bu şablonlara dokunmadı; sınıflar korunuyor.
   ========================================================================== */

.breadcrumb { padding-block: var(--sp-4); border-bottom: 1px solid var(--c-line); }
.breadcrumb__list { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2); }
.breadcrumb__item { display: flex; align-items: center; gap: var(--sp-2); font-size: var(--fs-300); color: var(--c-faint); }
.breadcrumb__item + .breadcrumb__item::before { content: "/"; color: var(--c-line-2); }
.breadcrumb a {
  display: inline-flex; align-items: center; min-height: 2rem;
  color: var(--c-muted); text-decoration: none;
}
.breadcrumb a:hover { color: var(--c-brand); }
.breadcrumb [aria-current="page"] { color: var(--c-text); }

.definition { display: grid; gap: clamp(2rem, 4vw, 3.5rem); }
@media (min-width: 62rem) { .definition { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); } }
.definition__body { color: var(--c-muted); max-width: 58ch; }

.chips { display: flex; flex-wrap: wrap; gap: var(--sp-2); }
.chip {
  display: inline-flex; align-items: center; min-height: 2.25rem;
  padding: .375rem .75rem;
  border: 1px solid var(--c-line-2); border-radius: var(--radius);
  font-size: var(--fs-300); font-weight: 500;
  color: var(--c-brand); text-decoration: none; background: var(--c-surface);
  transition: border-color var(--dur) var(--ease), color var(--dur) var(--ease);
}
.chip:hover { border-color: var(--c-brand); color: var(--c-text); }
.chip:not(a) { color: var(--c-muted); border-style: dashed; }
.chips__label {
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .13em; text-transform: uppercase;
  color: var(--c-faint); margin-bottom: var(--sp-3);
}

.deliverables { border-top: 1px solid var(--c-line-2); }
@media (min-width: 62rem) {
  .deliverables { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(2rem, 5vw, 4rem); }
}
.deliverable {
  display: grid; grid-template-columns: 2.5rem 1fr; gap: var(--sp-3);
  align-items: baseline; padding-block: var(--sp-5);
  border-bottom: 1px solid var(--c-line);
}
.deliverable__no { font-family: var(--ff-mono); font-size: var(--fs-100); letter-spacing: .12em; color: var(--c-signal-dim); }
.deliverable__text { font-size: var(--fs-600); letter-spacing: -.01em; }

.svc-row {
  position: relative; display: grid; gap: var(--sp-2);
  padding: var(--sp-5) 0; border-bottom: 1px solid var(--c-line);
  text-decoration: none; color: inherit;
}
@media (min-width: 48rem) {
  .svc-row { grid-template-columns: minmax(0, 4fr) minmax(0, 6fr) auto; align-items: center; gap: var(--sp-8); }
}
.svc-row::before {
  content: ""; position: absolute; left: calc(var(--gutter) * -1); top: 0; bottom: 0;
  width: 3px; background: var(--c-signal);
  transform: scaleY(0); transition: transform var(--dur) var(--ease);
}
.svc-row:hover::before, .svc-row:focus-visible::before { transform: scaleY(1); }
.svc-row__title { display: flex; align-items: center; gap: var(--sp-3); font-size: var(--fs-h4); font-weight: 600; }
.svc-row__title svg { color: var(--c-brand); flex: none; }
.svc-row__desc { font-size: var(--fs-400); color: var(--c-muted); line-height: 1.55; }
.svc-row__go { display: none; color: var(--c-faint); transition: transform var(--dur) var(--ease), color var(--dur) var(--ease); }
@media (min-width: 48rem) { .svc-row__go { display: block; } }
.svc-row:hover .svc-row__go { color: var(--c-brand); transform: translateX(4px); }


/* ==========================================================================
   20b — HİZMET PILLAR SAYFASI  (/hizmetler/cevre-danismanligi/)
   --------------------------------------------------------------------------
   Ana sayfanın tasarım dilini kullanır ama kopyası değildir:
   · Hero AÇIK zeminde (ana sayfa petrol paneliydi)
   · Kapsam iki sütunlu numaralı dizin
   · Süreç DİKEY ray (ana sayfada yataydı)
   · Bölgeler odak bloğu + kompakt liste
   Kart, gölge, gradient ve yuvarlak köşe yok.
   ========================================================================== */

/* --- Hero ------------------------------------------------------------- */
.svc-hero { padding-block: clamp(2.25rem, 4vw, 3.75rem) 0; }
.svc-hero__grid { display: grid; gap: clamp(2rem, 4vw, 3rem); align-items: center; }
@media (min-width: 64rem) {
  .svc-hero__grid { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: clamp(2.5rem, 5vw, 4.5rem); }
  .svc-hero__media { margin-right: calc(var(--bleed) * -1); }
}
@media (max-width: 63.99rem) {
  .svc-hero__media { margin-inline: calc(var(--gutter) * -1); }
  .svc-hero__media .imgslot { aspect-ratio: 16 / 10; }
}

.svc-hero h1 { max-width: 12ch; }
.svc-hero__lead {
  margin-top: var(--sp-5);
  font-size: var(--fs-lead); line-height: 1.6;
  color: var(--c-muted); max-width: 48ch;
}
.svc-hero__actions {
  display: flex; flex-wrap: wrap; align-items: center;
  gap: var(--sp-4) var(--sp-6);
  margin-top: var(--sp-8);
}
.svc-hero__phone {
  display: flex; flex-direction: column; gap: 2px;
  text-decoration: none; color: inherit;
  padding-left: var(--sp-5);
  border-left: 2px solid var(--c-signal);
}
.svc-hero__phone-label {
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .13em; text-transform: uppercase; color: var(--c-faint);
}
.svc-hero__phone-no {
  font-size: var(--fs-600); font-weight: 700; letter-spacing: -.01em;
  transition: color var(--dur) var(--ease);
}
.svc-hero__phone:hover .svc-hero__phone-no { color: var(--c-brand); }

.svc-hero__legal {
  margin-top: clamp(2rem, 3.5vw, 2.75rem);
  padding-top: var(--sp-4);
  border-top: 1px solid var(--c-line);
  font-size: var(--fs-300); color: var(--c-muted);
}
.svc-hero__legal .chips__label { display: block; margin-bottom: var(--sp-2); }

/* --- Tanım ------------------------------------------------------------ */
.svc-def { display: grid; gap: clamp(2rem, 4vw, 3.5rem); }
@media (min-width: 64rem) {
  .svc-def { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: clamp(2.5rem, 6vw, 5rem); }
  .svc-def > div:first-child { position: sticky; top: 7rem; align-self: start; }
}
.svc-def .statement { max-width: 18ch; }
/* İlk paragraf doğrudan cevaptır: gövdeden bir tık büyük ve koyu */
.svc-def__answer {
  font-size: var(--fs-lead); line-height: 1.6;
  color: var(--c-text); max-width: 54ch;
}
.svc-def__body { color: var(--c-muted); max-width: 54ch; }
.svc-def .facts { margin-top: 0; }

/* --- Yaklaşım (anlatı) ------------------------------------------------- */
.svc-what { display: grid; gap: clamp(2rem, 4vw, 3rem); align-items: start; }
@media (min-width: 64rem) {
  .svc-what { grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: clamp(2.5rem, 5vw, 4.5rem); }
}
@media (max-width: 63.99rem) { .svc-what__media { max-width: 22rem; } }

.svc-prose { max-width: 60ch; }
.svc-prose > p + p { margin-top: var(--sp-5); }
.svc-prose p { color: var(--c-muted); line-height: 1.72; }
/* Bağlam içi iç link — cümle akışını bozmadan görünür */
.svc-prose a {
  color: var(--c-brand); font-weight: 600; text-decoration: none;
  box-shadow: inset 0 -1px 0 var(--c-line-2);
  transition: box-shadow var(--dur) var(--ease), color var(--dur) var(--ease);
}
.svc-prose a:hover { color: var(--c-text); box-shadow: inset 0 -2px 0 var(--c-signal); }

/* --- Kapsam (8 madde) -------------------------------------------------- */
.scope { border-top: 1px solid var(--c-line-2); }
@media (min-width: 62rem) {
  .scope { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(2.5rem, 5vw, 4.5rem); }
}
.scope__item {
  display: grid; grid-template-columns: 2.75rem 1fr; gap: var(--sp-4);
  padding-block: var(--sp-6);
  border-bottom: 1px solid var(--c-line);
}
.scope__no {
  font-family: var(--ff-mono); font-size: var(--fs-200);
  letter-spacing: .1em; color: var(--c-signal-dim); padding-top: .15rem;
}
.scope__title { font-size: var(--fs-h4); font-weight: 600; }
.scope__text { margin-top: var(--sp-2); font-size: var(--fs-400); line-height: 1.62; color: var(--c-muted); }
.scope__link {
  display: inline-flex; align-items: center; gap: var(--sp-2);
  margin-top: var(--sp-3); padding-block: .5rem;
  font-size: var(--fs-300); font-weight: 600; color: var(--c-brand); text-decoration: none;
  box-shadow: inset 0 -1px 0 var(--c-line-2);
}
.scope__link:hover { box-shadow: inset 0 -2px 0 var(--c-signal); }
.scope__link svg { transition: transform var(--dur) var(--ease); }
.scope__link:hover svg { transform: translateX(3px); }

/* --- Süreç (dikey ray) ------------------------------------------------- */
.steps { position: relative; }
@media (min-width: 48rem) {
  /* Adımları birbirine bağlayan kesintisiz dikey çizgi */
  .steps::before {
    content: ""; position: absolute; top: .5rem; bottom: 3rem; left: 1.375rem;
    width: 1px; background: var(--c-line-2);
  }
}
.steps__item {
  position: relative;
  display: grid; grid-template-columns: 2.75rem 1fr; gap: var(--sp-4);
  padding-block: var(--sp-6);
  border-bottom: 1px solid var(--c-line);
}
.steps__item:last-child { border-bottom: 0; }
.steps__no {
  position: relative; z-index: 1;
  display: inline-flex; align-items: center; justify-content: center;
  width: 2.75rem; height: 2.75rem;
  background: var(--c-surface);
  border: 1px solid var(--c-line-2);
  font-family: var(--ff-mono); font-size: var(--fs-200);
  letter-spacing: .06em; color: var(--c-text);
}
.steps__title { font-size: var(--fs-h3); font-weight: 700; letter-spacing: -.024em; padding-top: .35rem; }
.steps__text { margin-top: var(--sp-3); font-size: var(--fs-400); line-height: 1.68; color: var(--c-muted); max-width: 58ch; }
.steps__out {
  display: inline-block; margin-top: var(--sp-4);
  padding-left: var(--sp-3); border-left: 3px solid var(--c-signal);
  font-size: var(--fs-300); font-weight: 600; color: var(--c-text);
}

/* --- Kimler için ------------------------------------------------------- */
.audience { border-top: 1px solid var(--c-line-2); }
@media (min-width: 62rem) {
  .audience { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(2.5rem, 5vw, 4.5rem); }
}
.audience__row { padding-block: var(--sp-6); border-bottom: 1px solid var(--c-line); }
.audience__name { font-size: var(--fs-h4); font-weight: 600; }
.audience__desc { margin-top: var(--sp-2); font-size: var(--fs-300); line-height: 1.6; color: var(--c-muted); max-width: 44ch; }
.audience__links { display: flex; flex-wrap: wrap; gap: var(--sp-2) var(--sp-4); margin-top: var(--sp-4); }
.audience__links a {
  display: inline-block; padding: .375rem 0 .3125rem;
  font-size: var(--fs-300); font-weight: 500; color: var(--c-brand); text-decoration: none;
  box-shadow: inset 0 -1px 0 var(--c-line-2);
  transition: box-shadow var(--dur) var(--ease);
}
.audience__links a:hover { box-shadow: inset 0 -2px 0 var(--c-signal); }

/* --- "Diğer Faaliyet Alanları" kartı (Faz 8.1) ---------------------------
   Sektör ızgarasının 7. kartı. Diğer kartlarla AYNI aileden: aynı ızgara,
   aynı tipografi, aynı hairline. Ayrımı yalnızca ince amber kertik ve
   örnek listesi kurar. Gradient, gölge, yuvarlak köşe ve yeni renk YOK. */
/* Kart, diğer 6 sektör kartıyla AYNI görsel sistemde: özel kutu, farklı
   zemin, gölge veya dikey vurgu çizgisi yok. Ayrımı yalnızca başlığın
   kendisi ve örnek listesi kuruyor. */
.audience__desc--other { max-width: 46ch; }

.audience__ex-label {
  margin-top: var(--sp-4);
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .13em; text-transform: uppercase; color: var(--c-muted);
}
.audience__ex {
  margin-top: var(--sp-2);
  border-top: 1px solid var(--c-line);
}
@media (min-width: 34rem) {
  .audience__ex {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: var(--sp-5);
  }
}
.audience__ex-item {
  padding-block: var(--sp-2);
  border-bottom: 1px solid var(--c-line);
  font-size: var(--fs-300); line-height: 1.5; color: var(--c-text);
}
/* Dokunma hedefi: .link zaten dikey dolgu taşıyor, burada da korunur */
.audience__ex-cta { margin-top: var(--sp-4); }

/* --- Bölgeler: odak bloğu + liste -------------------------------------- */
.coverage { display: grid; gap: clamp(2rem, 4vw, 3rem); }
@media (min-width: 64rem) {
  .coverage { grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: clamp(2.5rem, 5vw, 4.5rem); align-items: start; }
}
.coverage__focus { display: grid; gap: var(--sp-6); }
@media (min-width: 48rem) { .coverage__focus { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); align-items: start; } }
.coverage__focus-name {
  display: flex; align-items: baseline; flex-wrap: wrap; gap: var(--sp-3);
  font-size: var(--fs-h3); font-weight: 700; letter-spacing: -.024em;
}
.coverage__focus-text { margin-top: var(--sp-4); font-size: var(--fs-400); line-height: 1.68; color: var(--c-muted); }
.coverage__focus-text a {
  color: var(--c-brand); font-weight: 600; text-decoration: none;
  box-shadow: inset 0 -1px 0 var(--c-line-2);
}
.coverage__focus-text a:hover { box-shadow: inset 0 -2px 0 var(--c-signal); }
.coverage__focus-zones {
  margin-top: var(--sp-3); padding-top: var(--sp-3);
  border-top: 1px solid var(--c-line);
  font-size: var(--fs-300); line-height: 1.7; color: var(--c-text);
}
.coverage__focus-body .link { margin-top: var(--sp-4); }

.coverage__list { border-top: 2px solid var(--c-text); }
.coverage__item { border-bottom: 1px solid var(--c-line); }
.coverage__item a,
.coverage__item-plain {
  display: block; padding-block: var(--sp-4);
  color: inherit; text-decoration: none;
}
.coverage__item-name {
  display: block; font-size: var(--fs-h4); font-weight: 600;
  transition: color var(--dur) var(--ease);
}
.coverage__item a:hover .coverage__item-name { color: var(--c-brand); }
.coverage__item-zones {
  display: block; margin-top: var(--sp-2);
  font-size: var(--fs-300); line-height: 1.6; color: var(--c-muted);
}


/* ==========================================================================
   20c — ÖN DEĞERLENDİRME FORMU  (/teklif/)
   --------------------------------------------------------------------------
   Ana sayfanın dili korunur: hairline ayırıcı, mono etiket, keskin köşe,
   marka turuncusu yalnızca eylem ve hata işaretinde.
   Yuvarlak SaaS input, gölge, cam efekti ve gradient YOK.
   Girdi alanları alt çizgili — kutu yığını yerine form föyü hissi.
   ========================================================================== */

.quote { display: grid; gap: clamp(2.5rem, 5vw, 4rem); }
@media (min-width: 64rem) {
  .quote { grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: clamp(3rem, 6vw, 5.5rem); }
  .quote__aside { position: sticky; top: 7rem; align-self: start; }
}

.quote h1 { max-width: 14ch; }
.quote__lead {
  margin-top: var(--sp-5);
  font-size: var(--fs-400); line-height: 1.68; color: var(--c-muted);
  max-width: 42ch;
}

/* Bölüm göstergesi — sihirbaz değil, içindekiler listesi */
.quote__steps {
  margin-top: clamp(2rem, 3.5vw, 2.75rem);
  border-top: 1px solid var(--c-line);
}
.quote__step {
  display: flex; align-items: baseline; gap: var(--sp-3);
  padding-block: var(--sp-3);
  border-bottom: 1px solid var(--c-line);
}
.quote__step-no {
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .13em; color: var(--c-signal-dim);
}
.quote__step-label { font-size: var(--fs-400); font-weight: 600; }

.quote__contact { margin-top: clamp(2rem, 3.5vw, 2.75rem); }
.quote__contact p { margin-top: var(--sp-2); }
.quote__phone {
  display: inline-flex; align-items: center; min-height: 2.75rem;
  font-size: var(--fs-h3); font-weight: 700; letter-spacing: -.024em;
  color: inherit; text-decoration: none;
  transition: color var(--dur) var(--ease);
}
.quote__phone:hover { color: var(--c-brand); }
.quote__hours { font-size: var(--fs-300); color: var(--c-muted); }

/* --- Genel form bildirimi --------------------------------------------- */
.formnote {
  padding: var(--sp-4) var(--sp-5);
  margin-bottom: var(--sp-6);
  border-left: 3px solid var(--c-signal);
  background: var(--c-paper);
  font-size: var(--fs-400);
}
.formnote--error { border-left-color: #c0341a; }
.formnote p { margin: 0; }

/* --- Bölümler ---------------------------------------------------------- */
.form__block {
  margin: 0 0 clamp(2rem, 3.5vw, 3rem);
  padding: 0 0 clamp(1.5rem, 2.5vw, 2rem);
  border: 0;
  border-bottom: 1px solid var(--c-line);
}
.form__block--invalid { border-bottom-color: #c0341a; }

.form__legend {
  display: flex; align-items: baseline; gap: var(--sp-3);
  width: 100%; padding: 0 0 var(--sp-5);
  margin-bottom: var(--sp-2);
  border-bottom: 2px solid var(--c-text);
}
.form__legend-no {
  font-family: var(--ff-mono); font-size: var(--fs-200);
  letter-spacing: .1em; color: var(--c-signal-dim);
}
.form__legend-text {
  font-size: var(--fs-h4); font-weight: 700;
  font-stretch: var(--wd-head); letter-spacing: -.022em;
}
.form__hint { margin-top: var(--sp-4); font-size: var(--fs-300); color: var(--c-muted); }

.form__grid { display: grid; gap: var(--sp-5) clamp(1.5rem, 3vw, 2.5rem); margin-top: var(--sp-5); }
@media (min-width: 40rem) { .form__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.ff--full { grid-column: 1 / -1; }

/* --- Alanlar ----------------------------------------------------------- */
.ff { display: flex; flex-direction: column; gap: var(--sp-2); margin: 0; }
.ff__label {
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .13em; text-transform: uppercase; color: var(--c-muted);
}
.ff__req { color: var(--c-signal-dim); }

/* Kutu değil, alt çizgili giriş alanı — form föyü karakteri */
.ff__input {
  width: 100%;
  min-height: 2.875rem;
  padding: .625rem 0;
  border: 0;
  border-bottom: 1px solid var(--c-line-2);
  border-radius: 0;
  background: transparent;
  color: var(--c-text);
  font-size: var(--fs-600);
  transition: border-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
  appearance: none;
}
.ff__input::placeholder { color: var(--c-faint); }
.ff__input:hover { border-bottom-color: var(--c-muted); }
.ff__input:focus {
  outline: none;
  border-bottom-color: var(--c-brand);
  box-shadow: inset 0 -2px 0 var(--c-brand);
}
.ff__input:focus-visible { outline: 2px solid var(--c-signal); outline-offset: 4px; }

/* Select için ok işareti (satır içi SVG data URI — ek istek yok) */
.ff__select {
  padding-right: 1.75rem;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5' fill='none' stroke='%234a656e' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right .25rem center;
}
.ff__textarea { min-height: 6rem; line-height: 1.6; resize: vertical; padding-top: .75rem; }

.ff__meta { display: flex; justify-content: flex-end; }
.ff__count { font-family: var(--ff-mono); font-size: var(--fs-100); color: var(--c-faint); }

.ff__error { font-size: var(--fs-300); font-weight: 600; color: #c0341a; }
.ff--invalid .ff__input { border-bottom-color: #c0341a; }
.ff--invalid .ff__label { color: #c0341a; }

/* Honeypot — ekrandan ve ekran okuyucudan uzakta, display:none DEĞİL
   (bazı botlar display:none alanları atlar) */
.form__trap {
  position: absolute !important;
  left: -9999px; top: auto;
  width: 1px; height: 1px; overflow: hidden;
}

/* --- Onay kutuları ----------------------------------------------------- */
.checks { display: grid; gap: 0; margin-top: var(--sp-5); border-top: 1px solid var(--c-line); }
@media (min-width: 40rem) {
  .checks { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(1.5rem, 3vw, 2.5rem); }
}
.check {
  display: flex; align-items: center; gap: var(--sp-3);
  min-height: 3rem; padding-block: var(--sp-2);
  border-bottom: 1px solid var(--c-line);
  cursor: pointer;
}
.check__input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.check__box {
  flex: none; width: 1.25rem; height: 1.25rem;
  border: 1px solid var(--c-line-2);
  background: var(--c-surface);
  transition: background-color var(--dur) var(--ease), border-color var(--dur) var(--ease);
}
.check:hover .check__box { border-color: var(--c-muted); }
.check__input:checked + .check__box {
  background: var(--c-signal); border-color: var(--c-signal);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='11' viewBox='0 0 14 11'%3E%3Cpath d='M1 5.5 5 9.5 13 1.5' fill='none' stroke='%23241000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: center;
}
.check__input:focus-visible + .check__box { outline: 2px solid var(--c-signal); outline-offset: 3px; }
.check__label { font-size: var(--fs-400); }

/* --- Gönderim ve yasal bilgi ------------------------------------------- */
.form__submit {
  display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-4) var(--sp-6);
  margin-top: var(--sp-8);
}
.form__required-note { font-size: var(--fs-300); color: var(--c-muted); }
[data-submit][aria-disabled="true"] { opacity: .6; pointer-events: none; }

.form__legal {
  margin-top: clamp(2rem, 3.5vw, 2.75rem);
  padding-top: var(--sp-5);
  border-top: 1px solid var(--c-line);
  font-size: var(--fs-300); line-height: 1.7; color: var(--c-muted);
  max-width: 62ch;
}
.form__legal a { color: var(--c-brand); }

/* --- Başarı sayfası ---------------------------------------------------- */
.done { display: grid; gap: clamp(2.5rem, 5vw, 4rem); }
@media (min-width: 64rem) {
  .done { grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: clamp(3rem, 6vw, 5rem); }
}
.done h1 { max-width: 18ch; }
/* Onay işareti: başlığın üstünde ince bir marka çubuğu */
.done__body .eyebrow::before { background: var(--c-signal); height: 3px; }
.done__lead {
  margin-top: var(--sp-5);
  font-size: var(--fs-lead); line-height: 1.6; color: var(--c-muted); max-width: 52ch;
}
.done__facts { margin-top: clamp(2rem, 3.5vw, 2.75rem); max-width: 34rem; }
.done__ref {
  font-family: var(--ff-mono); font-size: var(--fs-400);
  letter-spacing: .06em; color: var(--c-text);
}
.done__links { border-top: 1px solid var(--c-line); }
.done__links li { border-bottom: 1px solid var(--c-line); }
.done__links a {
  display: flex; align-items: center; min-height: 2.75rem;
  font-size: var(--fs-400); color: inherit; text-decoration: none;
  transition: color var(--dur) var(--ease);
}
.done__links a:hover { color: var(--c-brand); }


/* ==========================================================================
   20d — PILLAR EK BÖLÜMLERİ
   --------------------------------------------------------------------------
   Yalnızca ilgili kayda sahip pillar sayfalarda basılır.
   · .compare  iki hizmeti yan yana koyan karşılaştırma
   · .phase    başvuru sürecini evrelere bölen ray
   Çevre Danışmanlığı sayfası bu bölümleri KULLANMAZ; böylece iki pillar
   sayfa aynı kompozisyonu tekrar etmiyor.
   ========================================================================== */

/* --- Karşılaştırma ----------------------------------------------------- */
.compare { display: grid; gap: clamp(2rem, 4vw, 3rem); border-top: 1px solid var(--c-line-2); }
@media (min-width: 56rem) {
  .compare { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; }
  /* İki sütun arasında tek hairline — kutu/çerçeve yok */
  .compare__col + .compare__col {
    border-left: 1px solid var(--c-line);
    padding-left: clamp(2rem, 4vw, 3.5rem);
  }
  .compare__col:first-child { padding-right: clamp(2rem, 4vw, 3.5rem); }
}
.compare__col { padding-top: var(--sp-6); }
/* Ana konu olan sütun üstte marka çubuğuyla işaretlenir */
.compare__col--primary { box-shadow: inset 0 3px 0 var(--c-signal); }

.compare__tag {
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .13em; text-transform: uppercase; color: var(--c-faint);
}
.compare__name {
  margin-top: var(--sp-3);
  font-size: var(--fs-h3); font-weight: 700;
  font-stretch: var(--wd-head); letter-spacing: -.024em;
}
.compare__desc {
  margin-top: var(--sp-3);
  font-size: var(--fs-400); line-height: 1.68; color: var(--c-muted); max-width: 42ch;
}
.compare__rows { margin-top: var(--sp-5); border-top: 1px solid var(--c-line); }
.compare__row {
  display: grid; grid-template-columns: minmax(6rem, 8rem) 1fr; gap: var(--sp-4);
  padding-block: var(--sp-4);
  border-bottom: 1px solid var(--c-line);
  font-size: var(--fs-300);
}
.compare__row dt {
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .13em; text-transform: uppercase; color: var(--c-faint);
  padding-top: .15rem;
}
.compare__row dd { color: var(--c-text); }
.compare__col .link { margin-top: var(--sp-5); }

.compare__note {
  max-width: 68ch;
  font-size: var(--fs-400); line-height: 1.7; color: var(--c-muted);
}
.compare__note a {
  color: var(--c-brand); font-weight: 600; text-decoration: none;
  box-shadow: inset 0 -1px 0 var(--c-line-2);
  transition: box-shadow var(--dur) var(--ease), color var(--dur) var(--ease);
}
.compare__note a:hover { color: var(--c-text); box-shadow: inset 0 -2px 0 var(--c-signal); }

/* --- Evreli süreç rayı -------------------------------------------------- */
.phase { margin-top: clamp(2rem, 3.5vw, 3rem); }
.phase:first-of-type { margin-top: 0; }

.phase__head {
  display: grid; gap: var(--sp-2);
  padding-bottom: var(--sp-4);
  border-bottom: 2px solid var(--c-text);
}
@media (min-width: 56rem) {
  .phase__head {
    grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
    align-items: baseline; gap: var(--sp-6);
  }
}
.phase__name {
  font-size: var(--fs-h4); font-weight: 700;
  font-stretch: var(--wd-head); letter-spacing: -.022em;
}
.phase__note { font-size: var(--fs-300); color: var(--c-muted); }

.phase__steps { margin-top: var(--sp-2); }
.phase__step {
  display: grid; grid-template-columns: 2.75rem 1fr; gap: var(--sp-4);
  padding-block: var(--sp-5);
  border-bottom: 1px solid var(--c-line);
}
.phase__no {
  font-family: var(--ff-mono); font-size: var(--fs-200);
  letter-spacing: .1em; color: var(--c-signal-dim); padding-top: .15rem;
}
.phase__title { font-size: var(--fs-h4); font-weight: 600; }
.phase__text {
  margin-top: var(--sp-2);
  font-size: var(--fs-400); line-height: 1.68; color: var(--c-muted); max-width: 62ch;
}
.phase__text a {
  color: var(--c-brand); font-weight: 600; text-decoration: none;
  box-shadow: inset 0 -1px 0 var(--c-line-2);
  transition: box-shadow var(--dur) var(--ease), color var(--dur) var(--ease);
}
.phase__text a:hover { color: var(--c-text); box-shadow: inset 0 -2px 0 var(--c-signal); }

/* --- Bölgeler: odak bloğu olmayan varyant ------------------------------- */
@media (min-width: 64rem) {
  .coverage--list-only { grid-template-columns: 1fr; }
  .coverage--list-only .coverage__list {
    display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
    column-gap: clamp(2rem, 4vw, 3.5rem);
    border-top: 0;
  }
  .coverage--list-only .coverage__item:nth-child(-n+3) { border-top: 2px solid var(--c-text); }
}
@media (min-width: 48rem) and (max-width: 63.99rem) {
  .coverage--list-only .coverage__list {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: var(--sp-8);
  }
}


/* ==========================================================================
   20e — HİZMET MERKEZİ  (/hizmetlerimiz/)
   --------------------------------------------------------------------------
   Bu sayfa bir dizindir, bir landing page değil. Bu yüzden ana sayfanın
   ve pillar sayfaların araçlarını KULLANMAZ:
     · petrol hero paneli yok      · sahne görseli / fotoğraf alanı yok
     · kart ızgarası yok           · reveal animasyonu yok
   Onun yerine teknik bir kılavuzun ön sayfası mantığı:
     künye + içindekiler -> kesintisiz numaralı satırlar -> taksonomi.
   Ağırlık farkı veriden gelir: ayrıntılı rehberi olan hizmet öne çıkar.
   ========================================================================== */

/* --- A. Künye ----------------------------------------------------------- */
.hub-head { padding-block: clamp(2.25rem, 4vw, 3.75rem) clamp(2rem, 3.5vw, 3rem); }
/* Künyeden hemen sonra gelen ilk grup: iki bölümün dolgusu üst üste
   binip ~10rem'lik ölü bir bant bırakıyordu. */
.hub-head + .dirgroup { padding-top: clamp(2.25rem, 4vw, 3.5rem); }
.hub-head__grid { display: grid; gap: clamp(2.25rem, 4vw, 3.5rem); }
@media (min-width: 64rem) {
  .hub-head__grid {
    grid-template-columns: minmax(0, 7fr) minmax(0, 4fr);
    gap: clamp(3rem, 6vw, 5.5rem);
    align-items: start;
  }
}

.hub-head h1 { max-width: 14ch; }
.hub-head__answer {
  margin-top: var(--sp-6);
  font-size: var(--fs-lead); line-height: 1.6;
  color: var(--c-text); max-width: 58ch;
}
.hub-head__note {
  margin-top: var(--sp-5);
  font-size: var(--fs-400); line-height: 1.7;
  color: var(--c-muted); max-width: 54ch;
}
.hub-head__note a {
  color: var(--c-brand); font-weight: 600; text-decoration: none;
  box-shadow: inset 0 -1px 0 var(--c-line-2);
  transition: box-shadow var(--dur) var(--ease), color var(--dur) var(--ease);
}
.hub-head__note a:hover { color: var(--c-text); box-shadow: inset 0 -2px 0 var(--c-signal); }

/* Sayaç şeridi — dört değer de config'ten sayılır, elle yazılmaz */
.hub-head__meta {
  display: flex; flex-wrap: wrap; align-items: center;
  gap: var(--sp-2) var(--sp-4);
  margin-top: clamp(1.75rem, 3vw, 2.5rem);
  padding-top: var(--sp-4);
  border-top: 1px solid var(--c-line);
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .1em; text-transform: uppercase; color: var(--c-muted);
}
/* Ayraç sonraki değerin SOLUNA değil, önceki değerin SAĞINA bağlanır;
   şerit sarınca yeni satır ayraçla başlamaz. */
.hub-head__meta span { display: inline-flex; align-items: center; }
.hub-head__meta span:not(:last-child)::after {
  content: ""; width: 1px; height: .8125rem;
  margin-left: var(--sp-4); background: var(--c-line-2);
}

/* İçindekiler — dizin olduğunu ilk ekranda söyleyen asıl işaret */
.hub-toc__list { margin-top: var(--sp-4); border-top: 2px solid var(--c-text); }
.hub-toc__item { border-bottom: 1px solid var(--c-line); }
.hub-toc__item a {
  display: grid; grid-template-columns: 2.25rem minmax(0, 1fr) auto;
  align-items: baseline; gap: var(--sp-3);
  padding-block: var(--sp-4);
  color: inherit; text-decoration: none;
}
.hub-toc__no {
  font-family: var(--ff-mono); font-size: var(--fs-200);
  letter-spacing: .08em; color: var(--c-signal-dim);
}
.hub-toc__name {
  font-size: var(--fs-500); font-weight: 600; letter-spacing: -.012em;
  transition: color var(--dur) var(--ease);
}
.hub-toc__item a:hover .hub-toc__name { color: var(--c-brand); }
.hub-toc__count {
  font-family: var(--ff-mono); font-size: var(--fs-200); color: var(--c-muted);
}

/* --- B. Dizin: grup başlığı --------------------------------------------- */
.dirgroup__head {
  display: grid; gap: var(--sp-3);
  padding-bottom: var(--sp-5);
  border-bottom: 2px solid var(--c-text);
  margin-bottom: var(--sp-2);
}
@media (min-width: 48rem) {
  .dirgroup__head {
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: baseline; gap: var(--sp-6);
  }
}
/* Dar ekranda "01" tek başına bir satır harcıyordu; başlığın yanına alınır. */
@media (max-width: 47.99rem) {
  .dirgroup__head { grid-template-columns: auto minmax(0, 1fr); align-items: baseline; }
  .dirgroup__count { grid-column: 2; }
}
.dirgroup__no {
  font-family: var(--ff-mono);
  font-size: clamp(1.5rem, 1.1rem + 1.6vw, 2.25rem);
  line-height: 1; letter-spacing: -.02em;
  color: var(--c-brand);
}
.dirgroup__desc {
  margin-top: var(--sp-2);
  font-size: var(--fs-400); color: var(--c-muted); max-width: 56ch;
}
.dirgroup__count {
  font-family: var(--ff-mono); font-size: var(--fs-200);
  letter-spacing: .1em; text-transform: uppercase;
  color: var(--c-muted); white-space: nowrap;
}

/* --- B. Dizin: satır ---------------------------------------------------- */
.dirow {
  display: grid;
  grid-template-columns: 2.5rem minmax(0, 1fr);
  column-gap: var(--sp-4);
  padding-block: var(--sp-6);
  border-bottom: 1px solid var(--c-line);
}
.dirow__no {
  grid-column: 1; grid-row: 1;
  font-family: var(--ff-mono); font-size: var(--fs-200);
  letter-spacing: .1em; color: var(--c-signal-dim); padding-top: .3rem;
}
.dirow__main { grid-column: 2; grid-row: 1; }
.dirow__side { grid-column: 2; grid-row: 2; margin-top: var(--sp-4); }

@media (min-width: 64rem) {
  .dirow {
    grid-template-columns: 3rem minmax(0, 1fr) 15rem;
    column-gap: clamp(1.5rem, 3vw, 2.75rem);
  }
  .dirow__side { grid-column: 3; grid-row: 1; margin-top: 0; }
}

.dirow__title { font-size: var(--fs-h4); font-weight: 600; letter-spacing: -.014em; }
.dirow__title a {
  color: inherit; text-decoration: none;
  box-shadow: inset 0 -1px 0 transparent;
  transition: color var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.dirow__title a:hover { color: var(--c-brand); box-shadow: inset 0 -1px 0 var(--c-signal); }

.dirow__lead {
  margin-top: var(--sp-2);
  font-size: var(--fs-400); line-height: 1.65; color: var(--c-muted); max-width: 58ch;
}

/* Geniş ekranda açıklama ve "cevapladığı soru" yan yana durur.
   Tek sütunda kaldıklarında satırın ortasında 400px'lik ölü bir
   alan oluşuyordu; dizin seyrek ve yarım kalmış görünüyordu. */
@media (min-width: 76rem) {
  .dirow__main {
    display: grid;
    grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
    column-gap: clamp(2rem, 3vw, 3rem);
    align-items: start;
    /* Satır yüksekliğini sağdaki raf belirliyor; align-content olmadan
       fazla yükseklik satırlara dağılıp başlıkla metin arasında
       ~90px'lik bir boşluk açıyordu. */
    align-content: start;
  }
  .dirow__title { grid-column: 1 / -1; }
  .dirow__lead  { grid-column: 1; max-width: none; }
  .dirow__q     { grid-column: 2; margin-top: var(--sp-2); max-width: none; }
}

/* Hizmetin cevapladığı işletme sorusu — dizinin en kullanışlı satırı,
   aynı zamanda AEO için doğrudan soru-cevap eşlemesi. */
.dirow__q {
  margin-top: var(--sp-4);
  padding-left: var(--sp-4);
  border-left: 1px solid var(--c-line-2);
  font-size: var(--fs-300); line-height: 1.6; color: var(--c-text); max-width: 52ch;
}
/* Mikro etiketler --c-faint yerine --c-muted: 11px'te --c-faint 3.8:1
   veriyor, WCAG AA normal metin için 4.5:1 istiyor. */
.dirow__q-label {
  display: block; margin-bottom: 2px;
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .13em; text-transform: uppercase; color: var(--c-muted);
}

/* Ayrıntılı rehberi olan hizmet: daha büyük başlık + turuncu kertik.
   Bu ağırlık esa_service_has_guide()'dan gelir, elle atanmaz. */
.dirow--guide .dirow__no { box-shadow: inset 3px 0 0 var(--c-signal); padding-left: var(--sp-3); }
.dirow--guide .dirow__title { font-size: var(--fs-h3); font-weight: 700; letter-spacing: -.024em; }
@media (min-width: 64rem) { .dirow--guide { padding-block: var(--sp-8); } }

/* Satırın sağ sütunu: durum, ölçü, ilişki, bağlantı */
.dirow__tag {
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .12em; text-transform: uppercase;
}
.dirow__tag--guide { color: var(--c-signal-dim); }
.dirow__tag--guide::before {
  content: ""; display: inline-block; width: .5rem; height: .5rem;
  margin-right: var(--sp-2); background: var(--c-signal); vertical-align: middle;
}
.dirow__tag--soon { color: var(--c-muted); }
.dirow__tag--soon::before {
  content: ""; display: inline-block; width: .5rem; height: .5rem;
  margin-right: var(--sp-2); border: 1px dashed var(--c-line-2); vertical-align: middle;
}

.dirow__fact {
  margin-top: var(--sp-2);
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .1em; text-transform: uppercase; color: var(--c-muted);
}
.dirow__tag + .dirow__fact { margin-top: var(--sp-2); }

.dirow__rel {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 var(--sp-4);
  margin-top: var(--sp-3);
  padding-top: var(--sp-2);
  border-top: 1px solid var(--c-line);
}
.dirow__rel-label {
  flex: 1 0 100%;
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .13em; text-transform: uppercase; color: var(--c-muted);
  margin-bottom: 2px;
}
.dirow__rel a, .hubsec__links a {
  display: inline-block; padding-block: .5rem;
  font-size: var(--fs-300); font-weight: 500;
  color: var(--c-brand); text-decoration: none;
  box-shadow: inset 0 -1px 0 var(--c-line-2);
  transition: box-shadow var(--dur) var(--ease), color var(--dur) var(--ease);
}
.dirow__rel a:hover, .hubsec__links a:hover {
  color: var(--c-text); box-shadow: inset 0 -2px 0 var(--c-signal);
}

.dirow__go { margin-top: var(--sp-2); }

/* --- C. Yön bulma -------------------------------------------------------- */
.hub-ask__grid { display: grid; gap: clamp(2rem, 4vw, 3rem); }
@media (min-width: 62rem) {
  .hub-ask__grid {
    grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
    gap: clamp(2.5rem, 6vw, 5rem);
    align-items: start;
  }
}
.hub-ask .statement { max-width: 16ch; }
.hub-ask__body p { color: var(--c-muted); line-height: 1.7; max-width: 56ch; }

.hub-ask__list { margin-top: var(--sp-5); border-top: 1px solid var(--c-line-2); }
.hub-ask__list li {
  position: relative;
  padding: var(--sp-4) 0 var(--sp-4) var(--sp-6);
  border-bottom: 1px solid var(--c-line);
  font-size: var(--fs-400); color: var(--c-text);
}
.hub-ask__list li::before {
  content: ""; position: absolute; left: 0; top: 1.35rem;
  width: .875rem; height: 2px; background: var(--c-signal);
}

.hub-ask__actions {
  display: flex; flex-wrap: wrap; align-items: center;
  gap: var(--sp-4) var(--sp-6);
  margin-top: clamp(1.75rem, 3vw, 2.5rem);
}
.hub-ask__phone {
  display: flex; flex-direction: column; gap: 2px;
  min-height: 2.75rem; justify-content: center;
  padding-left: var(--sp-5);
  border-left: 2px solid var(--c-signal);
  text-decoration: none; color: inherit;
}
.hub-ask__phone-label {
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .13em; text-transform: uppercase; color: var(--c-muted);
}
.hub-ask__phone-no {
  font-size: var(--fs-600); font-weight: 700; letter-spacing: -.01em;
  transition: color var(--dur) var(--ease);
}
.hub-ask__phone:hover .hub-ask__phone-no { color: var(--c-brand); }

/* --- D. Sektörler -------------------------------------------------------- */
.hubsecs { border-top: 1px solid var(--c-line-2); }
@media (min-width: 62rem) {
  .hubsecs {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: clamp(2.5rem, 5vw, 4.5rem);
  }
}
.hubsec { padding-block: var(--sp-6); border-bottom: 1px solid var(--c-line); }
.hubsec__name { font-size: var(--fs-h4); font-weight: 600; letter-spacing: -.012em; }
.hubsec__name a {
  color: inherit; text-decoration: none;
  box-shadow: inset 0 -1px 0 var(--c-line-2);
}
.hubsec__name a:hover { color: var(--c-brand); box-shadow: inset 0 -2px 0 var(--c-signal); }
.hubsec__desc {
  margin-top: var(--sp-2);
  font-size: var(--fs-400); line-height: 1.6; color: var(--c-muted); max-width: 46ch;
}
.hubsec__links {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 var(--sp-4);
  margin-top: var(--sp-3);
}
.hubsec__links .dirow__rel-label { flex: 1 0 100%; margin-bottom: 0; }

/* --- E. Bölgeler --------------------------------------------------------- */
.hubregs { display: grid; }
@media (min-width: 48rem) {
  .hubregs { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(2rem, 4vw, 3.5rem); }
}
@media (min-width: 64rem) {
  .hubregs { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.hubreg {
  padding-block: var(--sp-5);
  border-bottom: 1px solid var(--c-line);
  border-top: 2px solid transparent;
}
.hubreg:first-child { border-top-color: var(--c-text); }
@media (min-width: 48rem)  { .hubregs > .hubreg:nth-child(-n+2) { border-top-color: var(--c-text); } }
@media (min-width: 64rem)  { .hubregs > .hubreg:nth-child(-n+3) { border-top-color: var(--c-text); } }

.hubreg__name {
  display: flex; align-items: baseline; flex-wrap: wrap; gap: var(--sp-3);
  font-size: var(--fs-h4); font-weight: 600; letter-spacing: -.012em;
}
.hubreg__name a {
  color: inherit; text-decoration: none;
  box-shadow: inset 0 -1px 0 var(--c-line-2);
}
.hubreg__name a:hover { color: var(--c-brand); box-shadow: inset 0 -2px 0 var(--c-signal); }
.hubreg__hq {
  font-family: var(--ff-mono); font-size: var(--fs-100); font-weight: 500;
  letter-spacing: .12em; text-transform: uppercase; color: var(--c-signal-dim);
}
.hubreg__zones {
  display: block; margin-top: var(--sp-2);
  font-size: var(--fs-300); line-height: 1.6; color: var(--c-text);
}
.hubreg__note {
  display: block; margin-top: var(--sp-1);
  font-size: var(--fs-300); line-height: 1.6; color: var(--c-muted);
}


/* ==========================================================================
   20f — BEKRA PILLAR EK BÖLÜMLERİ  (/hizmetler/bekra-danismanligi/)
   --------------------------------------------------------------------------
   Yalnızca ilgili kayda sahip pillar sayfalarda basılır. Amaç, üçüncü
   pillar'ın ilk ikisinin kopyası olmaması:
     · .chain     değerlendirme zinciri — süreç rayının GİRDİSİ, tekrarı değil
     · .distinct  sabit bir konuyu birden çok komşu başlıkla karşılaştıran blok
                  (.compare iki hizmeti yan yana koyar; bu üçlü ayrım yapar)
   Kart, gölge, gradient ve yuvarlak köşe yok.
   ========================================================================== */

/* --- Değerlendirme zinciri ---------------------------------------------- */
.chain {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
  gap: var(--sp-3);
  margin: var(--sp-4) 0 clamp(2.5rem, 4.5vw, 3.75rem);
}
.chain__item {
  padding-top: var(--sp-3);
  border-top: 2px solid var(--c-line-2);
}
/* Zincirin başlangıcı amber ile işaretlenir; kalan halkalar nötr kalır */
.chain__item:first-child { border-top-color: var(--c-signal); }
.chain__no {
  display: block;
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .12em; color: var(--c-signal-dim);
}
.chain__label {
  display: block; margin-top: var(--sp-1);
  font-size: var(--fs-300); font-weight: 600; line-height: 1.35;
  letter-spacing: -.008em; color: var(--c-text);
}

/* --- Sık karıştırılanlar (üçlü ayrım) ----------------------------------- */
.distinct { display: grid; gap: clamp(2rem, 4vw, 3rem); }
@media (min-width: 64rem) {
  .distinct {
    grid-template-columns: minmax(0, 4fr) minmax(0, 7fr);
    gap: clamp(2.5rem, 5vw, 4.5rem);
    align-items: start;
  }
  /* Karşılaştırılan başlıklar okunurken konu ekranda kalır */
  .distinct__self { position: sticky; top: 7rem; }
}

.distinct__self { padding-left: var(--sp-5); border-left: 3px solid var(--c-signal); }
.distinct__self-label {
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .13em; text-transform: uppercase; color: var(--c-muted);
}
.distinct__self-name {
  margin-top: var(--sp-2);
  font-size: var(--fs-h2); font-weight: 700;
  font-stretch: var(--wd-head); letter-spacing: -.028em; line-height: var(--lh-snug);
}
.distinct__self-focus {
  margin-top: var(--sp-3);
  font-size: var(--fs-400); line-height: 1.66; color: var(--c-muted); max-width: 34ch;
}

.distinct__list { border-top: 2px solid var(--c-text); }
.distinct__item {
  padding-block: clamp(1.5rem, 2.5vw, 2rem);
  border-bottom: 1px solid var(--c-line);
}
.distinct__head { display: grid; gap: var(--sp-1); }
@media (min-width: 48rem) {
  .distinct__head {
    grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
    align-items: baseline; gap: var(--sp-5);
  }
}
.distinct__name {
  font-size: var(--fs-h3); font-weight: 700;
  font-stretch: var(--wd-head); letter-spacing: -.024em;
}
.distinct__focus {
  font-family: var(--ff-mono); font-size: var(--fs-200);
  line-height: 1.5; color: var(--c-muted);
}
.distinct__body {
  margin-top: var(--sp-4);
  font-size: var(--fs-400); line-height: 1.7; color: var(--c-muted); max-width: 62ch;
}
.distinct__item .link { margin-top: var(--sp-3); }

.distinct__note {
  max-width: 68ch;
  font-size: var(--fs-400); line-height: 1.7; color: var(--c-muted);
}
.distinct__note a {
  color: var(--c-brand); font-weight: 600; text-decoration: none;
  box-shadow: inset 0 -1px 0 var(--c-line-2);
  transition: box-shadow var(--dur) var(--ease), color var(--dur) var(--ease);
}
.distinct__note a:hover { color: var(--c-text); box-shadow: inset 0 -2px 0 var(--c-signal); }


/* ==========================================================================
   20g — SEKTÖR SAYFALARI  (/sektorler/{slug}/ ve /sektorler/)
   --------------------------------------------------------------------------
   Sektör sayfası bir hizmet satmaz, bir bağlam kurar. Bu yüzden pillar
   sayfaların araçlarını tekrar etmez:
     · .profile  işletme tipleri — sektörü OSB'deki büyük fabrikaya
                 indirgememek için ölçek dağılımını açıkça gösterir
     · .topics   çevresel başlıklar — sözlük ritmi (başlık solda, açıklama
                 sağda); .scope ve .steps'ten farklı bir okuma düzeni
     · .secsvc   hizmet ilişkisi — numaralı satır, kart değil
   Kart, gölge, gradient, büyük ikon ve yuvarlak köşe yok.
   ========================================================================== */

/* Sektör başlıkları hizmet başlıklarından uzundur; 12ch sınırı
   "Plastik, Ambalaj ve Geri Dönüşüm..." gibi başlıkları merdivene
   çeviriyordu. */
/* Özgüllük notu: 20b'deki `.svc-hero h1 { max-width: 12ch }` (0,1,1)
   düz `.sec-hero__h1` (0,1,0) kuralını eziyordu; başlık 12ch'e sıkışıp
   altı satıra bölünüyordu. Seçici eşitlenerek çözüldü. */
.svc-hero h1.sec-hero__h1 {
  max-width: 26ch;
  /* Sektör başlıkları hizmet başlıklarından uzun; pillar H1'inden bir tık
     küçük ölçek satır sayısını makul tutuyor. */
  font-size: clamp(1.75rem, 1.3rem + 1.75vw, 2.5rem);
}

/* --- Doğrudan cevap ----------------------------------------------------- */
.sec-answer { display: grid; gap: clamp(2rem, 4vw, 3rem); }
@media (min-width: 64rem) {
  .sec-answer {
    grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
    gap: clamp(2.5rem, 6vw, 5rem);
    align-items: start;
  }
  .sec-answer .statement { position: sticky; top: 7rem; }
}
.sec-answer .statement { max-width: 20ch; }
.sec-answer__body > p + p { margin-top: var(--sp-5); }
.sec-answer__body p { color: var(--c-muted); line-height: 1.72; max-width: 60ch; }
/* İlk paragraf doğrudan cevaptır: gövdeden bir tık büyük ve koyu */
.sec-answer__lead {
  font-size: var(--fs-lead); line-height: 1.62;
  color: var(--c-text) !important;
}

/* --- İşletme kapsamı ---------------------------------------------------- */
.profile { border-top: 2px solid var(--c-text); }
@media (min-width: 62rem) {
  .profile {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: clamp(2.5rem, 5vw, 4.5rem);
  }
}
.profile__item {
  padding-block: var(--sp-6);
  border-bottom: 1px solid var(--c-line);
}
.profile__no {
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .12em; color: var(--c-signal-dim);
  margin-bottom: var(--sp-2);
}
.profile__name { font-size: var(--fs-h4); font-weight: 600; letter-spacing: -.014em; }
.profile__body {
  margin-top: var(--sp-2);
  font-size: var(--fs-400); line-height: 1.66; color: var(--c-muted); max-width: 46ch;
}
.profile__note {
  margin-top: clamp(1.75rem, 3vw, 2.5rem);
  padding-left: var(--sp-4);
  border-left: 3px solid var(--c-signal);
  max-width: 62ch;
  font-size: var(--fs-400); line-height: 1.7; color: var(--c-text);
}

/* --- Çevresel başlıklar (sözlük ritmi) ---------------------------------- */
.topics { border-top: 1px solid var(--c-line-2); counter-reset: topic; }
.topics__item {
  display: grid; gap: var(--sp-2);
  padding-block: clamp(1.5rem, 2.5vw, 2.25rem);
  border-bottom: 1px solid var(--c-line);
}
@media (min-width: 56rem) {
  .topics__item {
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
    gap: clamp(2rem, 4vw, 3.5rem);
    align-items: start;
  }
}
.topics__title {
  counter-increment: topic;
  font-size: var(--fs-h4); font-weight: 600; letter-spacing: -.014em;
}
.topics__title::before {
  content: counter(topic, decimal-leading-zero);
  display: block; margin-bottom: var(--sp-2);
  font-family: var(--ff-mono); font-size: var(--fs-100); font-weight: 500;
  letter-spacing: .12em; color: var(--c-signal-dim);
}
.topics__body {
  font-size: var(--fs-400); line-height: 1.72; color: var(--c-muted); max-width: 62ch;
}
.topics__body a {
  color: var(--c-brand); font-weight: 600; text-decoration: none;
  box-shadow: inset 0 -1px 0 var(--c-line-2);
  transition: box-shadow var(--dur) var(--ease), color var(--dur) var(--ease);
}
.topics__body a:hover { color: var(--c-text); box-shadow: inset 0 -2px 0 var(--c-signal); }

/* --- Destek başlıkları (hizmet satırları) ------------------------------- */
.secsvc { border-top: 2px solid var(--c-text); }
.secsvc__row {
  display: grid; grid-template-columns: 2.5rem minmax(0, 1fr);
  column-gap: var(--sp-4);
  padding-block: var(--sp-5);
  border-bottom: 1px solid var(--c-line);
}
@media (min-width: 48rem) {
  .secsvc__row { grid-template-columns: 3rem minmax(0, 1fr) auto; align-items: center; }
}
.secsvc__no {
  font-family: var(--ff-mono); font-size: var(--fs-200);
  letter-spacing: .1em; color: var(--c-signal-dim); padding-top: .2rem;
}
.secsvc__name { font-size: var(--fs-h4); font-weight: 600; letter-spacing: -.014em; }
.secsvc__name a {
  color: inherit; text-decoration: none;
  box-shadow: inset 0 -1px 0 transparent;
  transition: color var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.secsvc__name a:hover { color: var(--c-brand); box-shadow: inset 0 -1px 0 var(--c-signal); }
.secsvc__note {
  margin-top: var(--sp-2);
  font-size: var(--fs-400); line-height: 1.62; color: var(--c-muted); max-width: 62ch;
}
.secsvc__go { display: none; color: var(--c-faint); }
@media (min-width: 48rem) { .secsvc__go { display: block; } }
.secsvc__row:hover .secsvc__go { color: var(--c-brand); }
.secsvc__all { margin-top: var(--sp-6); }

/* --- Bölgeler (kompakt, OSB listesi değil) ------------------------------ */
.secregs { display: grid; border-top: 2px solid var(--c-text); }
@media (min-width: 48rem) {
  .secregs { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(2rem, 4vw, 3.5rem); }
}
@media (min-width: 64rem) {
  .secregs { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.secreg { padding-block: var(--sp-4); border-bottom: 1px solid var(--c-line); }
.secreg__name { display: block; font-size: var(--fs-600); font-weight: 600; letter-spacing: -.012em; }
.secreg__name a {
  color: inherit; text-decoration: none;
  box-shadow: inset 0 -1px 0 var(--c-line-2);
}
.secreg__name a:hover { color: var(--c-brand); box-shadow: inset 0 -2px 0 var(--c-signal); }
.secreg__zones {
  display: block; margin-top: var(--sp-1);
  font-size: var(--fs-300); line-height: 1.6; color: var(--c-muted);
}

/* --- Diğer sektörler / sektör dizini ------------------------------------ */
.othersec { display: grid; border-top: 2px solid var(--c-text); }
@media (min-width: 56rem) {
  .othersec { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(2.5rem, 5vw, 4.5rem); }
}
.othersec__item { border-bottom: 1px solid var(--c-line); }
.othersec__item a {
  display: block; padding-block: var(--sp-5);
  color: inherit; text-decoration: none;
}
.othersec__name {
  display: block; font-size: var(--fs-h4); font-weight: 600; letter-spacing: -.014em;
  transition: color var(--dur) var(--ease);
}
.othersec__item a:hover .othersec__name { color: var(--c-brand); }
.othersec__desc {
  display: block; margin-top: var(--sp-2);
  font-size: var(--fs-300); line-height: 1.6; color: var(--c-muted); max-width: 46ch;
}

/* Pillar sayfalardaki "Kimler için" bölümünde sektör adı, sektör sayfası
   yayına alındığında linke dönüyor (Faz 7). Stil 20b'ye dokunmadan burada
   tanımlanır. */
.audience__name a {
  color: inherit; text-decoration: none;
  box-shadow: inset 0 -1px 0 var(--c-line-2);
  transition: color var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.audience__name a:hover { color: var(--c-brand); box-shadow: inset 0 -2px 0 var(--c-signal); }

/* Sektör dizini künyesinin sağ sütunu: bu fazın asıl mesajı —
   ESA yalnızca OSB'deki büyük fabrikalarla çalışmaz. */
.scope-note { border-top: 2px solid var(--c-text); }
.scope-note__item {
  padding-block: var(--sp-3);
  border-bottom: 1px solid var(--c-line);
  font-size: var(--fs-400); color: var(--c-text);
}

/* --- Sektör dizini (/sektorler/) ---------------------------------------- */
/* head-row zaten 2px alt çizgi veriyor; ikinci bir üst çizgi çift ray yapıyordu. */
.secidx { border-top: 0; }
.secidx__row {
  display: grid; grid-template-columns: 2.5rem minmax(0, 1fr);
  column-gap: var(--sp-4);
  padding-block: clamp(1.5rem, 2.5vw, 2.25rem);
  border-bottom: 1px solid var(--c-line);
}
@media (min-width: 64rem) {
  .secidx__row {
    grid-template-columns: 3rem minmax(0, 6fr) minmax(0, 5fr);
    column-gap: clamp(1.5rem, 3vw, 2.75rem);
    align-items: start;
  }
}
.secidx__no {
  grid-row: 1;
  font-family: var(--ff-mono); font-size: var(--fs-200);
  letter-spacing: .1em; color: var(--c-signal-dim); padding-top: .3rem;
}
.secidx__main { grid-row: 1; }
.secidx__name { font-size: var(--fs-h3); font-weight: 700; font-stretch: var(--wd-head); letter-spacing: -.024em; }
.secidx__name a {
  color: inherit; text-decoration: none;
  box-shadow: inset 0 -1px 0 transparent;
  transition: color var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.secidx__name a:hover { color: var(--c-brand); box-shadow: inset 0 -1px 0 var(--c-signal); }
.secidx__desc {
  margin-top: var(--sp-2);
  font-size: var(--fs-400); line-height: 1.65; color: var(--c-muted); max-width: 56ch;
}
.secidx__links {
  /* Dar ekranda otomatik yerleşim bu bloğu 1. sütuna (40px'lik numara
     sütunu) düşürüyor ve bağlantılar kelime kelime kırılıyordu. */
  grid-column: 2;
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 var(--sp-4);
  margin-top: var(--sp-3);
}
@media (min-width: 64rem) {
  .secidx__links { grid-row: 1; grid-column: 3; margin-top: .35rem; }
}
.secidx__links-label {
  flex: 1 0 100%;
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .13em; text-transform: uppercase; color: var(--c-muted);
  margin-bottom: 2px;
}
.secidx__links a {
  display: inline-block; padding-block: .5rem;
  font-size: var(--fs-300); font-weight: 500;
  color: var(--c-brand); text-decoration: none;
  box-shadow: inset 0 -1px 0 var(--c-line-2);
  transition: box-shadow var(--dur) var(--ease), color var(--dur) var(--ease);
}
.secidx__links a:hover { color: var(--c-text); box-shadow: inset 0 -2px 0 var(--c-signal); }


/* ==========================================================================
   20h — ÇALIŞMA ALANI DİLİ  (Faz 7.1)
   --------------------------------------------------------------------------
   Sektör listesinin eksiksiz bir katalog değil, başlıca çalışma örnekleri
   olduğunu görsel olarak da söyleyen küçük eklemeler. Yeni bir bileşen
   ailesi kurulmaz; mevcut ritim korunur.
   ========================================================================== */

/* Geniş çalışma alanı etiketi — H1'in hemen altında, ondan sessiz */
.sec-hero__scope {
  margin-top: var(--sp-3);
  font-family: var(--ff-mono); font-size: var(--fs-200);
  letter-spacing: .06em; color: var(--c-signal-dim);
}
/* Kapsam genişletme paragrafı — lead'den bir tık sessiz, ayrı bir ses */
.sec-hero__note {
  margin-top: var(--sp-4);
  padding-left: var(--sp-4);
  border-left: 1px solid var(--c-line-2);
  font-size: var(--fs-300); line-height: 1.7;
  color: var(--c-muted); max-width: 52ch;
}

/* Sektör dizini satırında geniş alan etiketi */
.secidx__scope {
  margin-top: var(--sp-1);
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .1em; text-transform: uppercase; color: var(--c-signal-dim);
}

/* "Bu liste eksiksiz değildir" notu — sektör sayfası kapanışı */
.othersec__note {
  margin-top: clamp(1.75rem, 3vw, 2.5rem);
  padding-left: var(--sp-4);
  border-left: 3px solid var(--c-signal);
  max-width: 68ch;
  font-size: var(--fs-400); line-height: 1.7; color: var(--c-text);
}
.othersec__note a,
.sector-note a {
  color: var(--c-brand); font-weight: 600; text-decoration: none;
  box-shadow: inset 0 -1px 0 var(--c-line-2);
  transition: box-shadow var(--dur) var(--ease), color var(--dur) var(--ease);
}
.othersec__note a:hover,
.sector-note a:hover { color: var(--c-text); box-shadow: inset 0 -2px 0 var(--c-signal); }

/* Ana sayfa sektör bölümü kapanış notu */
.sector-note__go { display: inline-flex; margin-left: var(--sp-2); }
.sector-note {
  margin-top: clamp(1.75rem, 3vw, 2.5rem);
  padding-top: var(--sp-4);
  border-top: 1px solid var(--c-line);
  max-width: 74ch;
  font-size: var(--fs-400); line-height: 1.7; color: var(--c-muted);
}

/* Ana sayfada sektör adları artık sektör sayfalarına gidiyor */
.matrix__name a,
.sector-item h3 a {
  color: inherit; text-decoration: none;
  box-shadow: inset 0 -1px 0 var(--c-line-2);
  transition: color var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.matrix__name a:hover,
.sector-item h3 a:hover { color: var(--c-brand); box-shadow: inset 0 -2px 0 var(--c-signal); }


/* ==========================================================================
   20i — DİĞER SEKTÖRLER  (/sektorler/ · Faz 7.4)
   --------------------------------------------------------------------------
   Altı sektörün kapalı bir liste olarak okunmasını önleyen bölüm.
   Kart galerisi DEĞİL: solda anlatı, sağda hairline örnek listesi,
   altta tam genişlikte çağrı bandı. Mevcut petrol/gri/amber sistemi
   ve numaralandırma dili korunur; ikon ve gradient yok.
   ========================================================================== */

.othersectors__grid { display: grid; gap: clamp(2rem, 4vw, 3rem); }
@media (min-width: 62rem) {
  .othersectors__grid {
    grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
    gap: clamp(2.5rem, 5vw, 4.5rem);
    align-items: start;
  }
}
.othersectors__body > p + p { margin-top: var(--sp-5); }
.othersectors__body p { color: var(--c-muted); line-height: 1.72; max-width: 62ch; }
/* İlk paragraf tesis bazlı yaklaşımın tanımıdır: gövdeden bir tık koyu */
.othersectors__lead {
  font-size: var(--fs-lead); line-height: 1.62;
  color: var(--c-text) !important;
}

/* Örnek faaliyet alanları — iki sütunlu hairline liste */
.exlist {
  margin-top: var(--sp-3);
  border-top: 2px solid var(--c-text);
}
@media (min-width: 34rem) {
  .exlist {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: var(--sp-6);
  }
}
@media (min-width: 62rem) { .exlist { grid-template-columns: 1fr; } }
@media (min-width: 76rem) { .exlist { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.exlist__item {
  padding-block: var(--sp-3);
  border-bottom: 1px solid var(--c-line);
  font-size: var(--fs-400); color: var(--c-text);
}
.exlist__note {
  margin-top: var(--sp-4);
  font-size: var(--fs-300); line-height: 1.65; color: var(--c-muted); max-width: 44ch;
}

/* Çağrı bandı — bölümün altında, tam genişlik, üstünde kalın ayraç */
.othersectors__cta {
  display: grid; gap: var(--sp-6);
  margin-top: clamp(2.5rem, 4.5vw, 3.75rem);
  padding-top: clamp(1.75rem, 3vw, 2.5rem);
  border-top: 2px solid var(--c-text);
}
@media (min-width: 62rem) {
  .othersectors__cta {
    grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
    gap: clamp(2.5rem, 5vw, 4.5rem);
    align-items: center;
  }
}
.othersectors__cta-heading {
  font-size: var(--fs-h3); font-weight: 700;
  font-stretch: var(--wd-head); letter-spacing: -.024em;
}
.othersectors__cta-text p {
  margin-top: var(--sp-3);
  font-size: var(--fs-400); line-height: 1.7; color: var(--c-muted); max-width: 58ch;
}
.othersectors__cta-actions {
  display: flex; flex-wrap: wrap; align-items: center;
  gap: var(--sp-4) var(--sp-6);
}


/* ==========================================================================
   20j — BÖLGE SAYFALARI  (/bolgeler/{slug}/ · Faz 8)
   --------------------------------------------------------------------------
   Sektör şablonunun kopyası değil. Bölge sayfası bir yer tarif eder:
     · .reg-hero   başlığın altında alt bölge künyesi
     · .regmix     işletme yapısı — kalın üst ray + ruled satırlar
                   (sektördeki .profile 2 sütunlu numaralı ızgaraydı)
     · .regsec     bölge -> sektör köprüsü, iki sütunlu kompakt liste
   "Değerlendirme dayanağı" bölümü BEKRA'daki .chain bileşenini yeniden
   kullanır; sektör sayfalarında bu bileşen yok.
   Kart, gölge, gradient, büyük ikon yok.
   ========================================================================== */

/* --- Hero + bölge künyesi ------------------------------------------------ */
.reg-hero { padding-block: clamp(2.25rem, 4vw, 3.75rem) 0; }
.reg-hero__grid { display: grid; gap: clamp(2rem, 4vw, 3rem); align-items: start; }
@media (min-width: 64rem) {
  .reg-hero__grid { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: clamp(2.5rem, 5vw, 4.5rem); }
  .reg-hero__media { margin-right: calc(var(--bleed) * -1); }
}
@media (max-width: 63.99rem) {
  .reg-hero__media { margin-inline: calc(var(--gutter) * -1); }
  .reg-hero__media .imgslot { aspect-ratio: 16 / 10; }
}

.reg-hero__h1 {
  max-width: 20ch;
  font-size: clamp(1.875rem, 1.4rem + 1.9vw, 2.75rem);
}
.reg-hero__hq {
  display: inline-block; vertical-align: middle;
  margin-left: var(--sp-3);
  padding: .2rem .5rem;
  border: 1px solid var(--c-signal);
  font-family: var(--ff-mono); font-size: var(--fs-100); font-weight: 500;
  font-stretch: normal; letter-spacing: .12em; text-transform: uppercase;
  color: var(--c-signal-dim);
}
.reg-hero__scope {
  margin-top: var(--sp-3);
  font-family: var(--ff-mono); font-size: var(--fs-200);
  letter-spacing: .06em; color: var(--c-signal-dim);
}
.reg-hero__lead {
  margin-top: var(--sp-5);
  font-size: var(--fs-lead); line-height: 1.6;
  color: var(--c-muted); max-width: 50ch;
}

/* Alt bölge künyesi — bölge sayfasına özgü, sektörde karşılığı yok */
.reg-zones {
  margin-top: clamp(1.75rem, 3vw, 2.5rem);
  padding-top: var(--sp-4);
  border-top: 1px solid var(--c-line);
}
.reg-zones__list {
  display: flex; flex-wrap: wrap; gap: var(--sp-2) 0;
  margin-top: var(--sp-1);
}
.reg-zones__item {
  font-size: var(--fs-300); color: var(--c-text);
}
.reg-zones__item + .reg-zones__item::before {
  content: "·"; margin-inline: var(--sp-3); color: var(--c-line-2);
}

.reg-hero__actions {
  display: flex; flex-wrap: wrap; align-items: center;
  gap: var(--sp-4) var(--sp-6);
  margin-top: clamp(1.75rem, 3vw, 2.5rem);
}

/* --- Bölge profili ------------------------------------------------------- */
.regprofile { display: grid; gap: clamp(2rem, 4vw, 3rem); }
@media (min-width: 64rem) {
  .regprofile {
    grid-template-columns: minmax(0, 4fr) minmax(0, 7fr);
    gap: clamp(2.5rem, 6vw, 5rem);
    align-items: start;
  }
  .regprofile__head { position: sticky; top: 7rem; }
}
.regprofile__head h2 { margin-top: var(--sp-2); max-width: 16ch; }
.regprofile__body > p + p { margin-top: var(--sp-5); }
.regprofile__body p { color: var(--c-muted); line-height: 1.72; max-width: 62ch; }

/* --- İşletme yapısı ------------------------------------------------------ */
.regmix { border-top: 2px solid var(--c-text); }
.regmix__item {
  display: grid; gap: var(--sp-2);
  padding-block: clamp(1.5rem, 2.5vw, 2rem);
  border-bottom: 1px solid var(--c-line);
}
@media (min-width: 56rem) {
  .regmix__item {
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
    gap: clamp(2rem, 4vw, 3.5rem);
    align-items: start;
  }
}
.regmix__name { font-size: var(--fs-h4); font-weight: 600; letter-spacing: -.014em; }
.regmix__body {
  font-size: var(--fs-400); line-height: 1.7; color: var(--c-muted); max-width: 62ch;
}
.regmix__note {
  margin-top: clamp(1.75rem, 3vw, 2.5rem);
  padding-left: var(--sp-4);
  border-left: 3px solid var(--c-signal);
  max-width: 66ch;
  font-size: var(--fs-400); line-height: 1.7; color: var(--c-text);
}

/* --- Bölge -> sektör köprüsü --------------------------------------------- */
.regsec__lead {
  max-width: 64ch; margin-bottom: var(--sp-6);
  font-size: var(--fs-400); line-height: 1.7; color: var(--c-muted);
}
.regsec { display: grid; border-top: 1px solid var(--c-line-2); }
@media (min-width: 56rem) {
  .regsec { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(2.5rem, 5vw, 4.5rem); }
}
.regsec__item { border-bottom: 1px solid var(--c-line); }
.regsec__item a {
  display: block; padding-block: var(--sp-4);
  color: inherit; text-decoration: none;
}
.regsec__name {
  display: block; font-size: var(--fs-600); font-weight: 600; letter-spacing: -.012em;
  transition: color var(--dur) var(--ease);
}
.regsec__item a:hover .regsec__name { color: var(--c-brand); }
.regsec__scope {
  display: block; margin-top: var(--sp-1);
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .1em; text-transform: uppercase; color: var(--c-muted);
}

/* --- Diğer bölgeler ------------------------------------------------------ */
.regother { display: grid; border-top: 2px solid var(--c-text); }
@media (min-width: 48rem) {
  .regother { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(2rem, 4vw, 3.5rem); }
}
@media (min-width: 64rem) {
  .regother { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.regother__item { border-bottom: 1px solid var(--c-line); }
.regother__item a {
  display: block; padding-block: var(--sp-4);
  color: inherit; text-decoration: none;
}
.regother__name {
  display: flex; align-items: baseline; flex-wrap: wrap; gap: var(--sp-3);
  font-size: var(--fs-h4); font-weight: 600; letter-spacing: -.012em;
  transition: color var(--dur) var(--ease);
}
.regother__item a:hover .regother__name { color: var(--c-brand); }
.regother__zones {
  display: block; margin-top: var(--sp-2);
  font-size: var(--fs-300); line-height: 1.6; color: var(--c-muted);
}

/* --- Bölge dizini satırında alt bölgeler --------------------------------- */
.regidx__zones {
  flex: 1 0 100%;
  font-size: var(--fs-300); line-height: 1.7; color: var(--c-text);
}


/* ==========================================================================
   20k — KURUMSAL GÜVEN  (ana sayfa "Neden ESA" · /hakkimizda/ · /referanslarimiz/)
   --------------------------------------------------------------------------
   Güven sayıyla değil, yapıyla kurulur. Bu yüzden burada:
     · yıldız puanı, rozet, testimonial kartı, "trusted by" logo duvarı YOK
     · yuvarlak köşe, gölge, gradient YOK
   Bileşenler mevcut hairline + mono etiket + numaralandırma dilini sürdürür.
     · .why       ana sayfa güven bandı — solda sabit ifade, sağda satırlar
     · .abt-*     kurumsal sayfa — künye, deneyim işareti, yetkilendirme
     · .method    çalışma ilişkisi — çok sütunlu hairline ızgara (satır değil)
     · .reflist   referans kayıtları (veri geldiğinde)
   ========================================================================== */

/* --- Ana sayfa güven bandı ---------------------------------------------- */
.why { display: grid; gap: clamp(2rem, 4vw, 3rem); }
@media (min-width: 64rem) {
  .why {
    grid-template-columns: minmax(0, 4fr) minmax(0, 7fr);
    gap: clamp(2.5rem, 6vw, 5rem);
    align-items: start;
  }
  .why__head { position: sticky; top: 7rem; }
}
.why__head .statement { max-width: 14ch; }
.why__lead {
  margin-top: var(--sp-5);
  font-size: var(--fs-400); line-height: 1.7; color: var(--c-muted); max-width: 44ch;
}
.why__cta {
  margin-top: clamp(1.75rem, 3vw, 2.5rem);
  padding-top: var(--sp-5);
  border-top: 1px solid var(--c-line);
}
.why__cta p {
  margin-bottom: var(--sp-4);
  font-size: var(--fs-300); line-height: 1.65; color: var(--c-muted); max-width: 38ch;
}

.why__list { border-top: 2px solid var(--c-text); }
.why__item {
  display: grid; gap: var(--sp-2);
  padding-block: clamp(1.5rem, 2.5vw, 2rem);
  border-bottom: 1px solid var(--c-line);
}
@media (min-width: 56rem) {
  .why__item {
    /* Etiket rayı dar tutulur: 4fr'de mono etiketin yanında ~300px
       boşluk kalıyordu. align-content olmadan da satır yüksekliği
       gövdeye dağılıp başlık ile metin arasını açıyordu. */
    grid-template-columns: minmax(9.5rem, 2fr) minmax(0, 9fr);
    gap: var(--sp-2) clamp(1.5rem, 3vw, 2.5rem);
    align-items: start;
    align-content: start;
  }
  .why__label { grid-row: 1; grid-column: 1; }
  .why__title { grid-row: 1; grid-column: 2; }
  .why__body  { grid-row: 2; grid-column: 2; }
  .why__link  { grid-row: 3; grid-column: 2; }
}
.why__label {
  display: flex; align-items: baseline; gap: var(--sp-3);
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .13em; text-transform: uppercase; color: var(--c-muted);
}
.why__no { color: var(--c-signal-dim); }
.why__title { font-size: var(--fs-h4); font-weight: 600; letter-spacing: -.014em; }
.why__body {
  font-size: var(--fs-400); line-height: 1.7; color: var(--c-muted); max-width: 58ch;
}
.why__link {
  justify-self: start;
  display: inline-flex; align-items: center; gap: var(--sp-2);
  margin-top: var(--sp-1); padding-block: .4375rem;
  font-size: var(--fs-300); font-weight: 600; color: var(--c-brand); text-decoration: none;
  box-shadow: inset 0 -1px 0 var(--c-line-2);
  transition: box-shadow var(--dur) var(--ease), color var(--dur) var(--ease);
}
.why__link:hover { color: var(--c-text); box-shadow: inset 0 -2px 0 var(--c-signal); }
.why__link svg { transition: transform var(--dur) var(--ease); }
.why__link:hover svg { transform: translateX(3px); }

/* --- Kurumsal sayfa: hero ------------------------------------------------ */
.abt-hero { padding-block: clamp(2.25rem, 4vw, 3.75rem) 0; }
.abt-hero__grid { display: grid; gap: clamp(2rem, 4vw, 3rem); align-items: start; }
@media (min-width: 64rem) {
  .abt-hero__grid { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: clamp(2.5rem, 5vw, 4.5rem); }
  .abt-hero__media { margin-right: calc(var(--bleed) * -1); }
}
@media (max-width: 63.99rem) {
  .abt-hero__media { margin-inline: calc(var(--gutter) * -1); }
  .abt-hero__media .imgslot { aspect-ratio: 16 / 10; }
}
.abt-hero__h1 { max-width: 16ch; }
.abt-hero__lead {
  margin-top: var(--sp-5);
  font-size: var(--fs-lead); line-height: 1.6;
  color: var(--c-muted); max-width: 52ch;
}
.abt-hero__cta { margin-top: clamp(1.75rem, 3vw, 2.25rem); }

/* Künye şeridi: üç doğrulanabilir bilgi, sayaç değil */
.abt-hero__meta {
  margin-top: clamp(1.75rem, 3vw, 2.5rem);
  border-top: 1px solid var(--c-line);
}
.abt-hero__meta-row {
  display: grid; grid-template-columns: minmax(5rem, 7rem) 1fr; gap: var(--sp-4);
  padding-block: var(--sp-3);
  border-bottom: 1px solid var(--c-line);
  font-size: var(--fs-300);
}
.abt-hero__meta-row dt {
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .13em; text-transform: uppercase; color: var(--c-muted);
  padding-top: .15rem;
}
.abt-hero__meta-row dd { color: var(--c-text); }

/* --- Kurumsal sayfa: deneyim işareti ------------------------------------- */
.abt-exp { display: grid; gap: clamp(2rem, 4vw, 3rem); }
@media (min-width: 64rem) {
  .abt-exp {
    grid-template-columns: minmax(0, 4fr) minmax(0, 7fr);
    gap: clamp(2.5rem, 6vw, 5rem);
    align-items: start;
  }
}
/* Kuruluş işareti — sayaç değil, ifade: büyük ama nötr, amber kertikli */
.abt-exp__kicker {
  margin-top: var(--sp-2);
  padding-left: var(--sp-4);
  border-left: 3px solid var(--c-signal);
  font-size: clamp(1.5rem, 1.15rem + 1.4vw, 2.25rem);
  font-weight: 700; font-stretch: var(--wd-head); letter-spacing: -.026em;
  line-height: var(--lh-snug); color: var(--c-text);
}
.abt-exp__body h2 { max-width: 22ch; }
.abt-exp__body > p { margin-top: var(--sp-5); }
.abt-exp__body p { color: var(--c-muted); line-height: 1.72; max-width: 62ch; }

/* --- Kurumsal sayfa: yetkilendirme --------------------------------------- */
.abt-auth { display: grid; gap: clamp(2rem, 4vw, 3rem); }
@media (min-width: 62rem) {
  .abt-auth {
    grid-template-columns: minmax(0, 7fr) minmax(0, 4fr);
    gap: clamp(2.5rem, 5vw, 4.5rem);
    align-items: start;
  }
}
.abt-auth__facts { margin-top: 0; }
/* Gerçek belge yokken sahte sertifika görseli basılmaz; yalnızca not */
.abt-auth__note {
  padding-left: var(--sp-4);
  border-left: 1px solid var(--c-line-2);
  font-size: var(--fs-300); line-height: 1.7; color: var(--c-muted); max-width: 34ch;
}

/* --- Çalışma ilişkisi: çok sütunlu hairline ızgara ----------------------- */
.method { display: grid; gap: 0; }
@media (min-width: 48rem) {
  .method { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(2rem, 4vw, 3.5rem); }
}
@media (min-width: 68rem) {
  .method { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.method__item {
  padding-block: clamp(1.5rem, 2.5vw, 2rem);
  border-top: 1px solid var(--c-line);
}
/* Üst sıradaki hücreler kalın rayla başlar — ızgaranın üst kenarı */
.method > .method__item:first-child { border-top: 2px solid var(--c-text); }
@media (min-width: 48rem) {
  .method > .method__item:nth-child(-n+2) { border-top: 2px solid var(--c-text); }
}
@media (min-width: 68rem) {
  .method > .method__item:nth-child(-n+3) { border-top: 2px solid var(--c-text); }
}
.method__no {
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .12em; color: var(--c-signal-dim);
  margin-bottom: var(--sp-2);
}
.method__title { font-size: var(--fs-h4); font-weight: 600; letter-spacing: -.014em; }
.method__body {
  margin-top: var(--sp-2);
  font-size: var(--fs-400); line-height: 1.66; color: var(--c-muted); max-width: 40ch;
}

/* --- Kapsam girişleri (kurumsal + referans sayfası) ---------------------- */
.abt-scope { display: grid; border-top: 2px solid var(--c-text); }
@media (min-width: 56rem) {
  .abt-scope { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: clamp(2rem, 4vw, 3.5rem); }
}
.abt-scope__item { border-bottom: 1px solid var(--c-line); }
.abt-scope__item a {
  display: block; padding-block: var(--sp-5);
  color: inherit; text-decoration: none;
}
.abt-scope__count {
  display: block;
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .12em; text-transform: uppercase; color: var(--c-signal-dim);
}
.abt-scope__name {
  display: block; margin-top: var(--sp-2);
  font-size: var(--fs-h4); font-weight: 600; letter-spacing: -.014em;
  transition: color var(--dur) var(--ease);
}
.abt-scope__item a:hover .abt-scope__name { color: var(--c-brand); }
.abt-scope__body {
  display: block; margin-top: var(--sp-2);
  font-size: var(--fs-300); line-height: 1.6; color: var(--c-muted); max-width: 40ch;
}

/* --- Bilgi Merkezi (/haberler/) ------------------------------------------ */
.kntopics { display: grid; border-top: 2px solid var(--c-text); }
@media (min-width: 48rem) {
  .kntopics { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(2rem, 4vw, 3.5rem); }
}
@media (min-width: 76rem) {
  .kntopics { grid-template-columns: repeat(4, minmax(0, 1fr)); column-gap: clamp(1.5rem, 3vw, 2.5rem); }
}
.kntopic { padding-block: var(--sp-6); border-bottom: 1px solid var(--c-line); }
.kntopic__no {
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .12em; color: var(--c-signal-dim);
}
.kntopic__name {
  margin-top: var(--sp-2);
  font-size: var(--fs-h4); font-weight: 600; letter-spacing: -.014em;
}
.kntopic__desc {
  margin-top: var(--sp-2);
  font-size: var(--fs-300); line-height: 1.6; color: var(--c-muted);
}
.kntopic__list { margin-top: var(--sp-4); border-top: 1px solid var(--c-line); }
.kntopic__list li { border-bottom: 1px solid var(--c-line); }
.kntopic__list a {
  display: block; padding-block: var(--sp-3);
  font-size: var(--fs-300); font-weight: 500;
  color: var(--c-brand); text-decoration: none;
  transition: color var(--dur) var(--ease);
}
.kntopic__list a:hover { color: var(--c-text); }

/* Soru dizini — cevap gövdesi yok, yalnızca soru + kaynak */
.qgroup { margin-top: clamp(2rem, 3.5vw, 3rem); }
.qgroup:first-of-type { margin-top: 0; }
.qgroup__head {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: var(--sp-4);
  padding-bottom: var(--sp-3);
  border-bottom: 2px solid var(--c-text);
}
.qgroup__name { font-size: var(--fs-h4); font-weight: 600; letter-spacing: -.014em; }
.qgroup__count {
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .12em; text-transform: uppercase; color: var(--c-muted);
  white-space: nowrap;
}
.qlist { display: grid; }
@media (min-width: 62rem) {
  .qlist { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(2rem, 4vw, 3.5rem); }
}
.qlist__item { border-bottom: 1px solid var(--c-line); }
.qlist__item a {
  display: grid; gap: var(--sp-1);
  padding-block: var(--sp-4);
  color: inherit; text-decoration: none;
}
.qlist__q {
  font-size: var(--fs-400); line-height: 1.5;
  transition: color var(--dur) var(--ease);
}
.qlist__item a:hover .qlist__q { color: var(--c-brand); }
.qlist__src {
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .12em; text-transform: uppercase; color: var(--c-muted);
}

.form__legal-link { margin-top: var(--sp-3); }
.form__legal-link a {
  display: inline-block; padding-block: .4375rem;
  font-size: var(--fs-300); font-weight: 600;
  color: var(--c-brand); text-decoration: none;
  box-shadow: inset 0 -1px 0 var(--c-line-2);
}
.form__legal-link a:hover { color: var(--c-text); box-shadow: inset 0 -2px 0 var(--c-signal); }

/* --- Yasal / kurumsal metin sayfaları ------------------------------------ */
.legal { display: grid; gap: clamp(2rem, 4vw, 3rem); }
@media (min-width: 64rem) {
  .legal { grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: clamp(2.5rem, 6vw, 5rem); align-items: start; }
  .legal__head { position: sticky; top: 7rem; }
}
.legal__head h1 { max-width: 14ch; }
.legal__lead {
  margin-top: var(--sp-5);
  font-size: var(--fs-400); line-height: 1.7; color: var(--c-muted); max-width: 44ch;
}
.legal__updated {
  margin-top: var(--sp-4); padding-top: var(--sp-3);
  border-top: 1px solid var(--c-line);
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .12em; text-transform: uppercase; color: var(--c-muted);
}
.legal__notice {
  padding-left: var(--sp-4);
  border-left: 3px solid var(--c-signal);
  font-size: var(--fs-400); line-height: 1.7; color: var(--c-text); max-width: 62ch;
}
.legal__section { margin-top: clamp(2rem, 3.5vw, 2.75rem); }
.legal__section:first-child { margin-top: 0; }
.legal__section h2 {
  padding-bottom: var(--sp-3);
  border-bottom: 2px solid var(--c-text);
  font-size: var(--fs-h4); font-weight: 600; letter-spacing: -.014em;
}
.legal__section p {
  margin-top: var(--sp-4);
  font-size: var(--fs-400); line-height: 1.75; color: var(--c-muted); max-width: 66ch;
}
.legal__section a {
  color: var(--c-brand); font-weight: 600; text-decoration: none;
  box-shadow: inset 0 -1px 0 var(--c-line-2);
  transition: box-shadow var(--dur) var(--ease), color var(--dur) var(--ease);
}
.legal__section a:hover { color: var(--c-text); box-shadow: inset 0 -2px 0 var(--c-signal); }

/* --- Mevzuat güncellemeleri listesi (Bilgi Merkezi) ---------------------- */
.updlist { border-top: 2px solid var(--c-text); }
.updlist__item { padding-block: var(--sp-6); border-bottom: 1px solid var(--c-line); }
.updlist__meta {
  display: flex; flex-wrap: wrap; gap: var(--sp-2) var(--sp-4);
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .12em; text-transform: uppercase; color: var(--c-muted);
}
.updlist__cat { color: var(--c-signal-dim); }
.updlist__title {
  margin-top: var(--sp-2);
  font-size: var(--fs-h4); font-weight: 600; letter-spacing: -.014em;
}
.updlist__summary {
  margin-top: var(--sp-2);
  font-size: var(--fs-400); line-height: 1.7; color: var(--c-muted); max-width: 64ch;
}
.updlist__links {
  display: flex; flex-wrap: wrap; gap: 0 var(--sp-4);
  margin-top: var(--sp-3);
}
.updlist__links a {
  display: inline-block; padding-block: .5rem;
  font-size: var(--fs-300); font-weight: 500;
  color: var(--c-brand); text-decoration: none;
  box-shadow: inset 0 -1px 0 var(--c-line-2);
  transition: box-shadow var(--dur) var(--ease), color var(--dur) var(--ease);
}
.updlist__links a:hover { color: var(--c-text); box-shadow: inset 0 -2px 0 var(--c-signal); }
.updlist__src { color: var(--c-muted) !important; }

/* --- İletişim sayfası (/iletisim/) --------------------------------------- */
.ct-direct {
  margin-top: clamp(1.75rem, 3vw, 2.5rem);
  padding-top: var(--sp-5);
  border-top: 2px solid var(--c-text);
}
.ct-direct__phone {
  display: inline-block; margin-top: var(--sp-2);
  font-size: clamp(1.5rem, 1.15rem + 1.4vw, 2.25rem);
  font-weight: 700; font-stretch: var(--wd-head); letter-spacing: -.026em;
  color: inherit; text-decoration: none;
  box-shadow: inset 0 -2px 0 var(--c-signal);
  transition: color var(--dur) var(--ease);
}
.ct-direct__phone:hover { color: var(--c-brand); }
.ct-direct__mail { margin-top: var(--sp-3); font-size: var(--fs-500); }
.ct-direct__mail a {
  color: var(--c-brand); font-weight: 600; text-decoration: none;
  box-shadow: inset 0 -1px 0 var(--c-line-2);
}
.ct-direct__mail a:hover { color: var(--c-text); box-shadow: inset 0 -2px 0 var(--c-signal); }
.ct-direct__hours {
  margin-top: var(--sp-3);
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .12em; text-transform: uppercase; color: var(--c-muted);
}

/* --- İletişim: ne için ulaşabilirsiniz ----------------------------------- */
.ct-reasons { display: grid; border-top: 2px solid var(--c-text); }
@media (min-width: 56rem) {
  .ct-reasons { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(2.5rem, 5vw, 4.5rem); }
}
.ct-reason { padding-block: var(--sp-6); border-bottom: 1px solid var(--c-line); }
.ct-reason__name { font-size: var(--fs-h4); font-weight: 600; letter-spacing: -.014em; }
.ct-reason__body {
  margin-top: var(--sp-2);
  font-size: var(--fs-400); line-height: 1.68; color: var(--c-muted); max-width: 50ch;
}
.ct-reason .link { margin-top: var(--sp-2); }

/* Bölge listesinde merkez ofis rozeti — yalnızca rozet varken (iletişim
   sayfası) uygulanır; sektör sayfalarındaki liste etkilenmez. */
.secreg__name .hubreg__hq { margin-left: var(--sp-3); }

.ct-office {
  display: grid; gap: var(--sp-1);
  margin-top: var(--sp-3); padding-top: var(--sp-4);
  border-top: 2px solid var(--c-text);
  font-style: normal;
}
.ct-office__name { font-size: var(--fs-600); font-weight: 600; letter-spacing: -.012em; }
.ct-office__line { font-size: var(--fs-300); line-height: 1.6; color: var(--c-muted); }
.ct-office__note {
  margin-top: var(--sp-3); padding-top: var(--sp-3);
  border-top: 1px solid var(--c-line);
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .12em; text-transform: uppercase; color: var(--c-muted);
}

.ct-loc { display: grid; gap: clamp(2rem, 4vw, 3rem); align-items: start; }
@media (min-width: 64rem) {
  .ct-loc { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: clamp(2.5rem, 5vw, 4.5rem); }
}
.ct-loc__body h2 { margin-top: var(--sp-2); max-width: 18ch; }
.ct-loc__text {
  margin-top: var(--sp-4);
  font-size: var(--fs-400); line-height: 1.7; color: var(--c-muted); max-width: 56ch;
}
.ct-loc__body .facts { margin-top: clamp(1.5rem, 2.5vw, 2rem); }
.ct-loc__body .facts__v a {
  color: var(--c-brand); font-weight: 600; text-decoration: none;
  box-shadow: inset 0 -1px 0 var(--c-line-2);
}
.ct-loc__body .facts__v a:hover { color: var(--c-text); box-shadow: inset 0 -2px 0 var(--c-signal); }

/* --- Referans kayıtları (veri geldiğinde) -------------------------------- */
.reflist { border-top: 2px solid var(--c-text); }
.reflist__row {
  display: grid; grid-template-columns: 2.5rem minmax(0, 1fr);
  column-gap: var(--sp-4);
  padding-block: clamp(1.5rem, 2.5vw, 2rem);
  border-bottom: 1px solid var(--c-line);
}
@media (min-width: 64rem) {
  .reflist__row {
    grid-template-columns: 3rem minmax(0, 6fr) minmax(0, 5fr);
    column-gap: clamp(1.5rem, 3vw, 2.75rem);
    align-items: start;
  }
}
.reflist__no {
  grid-row: 1;
  font-family: var(--ff-mono); font-size: var(--fs-200);
  letter-spacing: .1em; color: var(--c-signal-dim); padding-top: .3rem;
}
.reflist__main { grid-row: 1; }
.reflist__name { font-size: var(--fs-h3); font-weight: 700; font-stretch: var(--wd-head); letter-spacing: -.024em; }
.reflist__meta {
  display: flex; flex-wrap: wrap; gap: 0;
  margin-top: var(--sp-2);
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .1em; text-transform: uppercase; color: var(--c-muted);
}
.reflist__meta span + span::before { content: "·"; margin-inline: var(--sp-2); color: var(--c-line-2); }
.reflist__scope {
  margin-top: var(--sp-3);
  font-size: var(--fs-400); line-height: 1.68; color: var(--c-muted); max-width: 56ch;
}
.reflist__services {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 var(--sp-4);
  grid-column: 2; margin-top: var(--sp-3);
}
@media (min-width: 64rem) {
  .reflist__services { grid-row: 1; grid-column: 3; margin-top: .35rem; }
}
.reflist__services a {
  display: inline-block; padding-block: .5rem;
  font-size: var(--fs-300); font-weight: 500;
  color: var(--c-brand); text-decoration: none;
  box-shadow: inset 0 -1px 0 var(--c-line-2);
  transition: box-shadow var(--dur) var(--ease), color var(--dur) var(--ease);
}
.reflist__services a:hover { color: var(--c-text); box-shadow: inset 0 -2px 0 var(--c-signal); }

/* Teklif formu: "neden bu bilgiler" notu */
.quote__why {
  margin-top: var(--sp-4);
  padding-left: var(--sp-4);
  border-left: 1px solid var(--c-line-2);
  font-size: var(--fs-300); line-height: 1.7; color: var(--c-muted); max-width: 44ch;
}

.reflist__note {
  margin-top: clamp(1.75rem, 3vw, 2.5rem);
  padding-left: var(--sp-4);
  border-left: 3px solid var(--c-signal);
  max-width: 68ch;
  font-size: var(--fs-400); line-height: 1.7; color: var(--c-text);
}


/* ==========================================================================
   21 — YARDIMCILAR
   ========================================================================== */

.visually-hidden {
  position: absolute !important;
  width: 1px; height: 1px; margin: -1px; padding: 0;
  overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%);
  white-space: nowrap; border: 0;
}
.h3 { font-size: var(--fs-h3); }
.text-muted { color: var(--c-muted); }
.mt-4 { margin-top: var(--sp-4); }
.mt-6 { margin-top: var(--sp-6); }
.mt-8 { margin-top: var(--sp-8); }
.mt-10 { margin-top: var(--sp-10); }


/* ==========================================================================
   22 — HAREKET VE ERİŞİLEBİLİRLİK
   --------------------------------------------------------------------------
   Açılma efekti YALNIZCA .js sınıfı varken uygulanır. JavaScript
   çalışmazsa (kapalı, hata, engellenmiş) içerik ilk boyamada görünür —
   SEO içeriği hiçbir koşulda gizli kalmaz.
   ========================================================================== */

.js [data-reveal] {
  opacity: 0;
  transform: translateY(10px);
  transition: opacity 440ms var(--ease), transform 440ms var(--ease);
}
.js [data-reveal].is-visible { opacity: 1; transform: none; }
/* Emniyet açılışında geçiş devre dışı: kare üretmeyen ortamlarda
   içerik yarı saydam donmasın (bkz. main.js revealAll). */
.reveal-instant [data-reveal] { transition: none !important; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
  .js [data-reveal] { opacity: 1; transform: none; }
}

@media print {
  .site-header, .drawer, .cta-band, .nav-toggle, .hero__media, .field__media { display: none !important; }
  body { color: #000; background: #fff; font-size: 11pt; }
  a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 9pt; color: #555; }
}

/* ==========================================================================
   MEVZUAT MADDESİ SAYFASI  (/haberler/<slug>/)
   Tek sütun, okuma odaklı. Sayfanın asıl içeriği ESA'nın
   değerlendirmesidir; resmî künye yardımcı bir kutuda durur.
   ========================================================================== */
.mvz { max-width: 46rem; }
.mvz__h1 { margin-top: var(--sp-2); text-wrap: balance; }
.mvz__body { margin-top: var(--sp-6); }
.mvz__body p { color: var(--c-muted); line-height: 1.72; }

/* Resmî künye — alıntı değil, kaynak künyesi. Bu yüzden tırnak
   değil, kenar çizgisi ve etiketle ayrılıyor. */
.mvz__src {
  margin-top: var(--sp-7);
  padding: var(--sp-5);
  border: 1px solid var(--c-line);
  border-left: 3px solid var(--c-brand);
  background: var(--c-paper);
}
.mvz__src-label {
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .13em; text-transform: uppercase; color: var(--c-faint);
}
.mvz__src-title { margin-top: var(--sp-2); font-weight: 600; line-height: 1.4; }
.mvz__src-meta  { margin-top: var(--sp-1); color: var(--c-muted); font-size: var(--fs-200); }
.mvz__src .link { margin-top: var(--sp-3); display: inline-flex; }

.mvz__rel { margin-top: var(--sp-7); }
.mvz__rel-list {
  display: flex; flex-wrap: wrap; gap: var(--sp-2) var(--sp-4);
  margin-top: var(--sp-2);
}
.mvz__back { margin-top: var(--sp-7); }

/* Listedeki başlık artık bağlantı olabiliyor. */
.updlist__title a, .insight__title a { color: inherit; text-decoration: none; }
.updlist__title a:hover, .insight__title a:hover {
  color: var(--c-brand); text-decoration: underline;
}

/* ==========================================================================
   KARİYER  (/is-basvurusu/)
   Sayfaya gelen kişi zaten başvurmaya gelmiştir; e-posta adresi
   sayfanın en üstünde, aranmadan bulunacak yerde durur.
   ========================================================================== */
.crr { max-width: 46rem; }
.crr__lead { margin-top: var(--sp-4); color: var(--c-muted); line-height: 1.7; }

.crr__apply {
  margin-top: var(--sp-6);
  padding: var(--sp-5);
  border: 1px solid var(--c-line);
  border-left: 3px solid var(--c-signal);
  background: var(--c-paper);
}
.crr__apply-label {
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .13em; text-transform: uppercase; color: var(--c-faint);
}
.crr__apply-mail { margin-top: var(--sp-2); font-size: var(--fs-h4); font-weight: 600; }
.crr__apply-mail a { color: var(--c-brand); }
.crr__apply-note { margin-top: var(--sp-2); color: var(--c-muted); font-size: var(--fs-200); }

/* İki sütun: solda başlık, sağda içerik — sitedeki bölüm ritmi. */
.crr__two { display: grid; gap: var(--sp-6); }
@media (min-width: 56rem) {
  .crr__two { grid-template-columns: minmax(0, 22rem) minmax(0, 1fr); gap: var(--sp-8); }
}
.crr__sub { margin-top: var(--sp-3); color: var(--c-muted); line-height: 1.7; }

.crr__list { margin: var(--sp-2) 0 0 1.1rem; }
.crr__list li { padding: var(--sp-1) 0; color: var(--c-muted); line-height: 1.6; }

.crr__posts { border-top: 1px solid var(--c-line); margin-top: var(--sp-5); }
.crr__post { padding-block: var(--sp-5); border-bottom: 1px solid var(--c-line); }
.crr__post-title { font-size: var(--fs-h4); font-weight: 600; }
.crr__post-meta {
  display: flex; gap: var(--sp-4); margin-top: var(--sp-2);
  font-family: var(--ff-mono); font-size: var(--fs-100);
  letter-spacing: .1em; text-transform: uppercase; color: var(--c-faint);
}
.crr__post-sum { margin-top: var(--sp-3); color: var(--c-muted); line-height: 1.7; }
.crr__post-cta { margin-top: var(--sp-4); }

.crr__kvkk { max-width: 46rem; }
.crr__kvkk-h { font-size: var(--fs-h4); font-weight: 600; }
.crr__kvkk p { margin-top: var(--sp-3); color: var(--c-muted); line-height: 1.7; }
