/*
Theme Name:   Ortak Akıl — Hello Child
Theme URI:    https://www.ortakakildanismanlik.com/
Description:  Ortak Akıl Danışmanlık tasarım sistemi. Hello Elementor child theme'i; tüm tasarım değişkenleri ve bileşen stilleri burada. Elementor widget'ları bu sınıfları kullanır.
Author:       Dijivo
Template:     hello-elementor
Version:      1.0.0
Text Domain:  ortak-akil-child
*/
/* ===========================================================================
   V8 — İNDİGO · 10 bölümlük akış
/* ===========================================================================
   V8 — İNDİGO · 10 bölümlük akış
   Referans kalıpları (yapı alındı, kod değil):
     perahali.com → üstte kayan duyuru şeridi · beyaz header (logo sol,
                    menü orta, aksiyon sağ) · ORTASI BÜYÜK, İKİ YANI TAŞAN
                    "peek" carousel
     mazhar.softasist.com → numaralı sekme kartları (aktif indigo dolgulu) +
                    sayaçlı panel · kısa çizgili eyebrow · ↗ bağlantılar
   Varlıklar: firmanın kendi logosu, 77 referans logosu, 4 galeri fotoğrafı,
              4 hizmet görseli — hepsi WebP'ye çevrildi.
   ========================================================================= */

/* Başlık fontu: Plus Jakarta Sans — 600/700/800 ağırlıkları yerelde.
   Değiştirmek için yalnızca bu blok + --hd yeterli.
   Yerelde hazır alternatifler: Sora · SpaceGrotesk · BricolageGrotesque ·
   Archivo · Lora · SourceSerif4 · BarlowCondensed */
@font-face{font-family:Jakarta;src:url(assets/fonts/PlusJakartaSans-600-latin-ext.woff2) format('woff2');font-weight:800;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:Jakarta;src:url(assets/fonts/PlusJakartaSans-600-latin.woff2) format('woff2');font-weight:800;font-display:swap;}
@font-face{font-family:Jakarta;src:url(assets/fonts/PlusJakartaSans-700-latin-ext.woff2) format('woff2');font-weight:700;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:Jakarta;src:url(assets/fonts/PlusJakartaSans-700-latin.woff2) format('woff2');font-weight:700;font-display:swap;}
@font-face{font-family:Jakarta;src:url(assets/fonts/PlusJakartaSans-600-latin-ext.woff2) format('woff2');font-weight:600;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:Jakarta;src:url(assets/fonts/PlusJakartaSans-600-latin.woff2) format('woff2');font-weight:600;font-display:swap;}
@font-face{font-family:Inter;src:url(assets/fonts/Inter-400-latin-ext.woff2) format('woff2');font-weight:400;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:Inter;src:url(assets/fonts/Inter-400-latin.woff2) format('woff2');font-weight:400;font-display:swap;}
@font-face{font-family:Inter;src:url(assets/fonts/Inter-400-latin-ext.woff2) format('woff2');font-weight:500;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:Inter;src:url(assets/fonts/Inter-400-latin.woff2) format('woff2');font-weight:500;font-display:swap;}
@font-face{font-family:Inter;src:url(assets/fonts/Inter-400-latin-ext.woff2) format('woff2');font-weight:700;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:Inter;src:url(assets/fonts/Inter-400-latin.woff2) format('woff2');font-weight:700;font-display:swap;}

:root{
  /* İNDİGO ölçeği */
  --i900:#1e1b4b; --i800:#282363; --i700:#312e81; --i600:#3730a3;
  --i500:#4338ca; --i400:#4f46e5; --i300:#818cf8; --i200:#c7d2fe;
  --i150:#ddd9fe; --i100:#eef0ff; --i50:#f6f7ff;
  --ink:#191640; --body:#575379; --mute:#6b6788;
  --line:#e6e6f2; --line-2:#f0f0f8;

  --hd:Jakarta,"Segoe UI",Arial,sans-serif;
  --bd:Inter,"Segoe UI",Roboto,Arial,sans-serif;

  --wrap:81.25rem;   /* 1300px @16px kök */
  --gut:clamp(1.1rem,3.4vw,2.75rem);
  --r:1.125rem; --r-s:.75rem; --pill:999px;
  /* Bölüm dolgusu ~%18 kısaldı: sayfalar 6–9 ekrana çıkıyordu, boşluk
     tek başına sayfa başına ~800px tutuyordu. Ritim korunuyor. */
  --py:clamp(2.15rem,4.1vw,3.6rem);
  --sh:0 1px 2px rgba(30,27,75,.04),0 12px 36px rgba(30,27,75,.08);
  --sh-l:0 10px 26px rgba(30,27,75,.1),0 34px 70px rgba(30,27,75,.14);
  --ease:cubic-bezier(.22,.75,.28,1);
}

*,*::before,*::after{box-sizing:border-box}

/* ── <button> nötrleme ─────────────────────────────────────────────────
   Hello Elementor'un reset.css'i HER düğmeye kendi temasını dayatıyor:
   varsayılanda 1px #c36 kenarlık + #c36 metin, :hover/:focus'ta dolgu
   #c36 zemin. Tasarımdaki düğmelerin neredeyse tamamı görünmez tetikleyici
   (sekme, akordiyon, carousel oku, hamburger, menü oku) ve `button:hover`
   (0,1,1) tek sınıflı kurallarımızı (0,1,0) yeniyordu — sekmeye basınca
   pembe kutu bundan çıkıyordu.

   Özgüllük bilerek Hello'nunkiyle aynı: child theme sonra yüklendiği için
   kaynak sırası kazandırıyor. Böylece .btn (0,1,0) ve .btn:hover (0,2,0)
   gibi kendi kurallarımız etkilenmiyor. */
button,[type=button],[type=submit]{
  background-color:transparent;border:0;border-radius:0;color:inherit;
  padding:0;font:inherit;text-align:inherit;white-space:normal;
  -webkit-appearance:none;appearance:none}
button:hover,button:focus,
[type=button]:hover,[type=button]:focus,
[type=submit]:hover,[type=submit]:focus{
  background-color:transparent;color:inherit;text-decoration:none}

/* Kök ölçek. Tasarım tarayıcıda %120 yakınlaştırmada istenen yoğunluğu veriyordu;
   o görünüm varsayılan hâline alındı. Yüzde kullanılıyor, sabit piksel değil:
   ziyaretçi tarayıcısının yazı boyutunu büyütmüşse oran korunur (erişilebilirlik).

   rem tabanlı her şey birlikte büyür — tipografi, boşluklar, --wrap. Medya
   sorguları px kalır: CSS'te medya sorgusundaki em/rem her zaman 16px'e göre
   hesaplanır, html font-size'ı dinlemez; px yazmak bu yüzden daha dürüst. */
html{font-size:120%;-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:7.5rem}
body{margin:0;font-family:var(--bd);font-size:1rem;line-height:1.7;color:var(--body);background:#fff;-webkit-font-smoothing:antialiased;overflow-x:clip}
img,svg{max-width:100%;height:auto;display:block}
a{color:var(--i500);text-underline-offset:2px}

h1,h2,h3,h4{font-family:var(--hd);font-weight:700;color:var(--ink);line-height:1.1;letter-spacing:-.032em;margin:0 0 .5em}
h1{font-size:clamp(2.05rem,4.2vw,3.5rem);overflow-wrap:break-word}
h2{font-size:clamp(1.7rem,3.2vw,2.7rem);overflow-wrap:break-word}
h3{font-size:clamp(1.05rem,1.5vw,1.3rem);letter-spacing:-.024em;line-height:1.2}
p{margin:0 0 1.05em}p:last-child{margin-bottom:0}
:focus-visible{outline:3px solid var(--i400);outline-offset:3px;border-radius:8px;box-shadow:0 0 0 3px #fff}
.skip{position:absolute;left:-9999px;background:var(--i700);color:#fff;padding:.8rem 1.2rem;z-index:999}
.skip:focus{left:0}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

.wrap{width:min(100% - (var(--gut) * 2),var(--wrap));margin-inline:auto}
.sec{padding-block:var(--py)}
.sec--l{background:var(--i50)}
.sec--d{background:var(--i900);color:var(--i200)}
.sec--d h2,.sec--d h3{color:#fff}

/* Hareket */
.rv{opacity:0;transform:translateY(20px);transition:opacity .65s var(--ease),transform .65s var(--ease);transition-delay:var(--d,0ms)}
html:not(.js) .rv{opacity:1;transform:none}
.rv.in{opacity:1;transform:none}
@keyframes ticker{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition-duration:.01ms!important}
  .rv{opacity:1;transform:none}
}

/* ═══════════════════════════════════════════════════════════════════════
   SECTION TITLE — egeplast.softasist.com "minimal rule" kalıbı
   Yapı : eyebrow → başlık → başlık altı gradient çizgi → açıklama
   Ölçü : eyebrow 12px/900/.15em · çizgi 180×2px, üst boşluk 22px
          metin bloğu max 850px
   Varyantlar: .st--rule (varsayılan, gradient) · .st--solid (düz çizgi)
               .st--label (eyebrow'un iki yanında çizgi, alt çizgi yok)
               .st--center (ortalı)
   ═══════════════════════════════════════════════════════════════════════ */
.st{
  --st-brand:var(--i500);
  --st-accent:var(--i300);
  --st-cw:850px;
  --st-line-w:180px;
  --st-line-h:3px;
  --st-align:left;
  --st-justify:flex-start;
  width:min(100%,var(--st-cw));text-align:var(--st-align)}
.st__k{display:inline-flex;align-items:center;justify-content:var(--st-justify);gap:.75rem;
  font-family:var(--bd);font-size:.75rem;font-weight:900;letter-spacing:.15em;text-transform:uppercase;
  color:var(--st-brand);margin:0}
.st__h{margin:.6rem 0 0;color:var(--ink);font-size:clamp(1.75rem,3.6vw,2.85rem);font-weight:700;
  line-height:1.08;letter-spacing:-.035em}
.st__h::after{content:"";display:block;width:min(100%,var(--st-line-w));height:var(--st-line-h);
  margin-top:.95rem;margin-inline:var(--st-mi,0) auto;border-radius:var(--pill);
  background:linear-gradient(90deg,var(--st-brand) 0%,var(--st-accent) 42%,transparent 100%)}
.st__d{margin:.55rem 0 0;font-size:1rem;line-height:1.62;color:var(--body)}

.st--solid .st__h::after{background:var(--st-brand)}
.st--label .st__k{gap:.9rem}
.st--label .st__k::before,.st--label .st__k::after{content:"";width:clamp(22px,4vw,58px);height:var(--st-line-h);
  border-radius:var(--pill);background:var(--st-brand)}
.st--label .st__h::after{display:none}
.st--center{--st-align:center;--st-justify:center;margin-inline:auto}
.st--center .st__h::after{margin-inline:auto}

/* Koyu zeminde */
.sec--d .st{--st-brand:var(--i300);--st-accent:var(--i200)}
.sec--d .st__h{color:#fff}
.sec--d .st__d{color:var(--i200)}

/* Bölüm başlığı satırı: solda başlık bloğu, sağda opsiyonel aksiyon */
.head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:1.15rem 3rem;
  margin-bottom:clamp(1.5rem,2.6vw,2.15rem)}
.head .st{flex:1 1 min(100%,var(--st-cw))}
.head .arrow{margin-bottom:.4rem}
/* MAZHAR KALIBI — ↗ bağlantı */
.arrow{display:inline-flex;align-items:center;gap:.5rem;font-size:.8rem;font-weight:700;letter-spacing:.09em;
  text-transform:uppercase;color:var(--i500);text-decoration:none;padding-bottom:.5rem;border-bottom:2px solid var(--i500);
  transition:gap .25s var(--ease)}
.arrow:hover{gap:.85rem}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;padding:.95rem 1.9rem;border-radius:var(--pill);
  font-family:var(--bd);font-size:.93rem;font-weight:600;background:var(--i500);color:#fff;border:2px solid var(--i500);
  text-decoration:none;cursor:pointer;transition:background-color .25s,border-color .25s,color .25s,transform .25s var(--ease)}
.btn:hover{background:var(--i600);border-color:var(--i600);color:#fff;transform:translateY(-1px)}
.btn--o{background:transparent;color:#fff;border-color:rgba(255,255,255,.45)}
.btn--o:hover{background:#fff;border-color:#fff;color:var(--i700)}
.btn--l{background:transparent;color:var(--ink);border-color:var(--line)}
.btn--l:hover{background:var(--ink);border-color:var(--ink);color:#fff}
.btn--s{padding:.6rem 1.3rem;font-size:.85rem}
.btns{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:1.5rem}

/* ── Üst bilgi şeridi (telefon · e-posta · adres) ───────────────────────
   Sabit iletişim bilgisi; kayan duyuru şeridi DEĞİL, hareket etmez.
   Dar ekranda gizlenir: aynı bilgiler footer'da ve .fab düğmelerinde var,
   üstelik başlık orada zaten sıkışık. */
.tbar{background:var(--i50);border-bottom:1px solid var(--line);font-size:.8rem;display:none}
@media(min-width:900px){.tbar{display:block}}
.tbar .wrap{width:min(100% - (var(--gut) * 2),102.5rem);
  display:flex;flex-wrap:wrap;align-items:center;gap:.4rem 1.9rem;
  padding-block:.55rem;justify-content:flex-end}
/* Slogan solda, iletişim bilgileri sağda: margin-right:auto ikisini
   ayırıyor, ayrı bir kapsayıcı gerekmiyor. */
.tbar__slogan{margin-right:auto;font-family:var(--hd);font-weight:700;
  letter-spacing:.02em;color:var(--i600)}
.tbar__i{display:inline-flex;align-items:center;gap:.45rem;
  color:var(--body);text-decoration:none;white-space:nowrap;transition:color .2s}
.tbar__i svg{color:var(--i500);flex:none}
a.tbar__i:hover{color:var(--i600)}
.tbar__i--a{color:var(--mute)}

/* ══ PERAHALI KALIBI — header ══ */
.hdr{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.92);backdrop-filter:saturate(1.6) blur(14px);border-bottom:1px solid var(--line)}
/* Header, gövde container'ından daha geniş — carousel tam genişlikte olduğu
   için üst blok da nefes alsın. */
.hdr .wrap{width:min(100% - (var(--gut) * 2),102.5rem);
  display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:1.6rem;min-height:86px}
/* Logo hiçbir genişlikte sıkışmamalı: grid kolonu daralınca img
   width:auto olsa bile kolon min-width:auto ile eziliyordu
   (ölçüldü: 360px'te 57×30, doğal oran 107×30 olmalı). */
.logo{display:block;flex:none;min-width:max-content}
.logo img{height:clamp(34px,3.2vw,44px);width:auto}
.nav{justify-self:center}
.nav ul{display:flex;align-items:center;list-style:none;margin:0;padding:0;gap:.15rem}
.nav a{position:relative;display:block;padding:.6rem .8rem;white-space:nowrap;
  font-size:.92rem;font-weight:500;color:var(--body);text-decoration:none;transition:color .2s}
/* Vercel deseni: üzerine gelince marka renginde alt çizgi. Çizgi
   ::after ile çiziliyor, text-decoration ile değil — kalınlığı ve
   konumu böyle denetlenebiliyor ve geçiş yumuşak oluyor. */
.nav a::after{content:"";position:absolute;left:.8rem;right:.8rem;bottom:.3rem;height:2px;
  border-radius:var(--pill);background:var(--i500);
  transform:scaleX(0);transform-origin:left;transition:transform .22s var(--ease)}
.nav a:hover{color:var(--i600)}
.nav a:hover::after{transform:scaleX(1)}
.nav a[aria-current="page"],.nav a.is-in{color:var(--i600);font-weight:600}
.nav a[aria-current="page"]::after{transform:scaleX(1)}
/* Alt menüsü olan başlıkta çizgi ok simgesinin altına taşmasın */
.nav__alt>a::after{right:1.75rem}
.hdr__r{display:flex;align-items:center;gap:.9rem;justify-self:end}
.hdr__tel{display:inline-flex;align-items:center;gap:.5rem;font-size:.9rem;font-weight:600;color:var(--ink);text-decoration:none;white-space:nowrap}
.hdr__tel:hover{color:var(--i500)}
.lang{display:flex;gap:.15rem;font-size:.78rem;font-weight:600}
.lang a,.lang span{padding:.3rem .5rem;border-radius:var(--pill);color:var(--mute);text-decoration:none}
.lang [aria-current]{background:var(--i100);color:var(--i600)}
.burger{display:none;background:none;border:1px solid var(--line);border-radius:var(--pill);padding:.6rem .75rem;cursor:pointer;color:var(--ink)}
@media(max-width:1219px){
  .hdr .wrap{grid-template-columns:auto 1fr auto}
  .nav{display:none}
  .burger{display:inline-flex;justify-self:end;order:3}
  .hdr__tel,.lang{display:none}
  #nav{position:fixed;inset:112px var(--gut) auto;background:#fff;border:1px solid var(--line);border-radius:var(--r);
       box-shadow:var(--sh-l);max-height:0;overflow:hidden;transition:max-height .35s var(--ease);z-index:99}
  #nav[data-open=true]{max-height:calc(100vh - 140px);overflow-y:auto}
  #nav ul{list-style:none;margin:0;padding:.6rem;display:flex;flex-direction:column;gap:.1rem}
  #nav a{display:block;padding:.9rem 1rem;border-radius:var(--r-s);font-size:1rem;color:var(--body);text-decoration:none}
  #nav a:hover{background:var(--i100)}
}
@media(min-width:1220px){#nav{display:none}}

/* ── Açılır mega menü (Vercel kalıbı) ───────────────────────────────────
   Başlığın altında TAM GENİŞLİK bir panel; içinde gri sütun başlıkları ve
   düz bağlantı listeleri. İkon ve açıklama yok — Vercel'in kendi deseni bu.

   Tam genişliği position:absolute veriyor: .hdr sticky olduğu için
   konumlanmış bir ata; panel <li> içinde dursa da left:0;right:0 ile
   header'ın genişliğine yayılıyor. Panel <li> içinde kaldığı için açma
   :hover / :focus-within ile CSS'te olur — JS yüklenmeden de çalışır. */
.nav__alt{position:relative}
.nav__alt>a{padding-right:1.75rem}
.nav__alt>a.is-in{color:var(--i600);font-weight:600}
.nav__ac{position:absolute;right:.35rem;top:50%;transform:translateY(-50%);
  display:grid;place-items:center;width:1.5rem;height:1.5rem;padding:0;
  background:none;border:0;border-radius:var(--pill);color:var(--mute);cursor:pointer}
.nav__ac svg{transition:transform .26s var(--ease)}
.nav__p ul{list-style:none;margin:0;padding:0}
.nav__col__k{display:block;font-size:.9rem;font-weight:600;color:var(--mute)}

@media(min-width:1220px){
  /* Panel viewport genişliğine yayılsın diye .nav__alt static kalmak zorunda.
     Bu yüzden .nav__ac absolute konumlanamaz: konumlanmış en yakın ata header
     olur ve ok menünün en sağına kaçar. Masaüstünde oku akışta bırakıp
     etiketin hemen yanına alıyoruz. */
  .nav__alt{position:static;display:flex;align-items:center;gap:.1rem}
  .nav__alt>a{padding-right:0}
  .nav__alt>a::after{right:0}
  /* 1.3rem = 24.96px: WCAG 2.5.8 eşiği 24px. İkon 11px kalıyor,
     büyüyen yalnız tıklama alanı. */
  .nav__ac{position:static;transform:none;width:1.3rem;height:1.3rem}
  .nav__p{position:absolute;left:0;right:0;top:100%;z-index:120;
    background:#fff;border-bottom:1px solid var(--line);
    box-shadow:0 18px 40px rgba(30,27,75,.10);
    opacity:0;visibility:hidden;transform:translateY(-.4rem);
    transition:opacity .18s var(--ease),transform .18s var(--ease),visibility .18s}
  .nav__p__g{width:min(100% - (var(--gut) * 2),102.5rem);margin-inline:auto;
    display:grid;grid-template-columns:repeat(auto-fit,minmax(0,14rem));
    gap:1.4rem 3.2rem;padding-block:clamp(1.3rem,2vw,1.85rem);
    justify-content:start}
  .nav__col__k{margin-bottom:.75rem}
  .nav__p a{position:relative;display:inline-block;padding:.34rem 0;font-size:1.12rem;
    color:var(--ink);text-decoration:none;transition:color .16s}
  .nav__p a::after{content:"";position:absolute;left:0;right:0;bottom:.1rem;height:2px;
    border-radius:var(--pill);background:var(--i500);
    transform:scaleX(0);transform-origin:left;transition:transform .2s var(--ease)}
  .nav__p a:hover{color:var(--i500)}
  .nav__p a:hover::after{transform:scaleX(1)}
  .nav__p a[aria-current]::after{transform:scaleX(1)}
  .nav__p a[aria-current]{color:var(--i600);font-weight:600}
  .nav__p ul{display:grid;gap:.05rem}

  .nav__alt:hover>.nav__p,
  .nav__alt:focus-within>.nav__p,
  .nav__ac[aria-expanded="true"]+.nav__p{opacity:1;visibility:visible;transform:none}
  .nav__alt:hover>.nav__ac svg,
  .nav__alt:focus-within>.nav__ac svg,
  .nav__ac[aria-expanded="true"] svg{transform:rotate(180deg)}
}

/* Mobil: akordiyon. Kapalıyken visibility ile sekme sırasından da çıkar. */
@media(max-width:1219px){
  #nav .nav__p{max-height:0;overflow:hidden;visibility:hidden;
    transition:max-height .32s var(--ease),visibility .32s}
  #nav .nav__ac[aria-expanded="true"]+.nav__p{max-height:44rem;visibility:visible}
  #nav .nav__ac[aria-expanded="true"] svg{transform:rotate(180deg)}
  #nav .nav__p__g{display:grid;gap:.9rem;padding:.3rem 0 .7rem .9rem}
  #nav .nav__col__k{margin-bottom:.25rem;font-size:.72rem;letter-spacing:.1em;
    text-transform:uppercase}
  #nav .nav__p a{display:block;padding:.6rem .75rem;border-radius:var(--r-s);
    font-size:1.04rem;color:var(--body);text-decoration:none}
  #nav .nav__p a:hover{background:var(--i100);color:var(--i600)}
  #nav .nav__p a[aria-current]{color:var(--i600);font-weight:600}
  #nav .nav__ac{right:.5rem;width:2.75rem;height:2.75rem}
}

/* ══ 1. PERAHALI KALIBI — "peek" carousel ══ */
/* Tam genişlik — container yok. Aktif slayt ortada, iki yanı taşar. */
.car{width:100%;padding-block:clamp(1.2rem,2.4vw,2rem) clamp(1.6rem,3vw,2.4rem);overflow:hidden}
.car__vp{position:relative;width:100%}
.car__tr{display:flex;gap:clamp(.6rem,1.4vw,1.1rem);transition:transform .7s var(--ease);will-change:transform}
.car__tr.no-anim{transition:none}
.car__s{position:relative;flex:0 0 var(--slide-w,64%);border-radius:var(--r);overflow:hidden;
  aspect-ratio:16/9;min-height:clamp(360px,54vh,560px);
  background:var(--i800);transition:opacity .5s var(--ease),transform .5s var(--ease)}
@media(max-width:1100px){.car__s{--slide-w:76%}}
@media(max-width:760px){.car__s{--slide-w:88%;aspect-ratio:4/3}}
.car__s:not(.is-on){opacity:1}
.car__s:not(.is-on)::after{background:linear-gradient(180deg,rgba(24,21,64,.78) 0%,rgba(24,21,64,.86) 100%)}
.car__s:not(.is-on) .car__c{opacity:0;pointer-events:none;transition:opacity .35s var(--ease)}
.car__s img{width:100%;height:100%;object-fit:cover}
.car__s::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,rgba(24,21,64,.72) 0%,rgba(24,21,64,.42) 55%,rgba(24,21,64,.28) 100%)}
/* İçerik dikeyde ortalı: soyut zeminde alta yaslanınca slaytın üst yarısı
   boş kalıyordu. Fotoğraf geldiğinde de özneyi kapatmayan güvenli konum. */
.car__c{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;
  justify-content:center;align-items:flex-start;
  padding:clamp(1.6rem,4vw,3.6rem);text-align:left;color:#fff}
.car__k{display:inline-block;font-size:.72rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.3);padding:.4rem 1rem;border-radius:var(--pill);margin-bottom:1rem}
.car__t{font-family:var(--hd);font-size:clamp(1.5rem,3.9vw,3.35rem);font-weight:700;color:#fff;letter-spacing:-.035em;line-height:1.06;margin:0 0 .55rem;max-width:20ch}
.car__p{font-size:clamp(.88rem,1.2vw,1.05rem);color:#dcd9f7;max-width:46ch;margin:0 0 1.5rem}
@media(max-width:600px){.car__p{display:none}}
.car__btn{display:inline-flex;align-items:center;gap:.55rem;background:#fff;color:var(--i700);
  padding:.8rem 1.7rem;border-radius:var(--pill);font-size:.9rem;font-weight:600;text-decoration:none;transition:transform .25s var(--ease)}
.car__btn:hover{transform:translateY(-1px);color:var(--i700)}
.car__nav{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:46px;height:46px;border-radius:var(--pill);
  background:rgba(255,255,255,.92);border:0;display:grid;place-items:center;cursor:pointer;color:var(--i700);box-shadow:var(--sh)}
.car__nav:hover{background:#fff}
.car__nav--p{left:clamp(.4rem,1.4vw,1.2rem)}
.car__nav--n{right:clamp(.4rem,1.4vw,1.2rem)}
@media(max-width:600px){.car__nav{width:38px;height:38px}}
/* Nokta 9px görünür ama düğme 44px: WCAG 2.5.8 dokunma hedefi 24px'in
   altına inmemeli. Görsel nokta ::after'da, düğme saydam bir kap. */
.car__dots{display:flex;justify-content:center;align-items:center;gap:0;margin-top:1.3rem}
.car__dots button{width:44px;height:44px;padding:0;border:0;background:transparent;
  position:relative;cursor:pointer}
.car__dots button::after{content:"";position:absolute;top:50%;left:50%;
  transform:translate(-50%,-50%);width:9px;height:9px;border-radius:var(--pill);
  background:var(--i200);transition:width .3s,background-color .3s}
.car__dots button[aria-current="true"]::after{width:28px;background:var(--i500)}

/* ══ 2. HAKKIMIZDA ══ */
.about{display:grid;gap:clamp(1.8rem,3.4vw,3.4rem);align-items:center}
@media(min-width:980px){.about{grid-template-columns:.95fr 1.05fr}}
.about__m{position:relative;border-radius:var(--r);overflow:hidden;aspect-ratio:4/3;background:var(--i800)}
.about__m img{width:100%;height:100%;object-fit:cover}
.about__badge{position:absolute;left:1.1rem;bottom:1.1rem;background:rgba(255,255,255,.94);border-radius:var(--r-s);padding:.85rem 1.15rem}
.about__badge b{display:block;font-family:var(--hd);font-size:1.5rem;color:var(--ink);line-height:1;letter-spacing:-.04em}
.about__badge span{font-size:.76rem;color:var(--mute)}
.about p{font-size:.98rem}
.sign{display:flex;align-items:center;gap:.95rem;margin-top:1.8rem;padding-top:1.4rem;border-top:1px solid var(--line)}
.sign__i{flex:none;width:50px;height:50px;display:grid;place-items:center;border-radius:var(--pill);background:var(--i700);color:#fff;font-family:var(--hd);font-size:.88rem;font-weight:700}
.sign__n{display:block;font-family:var(--hd);font-size:1.02rem;font-weight:700;color:var(--ink);line-height:1.2}
.sign__r{display:block;font-size:.84rem;color:var(--mute)}

/* ══ 3. MAZHAR KALIBI — sekmeli vizyon & misyon ══ */
.tabs{display:grid;gap:.8rem;margin-bottom:1.4rem}
@media(min-width:720px){.tabs{grid-template-columns:repeat(3,1fr)}}
.tab{display:block;width:100%;text-align:left;background:#fff;border:1px solid var(--line);border-radius:var(--r-s);
  padding:1.1rem 1.3rem;cursor:pointer;font:inherit;transition:background-color .3s,border-color .3s,color .3s}
.tab span{display:block;font-family:var(--hd);font-size:.76rem;font-weight:700;color:var(--mute);margin-bottom:.35rem;letter-spacing:.05em}
.tab b{font-family:var(--hd);font-size:1.06rem;font-weight:700;color:var(--ink);letter-spacing:-.022em}
.tab:hover{border-color:var(--i300)}
.tab[aria-selected="true"]{background:var(--i500);border-color:var(--i500)}
.tab[aria-selected="true"] span{color:#c7d2fe}
.tab[aria-selected="true"] b{color:#fff}
.panel{background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;display:grid}
@media(min-width:900px){.panel{grid-template-columns:1fr .8fr}}
.panel[hidden]{display:none}
.panel__b{padding:clamp(1.7rem,3vw,2.8rem)}
.panel__c{display:block;font-family:var(--hd);font-size:.82rem;font-weight:700;color:var(--i400);margin-bottom:1.1rem}
.panel__b h3{font-size:clamp(1.4rem,2.2vw,1.9rem);margin-bottom:.55em}
.panel__b p{font-size:.98rem}
.panel__m{position:relative;background:var(--i800);min-height:200px}
.panel__m img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
.panel ul{list-style:none;margin:1.2rem 0 0;padding:0;display:grid;gap:.6rem}
.panel li{position:relative;padding-left:1.7rem;font-size:.94rem}
.panel li::before{content:"";position:absolute;left:0;top:.55em;width:10px;height:6px;border-left:2px solid var(--i500);border-bottom:2px solid var(--i500);transform:rotate(-45deg)}

/* ══ 4. REFERANS CAROUSEL ══ */

.mq+.mq{margin-top:.8rem}
.mq__t{display:flex;gap:.8rem;width:max-content;animation:ticker 60s linear infinite}
.mq--r .mq__t{animation-direction:reverse;animation-duration:72s}
.mq:hover .mq__t{animation-play-state:paused}
.lg{flex:none;width:clamp(140px,13vw,178px);height:clamp(78px,7.4vw,100px);display:grid;place-items:center;padding:1rem 1.2rem;
  background:#fff;border:1px solid var(--line);border-radius:var(--r-s);transition:border-color .3s,transform .3s var(--ease)}
.lg:hover{border-color:var(--i300);transform:translateY(-1px)}
.lg img{max-height:100%;width:auto;object-fit:contain;filter:grayscale(1);opacity:.62;transition:filter .3s,opacity .3s}
.lg:hover img{filter:none;opacity:1}

/* ══ 5. HİZMETLER ══ */
.svcs{display:grid;gap:1.1rem}
@media(min-width:720px){.svcs{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1140px){.svcs{grid-template-columns:repeat(3,1fr)}}
.svc{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;
  text-decoration:none;color:inherit;transition:box-shadow .35s var(--ease),transform .35s var(--ease),border-color .3s}
.svc:hover{box-shadow:var(--sh);transform:translateY(-5px);border-color:var(--i300)}
.svc__m{position:relative;aspect-ratio:16/10;background:var(--i800);overflow:hidden}
.svc__m img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.svc:hover .svc__m img{transform:scale(1.05)}
.svc__m span{position:absolute;left:1rem;top:1rem;z-index:1;font-family:var(--hd);font-size:.78rem;font-weight:700;color:#fff;
  background:rgba(30,27,75,.55);border:1px solid rgba(255,255,255,.25);padding:.28rem .7rem;border-radius:var(--pill)}
.svc__b{padding:1.5rem 1.5rem 1.6rem;display:flex;flex-direction:column;flex:1}
.svc__b h3{margin-bottom:.45em}
.svc__b p{font-size:.92rem;margin-bottom:1.2rem}
.svc__go{margin-top:auto;font-size:.85rem;font-weight:600;color:var(--i500);display:inline-flex;align-items:center;gap:.4rem;transition:gap .25s var(--ease)}
.svc:hover .svc__go{gap:.75rem}
.svc--flat .svc__m{background:linear-gradient(150deg,var(--i600),var(--i900));display:grid;place-items:center}
.svc--flat .svc__m b{font-family:var(--hd);font-size:2.6rem;color:rgba(255,255,255,.9);letter-spacing:-.05em}

/* ══ 6. BENTO ══ */
.bento{display:grid;gap:1rem;grid-template-columns:1fr}
@media(min-width:720px){.bento{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1140px){.bento{grid-template-columns:repeat(4,1fr);grid-auto-rows:minmax(180px,auto)}}
.bx{position:relative;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;
  background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1.5rem;text-decoration:none;color:inherit;
  transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .3s}
.bx:hover{transform:translateY(-6px);box-shadow:var(--sh);border-color:var(--i300)}
@media(min-width:1140px){.bx--h{grid-column:span 2;grid-row:span 2}.bx--w{grid-column:span 2}}
.bx__k{display:inline-flex;align-self:flex-start;font-size:.68rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--i500);background:var(--i100);padding:.3rem .8rem;border-radius:var(--pill);margin-bottom:.85rem}
.bx__t{font-family:var(--hd);font-size:1.22rem;font-weight:700;color:var(--ink);letter-spacing:-.028em;margin:0 0 .35em;line-height:1.15}
.bx__d{font-size:.9rem;margin:0}
.bx__n{display:block;font-family:var(--hd);font-size:clamp(2.4rem,4vw,3.4rem);font-weight:700;color:var(--ink);line-height:.92;letter-spacing:-.05em;margin-bottom:.3rem}
.bx--m{padding:0}
.bx--m img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.bx--m::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 30%,rgba(30,27,75,.88) 100%)}
.bx--m .bx__in{position:relative;z-index:1;padding:1.5rem;margin-top:auto}
.bx--m .bx__t{color:#fff}.bx--m .bx__d{color:#cbd0ff}
.bx--m .bx__k{background:rgba(255,255,255,.18);color:#fff}
.bx--i{background:linear-gradient(150deg,var(--i500),var(--i700));border-color:transparent}
.bx--i .bx__t,.bx--i .bx__n{color:#fff}.bx--i .bx__d{color:#d6d9ff}
.bx--i .bx__k{background:rgba(255,255,255,.2);color:#fff}
.bx--d{background:var(--i900);border-color:var(--i900)}
.bx--d .bx__t,.bx--d .bx__n{color:#fff}.bx--d .bx__d{color:var(--i200)}
.bx--d .bx__k{background:rgba(255,255,255,.14);color:var(--i200)}
.bx__play{width:56px;height:56px;border-radius:var(--pill);background:#fff;display:grid;place-items:center;margin-bottom:1rem;color:var(--i600)}

/* ══ 7. SÜREÇ ══ */
.steps{display:grid;gap:1rem}
@media(min-width:760px){.steps{grid-template-columns:repeat(4,1fr)}}
.step{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:clamp(1.4rem,2.4vw,1.9rem);
  transition:box-shadow .35s var(--ease),transform .35s var(--ease)}
.step:hover{box-shadow:var(--sh);transform:translateY(-4px)}
.step b{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:var(--pill);background:var(--i100);color:var(--i600);
  font-family:var(--hd);font-size:.95rem;font-weight:700;margin-bottom:1rem}
.step p{font-size:.9rem;margin:0}

/* ══ 8. SSS ══ */
.faq{display:grid;gap:.65rem;max-width:920px}
.faq details{background:#fff;border:1px solid var(--line);border-radius:var(--r-s);overflow:hidden;transition:border-color .3s}
.faq details[open]{border-color:var(--i400)}
.faq summary{cursor:pointer;list-style:none;position:relative;padding:1.15rem 3.4rem 1.15rem 1.4rem;
  font-family:var(--hd);font-size:1.02rem;font-weight:600;color:var(--ink);letter-spacing:-.022em}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:1.35rem;top:50%;width:11px;height:11px;margin-top:-7px;
  border-right:2px solid var(--i500);border-bottom:2px solid var(--i500);transform:rotate(45deg);transition:transform .3s var(--ease)}
.faq details[open] summary::after{transform:rotate(-135deg);margin-top:-3px}
.faq .b{padding:0 1.4rem 1.3rem;font-size:.94rem;max-width:78ch}

/* ══ 9. İLETİŞİM ══ */
.contact{display:grid;gap:1.1rem}
@media(min-width:980px){.contact{grid-template-columns:1.05fr .95fr}}
.form{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:clamp(1.6rem,2.8vw,2.4rem)}
.f2{display:grid;gap:0 1.1rem}
@media(min-width:520px){.f2{grid-template-columns:1fr 1fr}}

.fld .req{color:var(--i500)}

.legal{font-size:.8rem;color:var(--mute);margin-top:.9rem}

.fstat[hidden]{display:none}
.ci{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1.25rem 1.4rem;display:flex;gap:1rem;
  align-items:flex-start;text-decoration:none;color:inherit;margin-bottom:.7rem;transition:border-color .3s,transform .3s var(--ease)}
.ci:hover{border-color:var(--i300);transform:translateY(-1px)}
.ci__i{flex:none;width:44px;height:44px;display:grid;place-items:center;border-radius:var(--pill);background:var(--i700);color:#fff}
.ci b{display:block;font-size:.96rem;color:var(--ink)}
.ci span{display:block;font-size:.85rem;color:var(--mute)}
.hours{background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.hours__h{background:var(--i700);color:#fff;padding:.85rem 1.4rem;font-size:.72rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
.hours__r{display:flex;justify-content:space-between;gap:1rem;padding:.75rem 1.4rem;font-size:.89rem;border-bottom:1px solid var(--line-2)}
.hours__r:last-child{border-bottom:0}
.hours__r b{color:var(--ink)}

/* ══ 10. FOOTER ══ */

@media(min-width:680px){.ft__g{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1060px){.ft__g{grid-template-columns:1.7fr 1fr 1fr 1.4fr}}

.fab{position:fixed;right:1rem;bottom:1rem;z-index:90;display:flex;flex-direction:column;gap:.55rem}
.fab a{width:52px;height:52px;display:grid;place-items:center;border-radius:var(--pill);color:#fff;box-shadow:var(--sh-l);transition:transform .3s var(--ease)}
.fab a:hover{transform:scale(1.08)}
.fab .wa{background:#1fa855}.fab .tl{background:var(--i500)}
@media(min-width:1181px){.fab .tl{display:none}}

/* ═══════════════════════════════════════════════════════════════════════
   KURUMSAL — Hakkımızda · Vizyon · Misyon · Değerler TEK BİLEŞENDE
   Dördü ayrı blok değil; segmentli sekme başlığı + tek panel gövdesi olarak
   tek bir kart içinde yaşar. Aktif sekme beyaza döner ve üstündeki indigo
   çubukla panele görsel olarak bağlanır — "bir bütün" hissi buradan gelir.
   ═══════════════════════════════════════════════════════════════════════ */
.chip{display:inline-flex;align-items:center;gap:.5rem;font-size:.72rem;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;color:var(--i500);background:var(--i100);padding:.4rem 1rem;border-radius:var(--pill)}

/* Kabuk yok: çerçeve, arka plan ve gölge kaldırıldı. Sekme şeridi ile
   içerik arasında boşluk var; ikisi tek bir kutuya hapsolmuyor. */
.ku{background:transparent;border:0;border-radius:0;overflow:visible}

/* Sekme şeridi — kutu değil, tek sürekli satır.
   Aralarında ayraç yok, dolgu yok; aktif olan yalnızca renk + alt çubukla
   belirtilir. Böylece "ayrı kartlar" değil, tek bir başlık şeridi okunur. */
.ku__tabs{display:flex;flex-wrap:wrap;align-items:stretch;gap:0 clamp(1.4rem,3.4vw,3.2rem);
  background:transparent;border-bottom:1px solid var(--line);padding-inline:0;
  margin-bottom:clamp(1.6rem,3.2vw,2.6rem)}
.ku__tab{position:relative;flex:0 0 auto;display:flex;align-items:baseline;gap:.6rem;
  padding:1.5rem 0 1.35rem;background:none;border:0;text-align:left;font:inherit;cursor:pointer;
  color:var(--mute);transition:color .28s var(--ease)}
.ku__tab::before{content:"";position:absolute;left:0;right:0;bottom:-1px;height:3px;
  background:var(--i500);border-radius:var(--pill) var(--pill) 0 0;
  transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
.ku__tab span{font-family:var(--hd);font-size:clamp(.92rem,1.15vw,1.05rem);font-weight:800;
  letter-spacing:.02em;color:var(--i400);transition:color .28s}
.ku__tab b{font-family:var(--hd);font-size:clamp(1.2rem,1.95vw,1.6rem);font-weight:700;
  letter-spacing:-.03em;color:var(--i700);transition:color .28s}
.ku__tab:hover b{color:var(--i500)}
.ku__tab:hover span{color:var(--i400)}
.ku__tab[aria-selected="true"]::before{transform:scaleX(1)}
.ku__tab[aria-selected="true"] b{color:var(--ink)}
.ku__tab[aria-selected="true"] span{color:var(--i500)}
@media(max-width:620px){
  .ku__tabs{gap:0;flex-direction:column;padding-inline:0}
  /* Sol gösterge çubuğuna yer aç — metnin üstüne binmesin */
  .ku__tab{padding:1.05rem 0 1.05rem 1.1rem;border-bottom:1px solid var(--line-2)}
  .ku__tab:last-child{border-bottom:0}
  .ku__tab::before{left:0;right:auto;top:.95rem;bottom:.95rem;width:3px;height:auto;
    border-radius:var(--pill);transform:scaleY(0);transform-origin:center}
  .ku__tab[aria-selected="true"]::before{transform:scaleY(1)}
}

/* Panel gövdesi — görsel solda, içerik sağda (onaylanan Hakkımızda düzeni) */
.ku__p{display:grid;grid-template-columns:1fr;gap:clamp(1.5rem,3vw,3rem);align-items:start}
@media(min-width:940px){.ku__p{grid-template-columns:.82fr 1.18fr}}
.ku__p[hidden]{display:none}
.ku__m{position:relative;background:var(--i800);border-radius:var(--r);overflow:hidden;
  min-height:clamp(240px,28vw,420px)}
.ku__m img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ku__badge{position:absolute;left:1.15rem;bottom:1.15rem;z-index:1;display:flex;align-items:center;gap:.85rem;
  background:rgba(255,255,255,.95);border-radius:var(--r-s);padding:.9rem 1.15rem}
.ku__badge b{font-family:var(--hd);font-size:1.6rem;font-weight:800;color:var(--ink);line-height:1;letter-spacing:-.045em}
.ku__badge span{font-size:.78rem;color:var(--mute);max-width:11ch;line-height:1.25}
.ku__b{padding:0}
.ku__c{display:block;font-family:var(--hd);font-size:.8rem;font-weight:800;color:var(--i400);letter-spacing:.06em;margin-bottom:1rem}
.ku__b h3{font-size:clamp(1.4rem,2.3vw,1.95rem);font-weight:800;letter-spacing:-.032em;margin-bottom:.6em}
.ku__lead{font-family:var(--hd);font-size:clamp(1.02rem,1.5vw,1.2rem);font-weight:600;color:var(--ink);
  line-height:1.45;letter-spacing:-.02em;margin-bottom:1.1rem}
.ku__b p{font-size:.97rem}
.ku__b ul{list-style:none;margin:1.2rem 0 0;padding:0;display:grid;gap:.65rem}
.ku__b li{position:relative;padding-left:1.75rem;font-size:.95rem}
.ku__b li::before{content:"";position:absolute;left:0;top:.56em;width:10px;height:6px;
  border-left:2px solid var(--i500);border-bottom:2px solid var(--i500);transform:rotate(-45deg)}
.ku__q{margin-top:1.5rem;padding-top:1.25rem;border-top:1px dashed var(--line);
  font-family:var(--hd);font-size:.96rem;font-weight:600;color:var(--i600);letter-spacing:-.016em}

/* Rakam şeridi ve imza — yalnız Hakkımızda panelinde */
.ku__f{display:grid;gap:1.1rem;margin-top:1.7rem;padding-top:1.5rem;border-top:1px solid var(--line)}
@media(min-width:560px){.ku__f{grid-template-columns:repeat(3,1fr);gap:0}}
.ku__f div{padding-inline:1.25rem}
@media(min-width:560px){.ku__f div{border-left:1px solid var(--line)}.ku__f div:first-child{border-left:0;padding-left:0}}
.ku__f b{display:block;font-family:var(--hd);font-size:1.5rem;font-weight:800;color:var(--i500);line-height:1;letter-spacing:-.04em;margin-bottom:.28rem}
.ku__f span{font-size:.82rem;color:var(--mute)}
.sign{display:flex;align-items:center;gap:.95rem;margin-top:1.6rem;padding-top:1.3rem;border-top:1px solid var(--line)}
.sign__i{flex:none;width:50px;height:50px;display:grid;place-items:center;border-radius:var(--pill);background:var(--i700);color:#fff;font-family:var(--hd);font-size:.88rem;font-weight:800}
.sign__n{display:block;font-family:var(--hd);font-size:1.02rem;font-weight:700;color:var(--ink);line-height:1.2}
.sign__r{display:block;font-size:.84rem;color:var(--mute)}

/* Ana sayfa iletişim bandı — sade. Form ve kanal dökümü İletişim
   sayfasında; burada tek cümle ve iki eylem yeterli. */
.cta2{display:grid;gap:1.4rem 3rem;align-items:center;
  padding:clamp(1.6rem,3vw,2.6rem);border:1px solid var(--line);
  border-radius:var(--r);background:#fff}
@media(min-width:900px){.cta2{grid-template-columns:minmax(0,1fr) auto}}
.cta2__k{display:block;font-family:var(--hd);font-size:.75rem;font-weight:900;
  letter-spacing:.15em;text-transform:uppercase;color:var(--i500);margin-bottom:.6rem}
.cta2__h{font-size:clamp(1.4rem,2.4vw,2rem);letter-spacing:-.032em;margin:0 0 .4em;color:var(--ink)}
.cta2__d{margin:0;font-size:.98rem;color:var(--body);max-width:52ch}
.cta2__a{display:flex;flex-wrap:wrap;gap:.75rem}

/* ══ ELEMENTOR PRO FORM — tasarım sistemine bağlama ═══════════════════════
   Pro'nun Form widget'ı kendi işaretlemesini basıyor (.elementor-field-group,
   .elementor-field, .elementor-button); bizim .fld/.ct__f kurallarımız ona
   hiç değmiyordu ve form varsayılan görünümüyle kalıyordu — yeşil buton,
   kutulu alanlar, tasarımla ilgisiz. Burada Pro'nun sınıfları bizim
   alan tasarımımıza eşleniyor.

   Elementor'un kendi satır içi stilleri (genişlik, boşluk) inline geldiği
   için birkaç yerde !important gerekiyor; başka yolu yok. */
.elementor-widget-form{width:min(100% - (var(--gut) * 2),var(--wrap));margin-inline:auto}
/* .ctx ızgarasının içinde form artık bir sütun; sayfa genişliğine yayan
   kural orada geçersiz. Elementor widget sarmalayıcısı da ızgara çocuğu
   olarak duruyor — .ctx__l/.ctx__r'nin kendi kuralı yok, yalnız sütun
   sırasını taşıyorlar. */
.ctx > .elementor-widget{min-width:0}
.ctx .elementor-widget-form{width:auto;max-width:none;margin-inline:0}

.elementor-form{display:grid;gap:1.9rem 1.6rem}
@media(min-width:620px){.elementor-form{grid-template-columns:1fr 1fr}}

.elementor-form .elementor-form-fields-wrapper{display:contents}
/* flex-wrap:nowrap ŞART: Elementor gruba flex-wrap:wrap veriyor; column
   yönüyle birleşince etiket ve alan yan yana iki kolona sarıyor ve alan
   kutunun dışına taşıyordu (ölçüldü: etiket x=21 w=84, alan x=115 w=333). */
.elementor-form .elementor-field-group{
  display:flex;flex-direction:column;flex-wrap:nowrap;gap:.5rem;position:relative;
  align-items:flex-start;   /* Elementor center veriyor, etiket ortalanıyordu */
  width:auto!important;max-width:none!important;padding:0!important;margin:0}
.elementor-form .elementor-field-group > .elementor-field-label{width:auto}
.elementor-form .elementor-field-group > .elementor-field,
.elementor-form .elementor-field-group > .elementor-field-textual{
  flex:0 0 auto;width:100%;max-width:100%}
@media(min-width:620px){
  .elementor-form .elementor-field-group{grid-column:span 1}
  .elementor-form .elementor-field-group.elementor-col-100,
  .elementor-form .elementor-field-type-acceptance,
  .elementor-form .elementor-field-group.e-form__buttons{grid-column:1/-1}
}

.elementor-form .elementor-field-label{
  font-family:var(--bd);font-size:.8rem;font-weight:800;letter-spacing:.1em;
  text-transform:uppercase;color:var(--mute);padding:0}
.elementor-form .elementor-mark-required .elementor-field-label:after{color:var(--i500)}

.elementor-form .elementor-field-textual{
  font:inherit;font-size:1rem;color:var(--ink);background:transparent;
  border:0;border-bottom:1px solid #8a86a8;border-radius:0;
  padding:.55rem 0 .7rem;width:100%;min-height:auto;
  transition:border-color .25s var(--ease),box-shadow .25s var(--ease)}
.elementor-form .elementor-field-textual:focus{
  outline:0;border-color:var(--i500);box-shadow:0 1px 0 0 var(--i500)}
.elementor-form .elementor-field-textual::placeholder{color:var(--mute);opacity:1}
.elementor-form textarea.elementor-field-textual{
  resize:vertical;min-height:104px;line-height:1.6}
.elementor-form select.elementor-field-textual{
  appearance:none;-webkit-appearance:none;
  background-image:linear-gradient(45deg,transparent 50%,var(--i500) 50%),
                   linear-gradient(135deg,var(--i500) 50%,transparent 50%);
  background-position:calc(100% - 12px) calc(50% + 2px),calc(100% - 7px) calc(50% + 2px);
  background-size:5px 5px,5px 5px;background-repeat:no-repeat;padding-right:1.6rem}

/* Onay kutusu satırı. Elementor onay alanına da üst etiket basıyor
   ("KVKK"); tasarımda böyle bir etiket yok, metnin kendisi zaten açıklıyor. */
.elementor-form .elementor-field-type-acceptance > .elementor-field-label{display:none}
.elementor-form .elementor-field-type-acceptance .elementor-field-subgroup{
  display:flex;gap:.75rem;align-items:flex-start;
  font-size:.9rem;line-height:1.6;color:var(--body)}
/* 24px: WCAG 2.5.8 dokunma hedefi eşiği. .ct__kv input ile aynı ölçü. */
.elementor-form .elementor-field-type-acceptance input[type=checkbox]{
  flex:none;width:24px;height:24px;margin-top:.05rem;accent-color:var(--i500)}
.elementor-form .elementor-field-type-acceptance a{color:var(--i600);
  text-decoration:underline;text-underline-offset:3px}   /* .ct__kv a ile aynı */

/* Gönder butonu — Pro'nun varsayılan yeşilini tasarım butonuyla değiştirir */
.elementor-form .elementor-button[type=submit],
.elementor-form button.elementor-button{
  display:inline-flex;align-items:center;justify-content:center;gap:.55rem;
  padding:.95rem 1.9rem;border-radius:var(--pill);border:0;
  font-family:var(--bd);font-size:.93rem;font-weight:700;letter-spacing:-.01em;
  background:var(--i500);color:#fff;cursor:pointer;
  transition:background-color .25s var(--ease),transform .25s var(--ease);
  min-height:auto;width:auto}
.elementor-form .elementor-button:hover{background:var(--i600);transform:translateY(-1px)}
.elementor-form .e-form__buttons{justify-content:flex-start}

/* Gönderim sonrası mesajlar */
.elementor-message{margin:0;padding:1rem 1.25rem;border-radius:var(--r-s);
  font-size:.94rem;font-weight:600;border-left:3px solid var(--i500);
  background:var(--i100);color:var(--i700)}
.elementor-message.elementor-message-danger{
  border-left-color:#b4232a;background:#fdf0f1;color:#8f1c22}
.elementor-form .elementor-field-group .elementor-field-textual[aria-invalid=true]{
  border-color:#b4232a;box-shadow:0 1px 0 0 #b4232a}

/* ── İletişim sayfası ──────────────────────────────────────────────────
   Kutu, gölge ve ikon yok. Solda ince ayraçlı bilgi listesi, sağda form.
   Sayfanın işi tek: form doldurtmak; geri kalanı sessiz durur. */
.ctx{display:grid;gap:clamp(2rem,4vw,4rem)}
@media(min-width:1040px){
  .ctx{grid-template-columns:minmax(0,.78fr) minmax(0,1fr);align-items:start}
}
.ctx__lead{margin:0 0 clamp(1.4rem,2.4vw,2rem);font-size:clamp(1.02rem,1.5vw,1.15rem);
  line-height:1.62;color:var(--ink);max-width:44ch}

.cl{margin:0;border-top:1px solid var(--line)}
.cl__i{display:grid;gap:.15rem;padding-block:clamp(.85rem,1.5vw,1.1rem);
  border-bottom:1px solid var(--line)}
@media(min-width:520px){.cl__i{grid-template-columns:9.5rem minmax(0,1fr);gap:.15rem 1.2rem;align-items:baseline}}
.cl dt{font-family:var(--hd);font-size:.72rem;font-weight:900;letter-spacing:.13em;
  text-transform:uppercase;color:var(--mute)}
.cl dd{margin:0;font-size:1rem;line-height:1.6;color:var(--body);overflow-wrap:break-word}
.cl dd a{color:var(--ink);font-weight:600;text-decoration:none;
  border-bottom:1px solid var(--line);transition:color .2s,border-color .2s}
.cl dd a:hover{color:var(--i600);border-color:var(--i300)}

/* Geniş tablolar dar ekranda kendi içinde yatay kaydırılır — sayfayı
   kaydırmaz. Ölçüldü: 3 kolonlu tablo 375px'te sayfayı 28px taşıtıyordu. */
/* Yasal metinlerde uzun e-posta ve adres dizeleri dar ekranda satıra
   sığmayıp sayfayı taşırıyordu (ölçüldü: gizlilik.html 375px'te 14px).
   break-word yalnızca sığmayan sözcüğü kırar, normal sarmayı bozmaz. */
.prose,.doc>*{min-width:0}
.prose,.prose p,.prose li,.prose td,.prose th{overflow-wrap:break-word}
.tbl{max-width:100%;overflow-x:auto;overscroll-behavior-x:contain;
  -webkit-overflow-scrolling:touch}
.tbl table{min-width:32rem;margin:0}

/* Geniş tablolar dar ekranda kendi içinde yatay kaydırılır — sayfayı
   kaydırmaz. Ölçüldü: 3 kolonlu tablo 375px'te sayfayı 28px taşıtıyordu. */
/* Yasal metinlerde uzun e-posta ve adres dizeleri dar ekranda satıra
   sığmayıp sayfayı taşırıyordu (ölçüldü: gizlilik.html 375px'te 14px).
   break-word yalnızca sığmayan sözcüğü kırar, normal sarmayı bozmaz. */
.prose,.doc>*{min-width:0}
.prose,.prose p,.prose li,.prose td,.prose th{overflow-wrap:break-word}
.tbl{max-width:100%;overflow-x:auto;overscroll-behavior-x:contain;
  -webkit-overflow-scrolling:touch}
.tbl table{min-width:32rem;margin:0}

/* ── Hizmet kartı carousel'i ────────────────────────────────────────────
   Kartlar yatayda kayar. Otomatik ilerleme YOK: kartlar bağlantı, hareket
   eden bağlantıya tıklamak zordur ve WCAG 2.2.2 duraklatma yükümlülüğü doğar.
   Kaydırma yerel (scroll-snap) — dokunmatikte parmakla, masaüstünde oklarla,
   klavyede sekme ile çalışır; JS kapalıysa da kaydırılabilir kalır. */
.hzc{position:relative}
.hzc__vp{overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;
  scrollbar-width:none;padding-block:.4rem;margin-inline:calc(var(--gut) * -1);
  padding-inline:var(--gut)}
/* Oklar 900px'ten itibaren çıkıyor; taşma payı orada kalkmalı, yoksa ilk ve
   son kart okların altına giriyor (ölçüldü: sol ok kartın üstüne biniyordu). */
@media(min-width:900px){
  .hzc__vp{margin-inline:0;padding-inline:0}
}
.hzc__vp::-webkit-scrollbar{display:none}
/* Bento ızgara: 6 kolonluk taban. İlk iki kart 3'er kolon (geniş),
   kalan üçü 2'şer kolon. Toplam iki satır, boşluk kalmıyor.
   Geniş kartlarda görsel daha yüksek; oran değişimi ritmi veriyor. */
.hz{display:grid;gap:clamp(.9rem,1.6vw,1.35rem);grid-template-columns:1fr}
@media(min-width:640px){.hz{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1040px){
  .hz{grid-template-columns:repeat(6,minmax(0,1fr))}
  .hz__i:nth-child(1),.hz__i:nth-child(2){grid-column:span 3}
  .hz__i:nth-child(3),.hz__i:nth-child(4),.hz__i:nth-child(5){grid-column:span 2}
  .hz__i:nth-child(1) .hz__m,.hz__i:nth-child(2) .hz__m{aspect-ratio:21/9}
  .hz__i:nth-child(1) .hz__t,.hz__i:nth-child(2) .hz__t{font-size:clamp(1.25rem,1.8vw,1.55rem)}

  /* Öge sayısına göre düzen. Beş ögelik kurgu (2 büyük + 3 küçük) yalnız beşte
     dengeli; dörtte son satırda 2 sütunluk boşluk kalıyor, altıda taşıyor.
     :first-child:nth-last-child(N) kalıbı listenin uzunluğunu ölçüyor. */

  /* 4 öge → tek sırada dört. 6 sütunluk rayda 3'er kolon 2×2 veriyordu;
     dört hizmet yan yana okunduğunda karşılaştırılabilir oluyor. */
  .hz:has(> .hz__i:first-child:nth-last-child(4)){grid-template-columns:repeat(4,minmax(0,1fr))}
  .hz__i:first-child:nth-last-child(4),
  .hz__i:first-child:nth-last-child(4) ~ .hz__i{grid-column:span 1}
  .hz__i:first-child:nth-last-child(4) .hz__m,
  .hz__i:first-child:nth-last-child(4) ~ .hz__i .hz__m{aspect-ratio:4/3}
  .hz__i:first-child:nth-last-child(4) .hz__t,
  .hz__i:first-child:nth-last-child(4) ~ .hz__i .hz__t{font-size:clamp(1.05rem,1.35vw,1.22rem)}

  /* 6 öge → 3×2, hepsi eşit */
  .hz__i:first-child:nth-last-child(6),
  .hz__i:first-child:nth-last-child(6) ~ .hz__i{grid-column:span 2}
  .hz__i:first-child:nth-last-child(6) .hz__m,
  .hz__i:first-child:nth-last-child(6) ~ .hz__i .hz__m{aspect-ratio:16/10}
  .hz__i:first-child:nth-last-child(6) .hz__t,
  .hz__i:first-child:nth-last-child(6) ~ .hz__i .hz__t{font-size:inherit}

  /* Kartların yüksekliği eşitlensin: metin uzunluğu farklı olsa da alt kenar
     aynı hizada bitsin. */
  .hz__i{height:100%}
  .hz__d{flex:1 1 auto}
}

/* ── Carousel rayı (.hz--c) ──────────────────────────────────────────────
   Aynı kartlar, bento ızgara yerine yatay ray. Kart genişliği yüzdeyle
   veriliyor; son sütun kısmen görünsün diye "peek" payı bırakılıyor —
   kaydırılabilir olduğu ok olmadan da anlaşılıyor.
   Bento'nun nth-child kuralları burada etkisiz: ray flex, grid-column inert.
   Yalnız görsel oranı ve punto ezmeleri geri alınıyor. */
.hz--c{display:flex;grid-template-columns:none;
  gap:clamp(.9rem,1.6vw,1.35rem);width:max-content;min-width:100%}
.hz--c>.hz__i{flex:0 0 auto;height:auto;scroll-snap-align:start;
  width:min(82vw,20rem)}
@media(min-width:640px){.hz--c>.hz__i{width:min(46vw,21rem)}}
@media(min-width:1040px){
  .hz--c>.hz__i{width:min(31%,24rem)}
  /* bento ezmelerini geri al */
  .hz--c>.hz__i .hz__m{aspect-ratio:16/10}
  .hz--c>.hz__i .hz__t{font-size:inherit}
}

/* Oklar kartların dışında, dikey ortada. Dar ekranda gizlenir; orada
   parmakla kaydırma zaten doğal yol. */
.hzc__n{position:absolute;top:calc(50% - 1.4rem);z-index:2;
  width:2.8rem;height:2.8rem;display:none;place-items:center;border-radius:var(--pill);
  border:1px solid var(--line);background:#fff;color:var(--i600);cursor:pointer;
  box-shadow:var(--sh);
  transition:background-color .3s,border-color .3s,color .3s,opacity .3s}
.hzc__n:hover{background:var(--i500);border-color:var(--i500);color:#fff}
.hzc__n[disabled]{opacity:.35;pointer-events:none}
.hzc__n--p{left:calc(var(--gut) * -1 + .2rem)}
.hzc__n--n{right:calc(var(--gut) * -1 + .2rem)}
@media(min-width:900px){.hzc__n{display:grid}}
@media(min-width:1220px){
  .hzc__n--p{left:-1.4rem}
  .hzc__n--n{right:-1.4rem}
}

/* Hizmet kartları. Kaynak sıra anlam sırası (numara → başlık → açıklama →
   görsel → ok); kartta görsel üste alınıyor. Sıralamayı CSS order ile
   yapıyoruz ki ekran okuyucu ve sekme sırası bozulmasın. */
.hz__i{position:relative;display:flex;flex-direction:column;
  padding:0 0 clamp(1.1rem,1.8vw,1.45rem);
  border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:#fff;
  text-decoration:none;color:inherit;
  transition:border-color .3s var(--ease),box-shadow .3s var(--ease),transform .3s var(--ease)}
.hz__i:hover{border-color:var(--i200);box-shadow:var(--sh);transform:translateY(-1px)}
.hz__i:focus-visible{transform:translateY(-1px)}

.hz__m{order:-1;position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--i800);
  margin-bottom:clamp(1rem,1.7vw,1.3rem)}
.hz__m img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  transition:transform .5s var(--ease)}
.hz__i:hover .hz__m img{transform:scale(1.06)}

.hz__n{margin:0 clamp(1.1rem,1.8vw,1.45rem) .5rem;
  font-family:var(--hd);font-size:.76rem;font-weight:800;letter-spacing:.12em;
  color:var(--i500);line-height:1;transition:color .3s}
.hz__t{margin:0 clamp(1.1rem,1.8vw,1.45rem) .45rem;
  font-family:var(--hd);font-size:clamp(1.12rem,1.5vw,1.3rem);font-weight:700;
  color:var(--ink);letter-spacing:-.028em;line-height:1.2}
.hz__d{margin:0 clamp(1.1rem,1.8vw,1.45rem);font-size:.92rem;line-height:1.6;color:var(--body)}

/* Ok kartın sağ altında; kart yüksekliği eşitlensin diye metinden sonra
   auto margin ile aşağı itiliyor. */
.hz__go{align-self:flex-end;margin:clamp(1rem,1.7vw,1.3rem) clamp(1.1rem,1.8vw,1.45rem) 0 0;
  width:2.3rem;height:2.3rem;display:grid;place-items:center;border-radius:var(--pill);
  border:1px solid var(--line);color:var(--i600);flex:none;
  transition:background-color .3s,border-color .3s,color .3s,transform .3s var(--ease)}
.hz__i:hover .hz__go{background:var(--i500);border-color:var(--i500);color:#fff;transform:translateX(3px)}
.hz__d{margin-bottom:auto}

/* Bölüm sonu bağlantısı */
.hz__all{display:inline-flex;align-items:center;gap:.6rem;margin-top:clamp(1.6rem,3vw,2.4rem);
  font-family:var(--hd);font-size:clamp(1rem,1.4vw,1.15rem);font-weight:700;letter-spacing:-.02em;
  color:var(--i600);text-decoration:none;transition:gap .3s var(--ease),color .3s}
.hz__all:hover{gap:1rem;color:var(--i500)}

/* ═══════════════════════════════════════════════════════════════════════
   BENTO · SÜREÇ · SSS — hepsi kartsız
   Tanımı kenarlık/gölge değil; dolgu rengi, görsel ve ince ayraç veriyor.
   ═══════════════════════════════════════════════════════════════════════ */

/* ── MEDYA DUVARI — tek fikir: izleyin ve görün ───────────────────────
   İstatistik/CTA döşemesi yok; yalnızca video ve galeri kareleri. */
.mw{display:grid;gap:clamp(.7rem,1.2vw,1rem);grid-template-columns:1fr}
@media(min-width:640px){.mw{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1040px){.mw{grid-template-columns:repeat(4,1fr);grid-auto-rows:minmax(190px,1fr)}}
.mw__i{position:relative;display:block;overflow:hidden;border-radius:var(--r);background:var(--i800);
  text-decoration:none;color:inherit;min-height:190px;transition:transform .4s var(--ease)}
.mw__i:hover{transform:translateY(-4px)}
@media(min-width:1040px){.mw__i--v{grid-column:span 2;grid-row:span 2}}
.mw__i img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.mw__i:hover img{transform:scale(1.05)}
.mw__i::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 38%,rgba(30,27,75,.88) 100%);transition:background .4s}
.mw__c{position:relative;z-index:1;height:100%;display:flex;flex-direction:column;justify-content:flex-end;
  padding:clamp(1.2rem,2.2vw,1.75rem)}
.mw__k{align-self:flex-start;display:inline-flex;font-size:.68rem;font-weight:800;letter-spacing:.14em;
  text-transform:uppercase;color:#fff;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.26);
  padding:.3rem .8rem;border-radius:var(--pill);margin-bottom:.85rem}
.mw__t{font-family:var(--hd);font-size:clamp(1.05rem,1.6vw,1.5rem);font-weight:700;color:#fff;
  letter-spacing:-.03em;line-height:1.15;margin:0}
.mw__d{font-size:.9rem;color:#cbd0ff;margin:.4rem 0 0}
.mw__play{width:60px;height:60px;border-radius:var(--pill);background:#fff;display:grid;place-items:center;
  color:var(--i600);margin-bottom:1.1rem;transition:transform .4s var(--ease)}
.mw__i--v:hover .mw__play{transform:scale(1.08)}

/* ── SÜREÇ — "tarihçe" kurgusu ────────────────────────────────────────
   mazhar.softasist.com tarihçe bileşeninin yapısı:
   üstte tıklanabilir ray · büyük aktif etiket · solda sayaç rozetli görsel
   · sağda metin · sağ altta ileri/geri okları
   ─────────────────────────────────────────────────────────────────────── */
.hs{position:relative}

/* Yıl rayı: yıllar eşit paylarla dağılır, her birinin altında çizgi üzerinde
   oturan bir nokta var. Etkin yıl koyu, noktası ve alt çizgisi marka renginde.
   Oklar rayın üstünde, sağda. */
.hs__top{display:flex;justify-content:flex-end;margin-bottom:.55rem}
.hs__rail{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(4.4rem,1fr);gap:0;
  border-bottom:1px solid var(--line);margin-bottom:clamp(1.9rem,3.4vw,2.9rem);
  overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none}
.hs__rail::-webkit-scrollbar{display:none}
.hs__y{position:relative;background:none;border:0;font:inherit;cursor:pointer;text-align:left;
  padding:.5rem 1rem 1.5rem 0;color:var(--mute);
  font-family:var(--hd);font-size:clamp(.95rem,1.3vw,1.12rem);font-weight:800;letter-spacing:.03em;
  transition:color .28s;white-space:nowrap}
/* etkin yılın altındaki kalın segment */
.hs__y::before{content:"";position:absolute;left:0;right:0;bottom:-1px;height:3px;background:var(--i500);
  border-radius:var(--pill) var(--pill) 0 0;transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
/* çizgi üzerinde oturan nokta */
.hs__y::after{content:"";position:absolute;left:0;bottom:-5px;width:10px;height:10px;border-radius:50%;
  background:var(--line);box-shadow:0 0 0 4px var(--i50);
  transition:background-color .28s,transform .28s var(--ease)}
.hs__y:hover{color:var(--i500)}
.hs__y:hover::after{background:var(--i300)}
.hs__y[aria-selected="true"]{color:var(--ink)}
.hs__y[aria-selected="true"]::before{transform:scaleX(1)}
.hs__y[aria-selected="true"]::after{background:var(--i500);transform:scale(1.15)}
/* beyaz zeminli bölümlerde nokta halkası da beyaz olsun */
.sec:not(.sec--l):not(.sec--d) .hs__y::after{box-shadow:0 0 0 4px #fff}

.hs__s{display:grid;grid-template-columns:1fr;gap:clamp(1.5rem,3vw,3rem);align-items:center}
@media(min-width:940px){.hs__s{grid-template-columns:.92fr 1.08fr}}
.hs__s[hidden]{display:none}
.hs__v{position:relative;border-radius:var(--r);overflow:hidden;background:var(--i800);aspect-ratio:4/3}
.hs__v img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
/* Sayaç: görselin sol alt köşesine oturur, marka renginde. .hs__v overflow
   gizlediği için rozet dışarı taşamaz; köşe yuvarlaklığı sıfırlanarak
   görselden "kesilmiş" gibi durur. */
.hs__c{position:absolute;left:0;bottom:0;z-index:1;
  font-family:var(--hd);font-size:.82rem;font-weight:800;letter-spacing:.1em;color:#fff;
  background:var(--i500);padding:.6rem 1.15rem;border-radius:0 var(--r-s) 0 0}
.hs__big{display:block;font-family:var(--hd);font-size:clamp(3rem,6.4vw,5.2rem);font-weight:800;
  color:var(--i400);line-height:.88;letter-spacing:-.055em;margin-bottom:.55rem}
.hs__b h3{font-size:clamp(1.35rem,2.4vw,2.05rem);font-weight:800;letter-spacing:-.032em;margin-bottom:.5em}
.hs__b p{font-size:.98rem;max-width:46ch;margin-bottom:1.3rem}
.hs__t{display:inline-flex;align-items:center;gap:.45rem;font-size:.76rem;font-weight:800;letter-spacing:.09em;
  text-transform:uppercase;color:var(--i600);background:var(--i100);padding:.4rem .95rem;border-radius:var(--pill)}
.hs__nav{display:flex;gap:.55rem}
.hs__nav button{width:2.4rem;height:2.4rem;border-radius:var(--pill);border:1px solid var(--line);background:#fff;
  display:grid;place-items:center;cursor:pointer;color:var(--i600);
  transition:background-color .3s,border-color .3s,color .3s,transform .3s var(--ease)}
.hs__nav button:hover{background:var(--i500);border-color:var(--i500);color:#fff;transform:translateY(-1px)}

/* ── SSS ─────────────────────────────────────────────────────────────── */
.fq{border-top:1px solid var(--line);max-width:960px}
.fq details{border-bottom:1px solid var(--line)}
.fq summary{position:relative;cursor:pointer;list-style:none;padding:clamp(1.2rem,2.2vw,1.6rem) 3.6rem clamp(1.2rem,2.2vw,1.6rem) 0;
  font-family:var(--hd);font-size:clamp(1.08rem,1.7vw,1.35rem);font-weight:700;color:var(--ink);letter-spacing:-.028em;
  transition:color .28s}
.fq summary::-webkit-details-marker{display:none}
.fq summary:hover{color:var(--i500)}
.fq summary::after{content:"";position:absolute;right:.4rem;top:50%;width:34px;height:34px;margin-top:-17px;
  border-radius:var(--pill);background:var(--i100);transition:background-color .3s}
.fq summary::before{content:"";position:absolute;right:.4rem;top:50%;width:34px;height:34px;margin-top:-17px;z-index:1;
  background-image:linear-gradient(var(--i500),var(--i500)),linear-gradient(var(--i500),var(--i500));
  background-size:13px 2px,2px 13px;background-position:center,center;background-repeat:no-repeat;
  transition:transform .35s var(--ease),background-image .3s}
.fq details[open] summary::before{transform:rotate(135deg);
  background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff)}
.fq details[open] summary::after{background:var(--i500)}
.fq details[open] summary{color:var(--i600)}
.fq__b{padding:0 3.6rem 1.5rem 0;font-size:.97rem;max-width:78ch}

/* ═══════════════════════════════════════════════════════════════════════
   FOOTER — koyu indigo, kartsız
   Üstte Check-Up çağrısı bandı, altında dört sütun, en altta yasal satır.
   Kutulama yok; ayrım yalnızca ince çizgilerle.
   ═══════════════════════════════════════════════════════════════════════ */
.ft{background:var(--i900);color:var(--i200);font-size:.95rem;border-radius:var(--r) var(--r) 0 0;
  margin-top:clamp(2rem,4vw,3.5rem);position:relative;overflow:hidden}
.ft::before{content:"";position:absolute;width:52vw;height:52vw;border-radius:50%;filter:blur(110px);
  opacity:.22;background:var(--i500);left:-10%;top:-30%;pointer-events:none}

/* Üst çağrı bandı */
/* ── Footer SSS ────────────────────────────────────────────────────────
   Footer'ın ilk bloğu. Ayrı bir bölüm gibi durmasın diye kendi zemini yok;
   footer'ın koyu zemininde, ince bir ayraçla ayrılıyor. Renkler koyu zemine
   göre yeniden tanımlandı — .fq'nun açık zemin değerleri burada okunmaz. */
.ft__sss{position:relative;border-bottom:1px solid rgba(255,255,255,.12)}
.ft__sss .wrap{padding-block:clamp(1.35rem,2.3vw,1.85rem)}
.ft__sss__g{display:grid;gap:clamp(.95rem,1.7vw,1.6rem)}
@media(min-width:900px){.ft__sss__g{grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr);align-items:start}}
.ft__sss__h span{display:block;font-family:var(--hd);font-size:.75rem;font-weight:900;
  letter-spacing:.15em;text-transform:uppercase;color:var(--i300);margin-bottom:.6rem}
.ft__sss__h h2{color:#fff;font-size:clamp(1.3rem,2.1vw,1.75rem);letter-spacing:-.032em;margin:0 0 .35em}
.ft__sss__h p{margin:0;color:var(--i200);font-size:.94rem}
.ft__sss__h a{color:#fff;text-decoration:underline;text-underline-offset:3px}
.ft__sss__h a:hover{color:var(--i200)}

.fq--ft{border-top-color:rgba(255,255,255,.14);max-width:none}
.fq--ft details{border-bottom-color:rgba(255,255,255,.14)}
.fq--ft summary{color:#fff;font-size:clamp(1rem,1.4vw,1.12rem);
  padding-block:clamp(.85rem,1.5vw,1.05rem);padding-right:3rem}
.fq--ft summary:hover{color:var(--i200)}
.fq--ft summary::after{width:1.6rem;height:1.6rem;margin-top:-.8rem;right:.2rem;
  background:rgba(255,255,255,.12)}
.fq--ft summary::before{width:1.6rem;height:1.6rem;margin-top:-.8rem;right:.2rem;
  background-size:11px 2px,2px 11px;
  background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff)}
.fq--ft details[open] summary{color:#fff}
.fq--ft details[open] summary::after{background:var(--i500)}
.fq--ft details[open] summary::before{
  background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff)}
.fq--ft .fq__b{color:var(--i200);font-size:.92rem;padding:0 3rem .95rem 0}
.fq--ft .fq__b strong{color:#fff}

.ft__cta{position:relative;border-bottom:1px solid rgba(255,255,255,.12)}
.ft__cta .wrap{display:grid;gap:1.3rem;align-items:center;padding-block:clamp(1.8rem,3.2vw,2.6rem)}
@media(min-width:900px){.ft__cta .wrap{grid-template-columns:1fr auto}}
.ft__cta h2{color:#fff;font-size:clamp(1.5rem,2.8vw,2.3rem);letter-spacing:-.034em;margin:0 0 .3em;max-width:22ch}
.ft__cta p{margin:0;color:var(--i200);max-width:54ch;font-size:.97rem}
.ft__acts{display:flex;flex-wrap:wrap;gap:.8rem}
.ft__acts .btn{background:#fff;border-color:#fff;color:var(--i700)}
.ft__acts .btn:hover{background:var(--i400);border-color:var(--i400);color:#fff}
.ft__acts .btn--o{background:transparent;color:#fff;border-color:rgba(255,255,255,.42)}
.ft__acts .btn--o:hover{background:#fff;color:var(--i700);border-color:#fff}

/* Ana sütunlar */
.ft__g{position:relative;display:grid;gap:1.5rem;padding-block:clamp(1.45rem,2.4vw,2rem)}
@media(min-width:700px){.ft__g{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1060px){.ft__g{grid-template-columns:1.75fr 1fr 1fr 1.35fr}}
.ft__logo{display:inline-block;background:#fff;border-radius:var(--r-s);padding:.85rem 1.1rem;margin-bottom:1.3rem}
.ft__logo img{height:36px;width:auto}
.ft__slogan{margin:0 0 .75rem;font-family:var(--hd);font-size:1.12rem;
  font-weight:800;letter-spacing:-.01em;color:#fff}
.ft__about{max-width:42ch;color:var(--i200)}
.ft h3{color:#fff;font-family:var(--bd);font-size:.72rem;font-weight:800;letter-spacing:.16em;
  text-transform:uppercase;margin-bottom:1.25rem}
.ft ul{list-style:none;margin:0;padding:0;display:grid;gap:.5rem}
.ft a{color:var(--i200);text-decoration:none;transition:color .22s var(--ease),transform .22s var(--ease);display:inline-block}
.ft__g ul a:hover{color:#fff;transform:translateX(4px)}
.ft a:hover{color:#fff}
.ft__c li{display:flex;gap:.75rem;align-items:flex-start}
.ft__c svg{flex:none;margin-top:.32rem;color:var(--i300)}
.ft__c a:hover,.ft__c span{transform:none}
.ft__s{display:flex;gap:.6rem;margin-top:1.6rem}
.ft__s a{width:42px;height:42px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.18);
  border-radius:var(--pill);color:var(--i200);
  transition:background-color .28s,border-color .28s,color .28s,transform .28s var(--ease)}
.ft__s a:hover{background:var(--i500);border-color:var(--i500);color:#fff;transform:translateY(-1px)}

/* Yasal satır */
.ft__b{position:relative;border-top:1px solid rgba(255,255,255,.12);padding-block:1.4rem;
  display:flex;flex-wrap:wrap;gap:.6rem 1.8rem;justify-content:space-between;align-items:center;
  font-size:.84rem;color:var(--i300)}
.ft__b ul{display:flex;flex-wrap:wrap;gap:.5rem 1.5rem}
.ft__b a{color:var(--i300)}
.ft a.ft__top{display:inline-flex;align-items:center;gap:.5rem;color:var(--i200);white-space:nowrap}

/* ══ 9. İLETİŞİM + FORM ═══════════════════════════════════════════════ */
.ct__g{display:grid;gap:clamp(2.6rem,5vw,4.5rem);margin-top:clamp(2.4rem,4.5vw,3.6rem)}
@media(min-width:980px){.ct__g{grid-template-columns:.85fr 1.15fr;align-items:start}}

/* — sol sütun: bilgiler — */
.ct__lead{font-size:clamp(1.05rem,1.6vw,1.2rem);line-height:1.68;color:var(--body);margin:0 0 2rem}
.ct__list{display:grid;gap:0;border-top:1px solid var(--line)}
.ct__i{display:flex;gap:1.05rem;align-items:flex-start;padding-block:.95rem;border-bottom:1px solid var(--line)}
.ct__ic{flex:none;width:38px;height:38px;border-radius:var(--pill);display:grid;place-items:center;
  background:var(--i100);color:var(--i600);margin-top:.1rem}
.ct__k{display:block;font-size:.72rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
  color:var(--mute);margin-bottom:.3rem}
.ct__v{font-size:1rem;line-height:1.6;color:var(--ink);font-weight:600}
.ct__v a{color:inherit;text-decoration:none;transition:color .2s var(--ease)}
.ct__v a:hover{color:var(--i500)}
.ct__v small{display:block;font-weight:400;font-size:.9rem;color:var(--body);margin-top:.2rem}

/* Harita: tıkla-yükle. Açılışta yalnızca yerel SVG önizleme var; iframe ancak
   düğmeye basılınca gelir (KVKK — Google'a istek ziyaretçinin seçimiyle gider). */
.ct__map{margin-top:1.5rem;border-radius:var(--r);overflow:hidden;position:relative;display:block;
  aspect-ratio:16/10;background:var(--i100)}
.ct__map img{width:100%;height:100%;object-fit:cover;display:block}
.ct__map iframe{width:100%;height:100%;border:0;display:block}
/* Açık zeminli harita önizlemesinde beyaz yazı okunmuyordu; perde daha
   erken başlıyor ve altta tamamen kapatıyor. */
.ct__map__ov{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;
  gap:.85rem;padding:1.15rem;
  background:linear-gradient(180deg,rgba(30,27,75,0) 8%,rgba(30,27,75,.55) 42%,rgba(30,27,75,.92) 100%)}
.ct__map__n{margin:0;color:#fff;font-size:.8rem;line-height:1.5;max-width:46ch;
  text-shadow:0 1px 2px rgba(30,27,75,.5)}
.ct__map__b{display:flex;flex-wrap:wrap;align-items:center;gap:.7rem}
.ct__map__y{display:inline-flex;align-items:center;gap:.45rem;background:#fff;color:var(--ink);
  font-size:.85rem;font-weight:700;padding:.6rem 1.1rem;border-radius:var(--pill);
  white-space:nowrap;text-decoration:none;transition:color .2s var(--ease)}
.ct__map__y:hover{color:var(--i500)}

/* — sağ sütun: form. Kart yok; alanlar yalnız alt çizgi — */
.ct__f{display:grid;gap:1.9rem 1.6rem}
@media(min-width:620px){.ct__f{grid-template-columns:1fr 1fr}}
.fld{display:flex;flex-direction:column;gap:.5rem;position:relative}
.fld--w{grid-column:1/-1}
.fld label{font-size:.72rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}
.fld label .req{color:var(--i500)}
.fld input,.fld select,.fld textarea{
  font:inherit;font-size:1rem;color:var(--ink);background:transparent;border:0;
  border-bottom:1px solid #8a86a8;border-radius:0;padding:.55rem 0 .7rem;width:100%;
  transition:border-color .22s var(--ease),box-shadow .22s var(--ease);-webkit-appearance:none;appearance:none}
.fld textarea{resize:vertical;min-height:104px;line-height:1.6}
.fld input::placeholder,.fld textarea::placeholder{color:#6b6788}
.fld input:hover,.fld select:hover,.fld textarea:hover{border-color:var(--i400)}
.fld input:focus,.fld select:focus,.fld textarea:focus{
  outline:0;border-color:var(--i500);box-shadow:0 1px 0 0 var(--i500)}
.fld select{cursor:pointer;padding-right:1.8rem}
.fld--sel::after{content:"";position:absolute;right:.35rem;bottom:1.25rem;width:8px;height:8px;
  border-right:2px solid var(--i500);border-bottom:2px solid var(--i500);
  transform:rotate(45deg);pointer-events:none}

.ct__kv{grid-column:1/-1;display:flex;gap:.75rem;align-items:flex-start;font-size:.9rem;
  line-height:1.6;color:var(--body)}
.ct__kv input{flex:none;width:24px;height:24px;margin-top:.05rem;accent-color:var(--i500);
  border:0;padding:0;cursor:pointer}
.ct__kv a{color:var(--i600);text-decoration:underline;text-underline-offset:3px}
.ct__sub{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:1rem 1.6rem}
.ct__note{font-size:.85rem;color:var(--mute);max-width:26rem;margin:0}
.fstat{grid-column:1/-1;margin:0;padding:1rem 1.25rem;border-radius:var(--r-s);
  background:var(--i100);color:var(--i700);font-size:.94rem;font-weight:600;border-left:3px solid var(--i500)}

@media(max-width:620px){
  .ct__map__ov{padding:.85rem;gap:.6rem}
  .ct__map__n{font-size:.74rem}
  .ct__map__y{font-size:.8rem;padding:.55rem .95rem}
  .ct__sub .btn{width:100%}
}
.ct__v{overflow-wrap:break-word}

/* ═══════════════════════════════════════════════════════════════════════
   MOBİL İYİLEŞTİRMELER
   Tümü ölçülerek doğrulandı (Chrome DevTools Protocol, 320–1920px).
   Kural: bu bloktaki hiçbir şey ≥1720px masaüstü görünümünü değiştirmez.
   ═══════════════════════════════════════════════════════════════════════ */

/* ── [1] HEADER — CTA satır kırılması + ölü grid kolonu ───────────────────
   ≤1219px'te .nav display:none olduğu için 3 kolonlu şablonun son kolonu
   boş kalıyor; boş kolon + gap = 25.6px ölü alan (ölçüldü: .hdr__r sağ
   kenarı wrap'ın 25.6px içinde). Bu yüzden "Ücretsiz Check-Up" 375px'te
   2, 360px'te 3 satıra kırılıp header'ı 87→93.5px'e şişiriyordu.
   Sonuç: 375/360px'te buton 148.9×44.9 tek satır, header 65px.
   ≤359px'te etiket hiçbir okunur puntoda sığmıyor → CTA gizleniyor
   (aynı çağrı .fab, carousel ve #iletisim'de zaten var). */
.hdr .btn.btn--s{white-space:nowrap}
@media(max-width:1219px){
  .hdr .wrap{grid-template-columns:auto 1fr}
}
@media(max-width:560px){
  .hdr .wrap{gap:.75rem;min-height:64px}
  .hdr .logo img{height:30px}
  .hdr__r{gap:.5rem}
  .hdr .btn.btn--s{padding:.6rem .85rem;font-size:.8rem}
}
/* 360–400px: logo (min-width:max-content, küçülmüyor) + CTA + hamburger
   toplamı .wrap'ı 34px taşıyordu; hamburger ikonu 2px kırpılıyordu (ölçüldü:
   .hdr__r sağ kenar 374, viewport 360). Logo bir tık küçülüp CTA daralınca
   sığıyor — etiket hâlâ okunur puntoda. */
@media(max-width:400px){
  .hdr .logo img{height:26px}
  .hdr .wrap{gap:.6rem}
  .hdr__r{gap:.45rem}
  .hdr .btn.btn--s{padding:.55rem .7rem;font-size:.76rem}
}
@media(max-width:359px){
  .hdr .btn.btn--s{display:none}
}

/* ── [2] HEADER — 1220–1719px "ölü bant" onarımı ──────────────────────────
   Ölçülen mevcut durum: 1220px'te logo kolonu 0px (logo hiç görünmüyor),
   .hdr__r wrap'ı 111.6px taşıyor; 1280px'te logo 0px; 1440px'te logo
   69.9×44 (doğal oran 3.559 → 1.588, ağır deformasyon).
   Üst sınır 1599 → 1719: kök ölçek %120'ye çıkınca başlık içeriği de %20
   büyüdü ve 1600px'te "Ücretsiz Check-Up" butonu wrap'ı 16px taşıdı
   (ölçüldü). Yeni sınırın üstünde blok NO-OP.
   TR/EN yalnızca bu bantta gizli — ikisi de href="#" olan yer tutucu. */
@media(min-width:1220px){
  .hdr .logo{min-width:max-content}
}
@media(min-width:1420px) and (max-width:1599px){
  .nav a{padding:.55rem .55rem;font-size:.85rem}
}
@media(min-width:1220px) and (max-width:1719px){
  .hdr .wrap{gap:1rem}
  .hdr .logo img{height:36px}
  .nav ul{gap:0}
  .nav a{padding:.55rem .62rem;font-size:.86rem}
  .hdr__r{gap:.6rem}
  .lang{display:none}
}
@media(min-width:1220px) and (max-width:1599px){
  .hdr__tel{display:none}
}

/* ── [3] MOBİL MENÜ — header'a kenetlenme, dokunma hedefi, klavye ─────────
   #nav sabit 112px'ten başlıyordu: sayfa başındayken header'ın altına
   17px giriyor (z-index 99 < 100 → panelin üstü header'ın arkasında
   kayboluyor), kaydırınca 25px havada boşluk kalıyordu. --nav-top
   app.js'ten rAF ile senkronlanıyor.
   Kapalı menüdeki 8 bağlantı sekme sırasındaydı (ölçüldü: focus alıyor);
   visibility ile sıradan çıkarıldı, geçiş bitince gizleniyor. */
@media(max-width:1219px){
  .burger{min-width:44px;min-height:44px;padding:0;
    align-items:center;justify-content:center;flex:none}
  #nav{top:var(--nav-top,108px);overscroll-behavior:contain}
  #nav[data-open=true]{
    max-height:calc(100vh - var(--nav-top,108px) - 1rem);
    max-height:calc(100dvh - var(--nav-top,108px) - 1rem)}
  html.js #nav{visibility:hidden;
    transition:max-height .35s var(--ease),visibility 0s linear .35s}
  html.js #nav[data-open=true]{visibility:visible;
    transition:max-height .35s var(--ease),visibility 0s}
}

/* ── [4] Sticky header altında kaybolan anchor hedefleri ──────────────── */
@media(max-width:560px){
  html{scroll-padding-top:84px}
}

/* ── [5] CAROUSEL — oklar başlığın üstünden kalksın ───────────────────────
   360px'te .car__nav daireleri ile .car__t kutusu fiziksel olarak
   çakışıyordu (ölçüldü: -0.2px ve -0.7px yatay, 4.1px dikey örtüşme).
   Oklar slaytın altına, nokta şeridinin iki yanına alındı; 46→44px
   dokunma hedefi korunuyor. Noktalar görsel olarak 9px kalıyor ama
   tıklanabilir alanları 44×44'e çıkarıldı. */
@media(max-width:600px){
  .car__nav{top:100%;bottom:auto;margin-top:1.3rem;transform:none;
    width:44px;height:44px;
    background:#fff;border:1px solid var(--line);box-shadow:none;color:var(--i700)}
  .car__nav:hover{background:#fff}
  .car__nav--p{left:.75rem}
  .car__nav--n{right:.75rem}
  /* Taban kural artık 44px veriyor; burada yalnız dar ekran payı kalıyor. */
  .car__dots{min-height:44px;padding-inline:56px;flex-wrap:nowrap}



  /* Slayt karesi: 4/3'te metin kutusu görselin %84.5'ini kaplıyordu → %57.7 */
  .car__s{aspect-ratio:1/1}
  .car__c{padding:1rem 1.1rem 1.2rem}
  .car__t{margin-bottom:.6rem;text-wrap:balance}
  .car__k{font-size:.8rem;letter-spacing:.1em;padding:.3rem .8rem;margin-bottom:.6rem}
}

/* ── [6] HAKKIMIZDA — sekmeler 2×2, istatistikler 3 sütun ─────────────────
   .ku__tabs 375px'te 4 satır / 268.9px kaplıyordu → 2×2 ızgara.
   Üst sınır 654px: 655px'ten itibaren taban düzen zaten tek satıra sığıyor.
   İstatistiklerde .ku__f div{padding-inline:1.25rem} sıfırlaması yalnız
   ≥560px'te yapıldığı için rakamlar gövde metninden 20px sağa kaymıştı. */
@media(max-width:559px){
  .ku__f div{padding-inline:0}
}
@media(min-width:360px) and (max-width:559px){
  .ku__f{grid-template-columns:repeat(3,minmax(0,1fr));gap:0}
  .ku__f div{padding-inline:.7rem;border-left:1px solid var(--line)}
  .ku__f div:first-child{border-left:0;padding-left:0}
  .ku__f div:last-child{padding-right:0}
}
@media(min-width:360px) and (max-width:654px){
  .ku__tabs{flex-direction:row;flex-wrap:wrap;gap:0}
  .ku__tab{flex:1 0 50%;max-width:50%;padding:.95rem 0 .9rem;border-bottom:0}
  .ku__tab:nth-child(-n+2){border-bottom:1px solid var(--line-2)}
  .ku__tab::before{left:0;right:0;top:auto;bottom:-1px;width:auto;height:3px;
    border-radius:var(--pill) var(--pill) 0 0;transform:scaleX(0);transform-origin:left}
  .ku__tab[aria-selected="true"]::before{transform:scaleX(1)}
}

/* ── [7] REFERANSLAR ŞERİDİ ───────────────────────────────────────────────
   Dokunmatikte :hover "yapışıp" kaldığı için şerit kalıcı duruyordu.
   Mobilde şerit hızı da fazlaydı (okunacak zaman kalmıyor). */
@media(hover:none){
  .mq:hover .mq__t{animation-play-state:running}
}
@media(max-width:620px){
  .mq__t{animation-duration:90s}
  .mq--r .mq__t{animation-duration:108s}
  .lg{padding:.6rem .8rem}
  .lg img{opacity:.8}
}

/* ── [8] HİZMETLER + KEŞFET ───────────────────────────────────────────────
   .hz__m mobilde 190px'e sabitlenmişti (style.css:498): metin tam
   genişlikte akarken görsel satırın yarısında kalıp yanında 150px'lik
   boş oyuk bırakıyordu. Ölçüm 375px: 190×130.6 → 339.8×191.1.
   640–899px tablet bandında da aynı kusur vardı; orada 420px'e çıkarıldı. */
@media(max-width:639px){
  .hz__m{max-width:none;width:100%;aspect-ratio:16/9;margin-top:.85rem;border-radius:var(--r)}
}
@media(min-width:640px) and (max-width:899px){
  .hz__m{max-width:420px;aspect-ratio:16/9;margin-top:.85rem;border-radius:var(--r)}
}
@media(max-width:899px){
  .hz__all{min-height:44px;padding-block:.55rem;margin-top:1.1rem}
  .hz__n{color:var(--i400)}
}
@media(max-width:1039px){
  .mw__i--v{min-height:min(78vw,340px)}
  .mw__i--v::after{background:linear-gradient(180deg,rgba(30,27,75,.18) 0%,rgba(30,27,75,.34) 34%,rgba(30,27,75,.9) 100%)}
}
@media(max-width:639px){
  .mw__k{font-size:.8rem;letter-spacing:.1em}
}
/* Dokunmatikte :hover kilitleniyor: parmak kalkınca satır kaymış kalıyordu */
@media(hover:none){
  .hz__i:hover{background:transparent;padding-inline:0}
  .hz__i:hover .hz__m img{transform:none}
  .hz__i:hover .hz__go{background:transparent;border-color:var(--line);color:var(--i600);transform:none}
  .hz__all:hover{gap:.6rem}
  .mw__i:hover{transform:none}
  .mw__i:hover img{transform:none}
  .mw__i--v:hover .mw__play{transform:none}
  .hz__i:active{background:var(--i150)}
  .hz__i:active .hz__go{background:var(--i500);border-color:var(--i500);color:#fff}
}
@media(hover:none) and (max-width:899px){
  .hz__i:hover .hz__n{color:var(--i400)}
}

/* ── [9] SÜREÇ + SSS ──────────────────────────────────────────────────────
   .hs__rail 375px'te iki satıra kırılıyor, aktif sekme göstergesi rayın
   alt hairline'ının 58.8px yukarısında havada kalıyordu — bölüm kırık
   görünüyordu. Yatay kaydırılabilir şeride çevrildi (scrollbar gizli,
   kenar boşluğu telafili); aktif sekme app.js ile görünür tutuluyor. */
@media(max-width:600px){
  .hs__rail{flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-x:contain;
    scrollbar-width:none;
    margin-inline:calc(var(--gut) * -1);padding-inline:var(--gut)}
  .hs__rail::-webkit-scrollbar{display:none}
  .hs__y{flex:0 0 auto;white-space:nowrap;color:var(--body)}
  .hs__y::before{bottom:0}
  .hs__t{font-size:.8rem}
  .fq__b{padding-right:0}
}

/* ── [10] İLETİŞİM + FOOTER + FAB ────────────────────────────────────────
   Sabit WhatsApp butonu telif satırının sonunu örtüyordu (ölçüldü:
   .ft__b p sağ kenarı 346.1 vs .fab sol kenarı 307).
   Telefon/e-posta bağlantıları ve footer link satırları 20–26px'ti. */
@media(max-width:1219px){
  .ft__b{padding-right:3.5rem}
  .ct__v a{display:inline-block;padding-block:.75rem;margin-block:-.5rem}
  .ft__b ul a{padding-block:.7rem}
  .ft a.ft__top{padding:.7rem 1.1rem;border:1px solid rgba(255,255,255,.18);
    border-radius:var(--pill)}
  .ft__g ul{gap:0}
  .ft__g ul li a{padding-block:.6rem}
  .ft__c li svg{margin-top:.92rem}
  .ft__c li:first-child svg{margin-top:.32rem}
  .ct__k,.fld label{font-size:.8rem;letter-spacing:.1em}
  .ct__kv input{width:24px;height:24px;margin-top:.05rem}
}
@media(max-width:480px){
  .ft__acts{display:grid;grid-template-columns:1fr}
  .ft__acts .btn{width:100%}
}

/* ── [11] GLOBAL ──────────────────────────────────────────────────────────
   a) Silinmiş bileşenlerden sızan ölü boşluk: yeni .ft/.ct blokları bu
      özellikleri hiç atamadığı için eski değerler yaşıyordu — footer
      üstünde 83px boş indigo band, form alan aralığı 47px (hedef 30px),
      etiket–input aralığı 14px (hedef 8px). Belge −214px kısalıyor.
   b) .ft h3 mobilde 11.52px'ti → 12px taban.
   c) Odak halkası koyu footer'da 2.54:1 kontrastla görünmüyordu
      (WCAG 1.4.11 min 3:1); beyaz halka aynı zeminde 15.9:1.
   d) Dokunma vurgusu tarayıcı varsayılanı camgöbeğiydi → palet içi. */
@media(max-width:1219px){
  .ft{padding-top:0}
  .ft .ft__b{margin-top:0}
  .ct__f .fld{margin-bottom:0}
  .ct__f .fld label{margin-bottom:0}
}
@media(max-width:430px){
  .ft h3{font-size:.75rem}
}
.ft :focus-visible{outline-color:#fff}
/* Dokunma vurgusu kapalı: indigo %16 açık zeminde pembe bir kutu olarak
   okunuyordu. Geri bildirim :hover ve :active'ten geliyor, klavye
   kullanıcısı :focus-visible görüyor. */
html{-webkit-tap-highlight-color:transparent}
.ku__tab:active b,.tb__t:active,.hz__i:active{opacity:.72}

/* ═══════════════════════════════════════════════════════════════════════
   SAYFA BİLEŞENLERİ — alt sayfalarda kullanılır (ana sayfada yok)
   Aynı dil: kart yok, kutu gölgesi yok, ayrım hairline, yuvarlatılmış medya.
   ═══════════════════════════════════════════════════════════════════════ */

/* ── Sayfa başlığı bandı ────────────────────────────────────────────────── */
/* Sade tutulur: kırıntı yolu + sayfa adı. Sayfanın ne olduğunu kırıntı yolu
   zaten söylüyor; band bir açılış görseli değil, bir konum işareti.
   İçeriğin kendisi ilk bölümün başlığıyla başlar. */
.ph{background:var(--i50);border-bottom:1px solid var(--line);
  padding-block:clamp(1.25rem,2.4vw,1.8rem) clamp(1.7rem,3.2vw,2.5rem);position:relative;overflow:hidden}
.ph::before{content:"";position:absolute;right:-6%;top:-260%;width:38vw;height:38vw;border-radius:50%;
  filter:blur(110px);opacity:.14;background:var(--i300);pointer-events:none}
.ph .wrap{position:relative}
.ph__g{display:grid;gap:1.6rem 3.5rem;align-items:end}
/* İki kolona yalnızca ikinci bir öğe varsa geçer (404'ün düğmeleri, Elementor'da
   isteğe bağlı rakam bloğu). Tek başlıklı bandda başlık tam genişlik alır. */
@media(min-width:980px){
  .ph__g:has(>:nth-child(2)){grid-template-columns:minmax(0,1fr) minmax(280px,.62fr)}
}
.ph__h{font-family:var(--hd);font-size:clamp(1.7rem,3.2vw,2.5rem);font-weight:700;letter-spacing:-.032em;
  line-height:1.12;color:var(--ink);margin:0;text-wrap:balance}
.ph__d{margin:1.1rem 0 0;font-size:clamp(1rem,1.5vw,1.1rem);line-height:1.66;color:var(--body);
  max-width:60ch}
.ph__h::after{content:"";display:block;width:min(100%,116px);height:3px;margin-top:.95rem;
  border-radius:var(--pill);
  background:linear-gradient(90deg,var(--i500) 0%,var(--i300) 46%,transparent 100%)}

/* Aşağıdaki iki blok statik sayfalarda kullanılmıyor; Elementor'daki
   "Sayfa Başlığı Bandı" widget'ında etiket ve rakamlar isteğe bağlı kontrol
   olarak duruyor. Kaldırılırsa o kontroller biçimsiz kalır. */
.ph__k{display:block;font-family:var(--hd);font-size:.75rem;font-weight:900;letter-spacing:.15em;
  text-transform:uppercase;color:var(--i500);margin-bottom:.7rem}
.ph__f{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;
  border-top:1px solid var(--line);padding-top:1.2rem}
.ph__f div{padding-inline:.8rem;border-left:1px solid var(--line)}
.ph__f div:first-child{border-left:0;padding-left:0}
.ph__f div:last-child{padding-right:0}
.ph__f b{display:block;font-family:var(--hd);font-size:clamp(1.5rem,2.6vw,2rem);font-weight:800;
  letter-spacing:-.03em;color:var(--i500);line-height:1}
.ph__f span{display:block;margin-top:.3rem;font-size:.82rem;color:var(--mute);line-height:1.4}

/* ── Kırıntı yolu ───────────────────────────────────────────────────────── */
.crumb{margin-bottom:0}
.crumb ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;align-items:center;
  gap:.2rem .45rem;font-size:.78rem;line-height:1.4;color:var(--mute)}
/* inline-block + dikey dolgu: metin 19px, dokunma hedefi 27px olur.
   Satır yüksekliği .crumb ol'un align-items:center'ı sayesinde değişmiyor. */
.crumb a{display:inline-block;padding-block:.2rem;
  color:var(--mute);text-decoration:none;transition:color .2s var(--ease)}
.crumb a:hover{color:var(--i500)}
.crumb li+li::before{content:"/";margin-right:.45rem;color:var(--line)}
.crumb [aria-current]{color:var(--body)}

/* ── Uzun metin (hizmet sayfaları) ──────────────────────────────────────── */
.prose{max-width:72ch;font-size:clamp(1rem,1.35vw,1.08rem);line-height:1.78;color:var(--body)}
.prose>*+*{margin-top:1.15em}
.prose h2{font-family:var(--hd);font-size:clamp(1.5rem,2.9vw,2.15rem);font-weight:700;
  letter-spacing:-.032em;line-height:1.16;color:var(--ink);margin-top:2.6em;scroll-margin-top:120px}
.prose h2:first-child{margin-top:0}
.prose h3{font-family:var(--hd);font-size:clamp(1.15rem,1.9vw,1.35rem);font-weight:700;
  letter-spacing:-.022em;color:var(--ink);margin-top:1.9em}
.prose strong{color:var(--ink);font-weight:600}
.prose a{color:var(--i600);text-decoration:underline;text-underline-offset:3px;
  text-decoration-thickness:1px;text-decoration-color:var(--i200)}
.prose a:hover{text-decoration-color:var(--i600)}
.prose ul,.prose ol{padding-left:0;list-style:none;margin-top:1.2em}
.prose li{position:relative;padding-left:1.7rem;margin-top:.55em}
.prose ul>li::before{content:"";position:absolute;left:.25rem;top:.72em;width:6px;height:6px;
  border-radius:var(--pill);background:var(--i300)}
.prose ol{counter-reset:pl}
.prose ol>li{counter-increment:pl;padding-left:2.1rem}
.prose ol>li::before{content:counter(pl,decimal-leading-zero);position:absolute;left:0;top:.05em;
  font-family:var(--hd);font-size:.82rem;font-weight:800;color:var(--i400);letter-spacing:.02em}
.prose blockquote{margin-block:1.8em;padding:0 0 0 1.5rem;border-left:3px solid var(--i200);
  font-size:1.1em;line-height:1.6;color:var(--ink);font-family:var(--hd);font-weight:500;
  letter-spacing:-.015em}
.prose hr{border:0;border-top:1px solid var(--line);margin-block:2.6em}
.prose figure{margin-block:2em}
.prose img{width:100%;height:auto;border-radius:var(--r);display:block}
.prose figcaption{margin-top:.7rem;font-size:.86rem;color:var(--mute)}
.prose table{width:100%;border-collapse:collapse;font-size:.94rem;margin-block:1.8em}
.prose th,.prose td{text-align:left;padding:.85rem 1rem .85rem 0;border-bottom:1px solid var(--line);
  vertical-align:top}
.prose th{font-family:var(--hd);font-weight:700;color:var(--ink);font-size:.8rem;
  letter-spacing:.08em;text-transform:uppercase}

/* İçerik + yan sütun düzeni */
.doc{display:grid;gap:clamp(2.4rem,5vw,4rem)}
@media(min-width:1040px){.doc{grid-template-columns:minmax(0,1fr) 290px;align-items:start}}
.side{display:grid;gap:2.2rem}
@media(min-width:1040px){.side{position:sticky;top:120px}}
.side h2{font-family:var(--hd);font-size:.75rem;font-weight:900;letter-spacing:.15em;
  text-transform:uppercase;color:var(--i500);margin:0 0 1rem}
.toc ol{list-style:none;margin:0;padding:0;counter-reset:t;border-top:1px solid var(--line)}
.toc li{counter-increment:t;border-bottom:1px solid var(--line)}
.toc a{display:flex;gap:.8rem;padding:.8rem 0;font-size:.94rem;line-height:1.45;color:var(--body);
  text-decoration:none;transition:color .2s var(--ease)}
.toc a::before{content:counter(t,decimal-leading-zero);flex:none;font-family:var(--hd);font-size:.78rem;
  font-weight:800;color:var(--i400);padding-top:.15rem}
.toc a:hover{color:var(--i600)}
.toc a[aria-current]{color:var(--i600);font-weight:600}
.toc a[aria-current]::before{color:var(--i500)}

/* Yan sütun kutusu — kart değil, hairline çerçeveli blok */
.aside{border-top:2px solid var(--i500);padding-top:1.2rem}
.aside p{margin:0 0 1rem;font-size:.94rem;line-height:1.6;color:var(--body)}
/* Dar sütunda hap buton: uzun etiket ("Ön Görüşme (Business)") iki satıra
   sarıyor ve dolgular şişiyordu. Metin ortalanıyor, ok metinle aynı satırda
   kalsın diye sarmalayıcı flex; punto ve dolgu sütuna göre küçültülüyor. */
.aside .btn{width:100%;display:flex;align-items:center;justify-content:center;
  gap:.5rem;padding:.85rem 1.1rem;font-size:.88rem;line-height:1.35;
  text-align:center;text-wrap:balance;border-radius:var(--r)}
.aside .btn svg{flex:none}

/* İçindekiler: aktif satır sol çizgiyle de belli olsun — yalnız renk değişimi
   uzun listede fark edilmiyordu. */
.toc li{position:relative}
.toc a[aria-current]::after{content:"";position:absolute;left:-.9rem;top:.55rem;bottom:.55rem;
  width:3px;border-radius:var(--pill);background:var(--i500)}
.toc a{border-radius:var(--r-s)}
.toc a:focus-visible{outline:2px solid var(--i500);outline-offset:2px}

/* ── Ekip ızgarası ──────────────────────────────────────────────────────── */
.tm{display:grid;gap:clamp(1.8rem,3vw,2.6rem) clamp(1.2rem,2.4vw,2rem);
  grid-template-columns:repeat(2,minmax(0,1fr))}
@media(min-width:700px){.tm{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(min-width:1100px){.tm{grid-template-columns:repeat(4,minmax(0,1fr))}}
.tm__i{display:flex;flex-direction:column}
.tm__p{aspect-ratio:1/1;border-radius:var(--r);overflow:hidden;background:var(--i100);
  margin-bottom:1.05rem}
.tm__p img{width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .55s var(--ease),filter .55s var(--ease);filter:grayscale(1) contrast(1.04)}
.tm__i:hover .tm__p img{transform:scale(1.05);filter:grayscale(0) contrast(1)}
.tm__n{font-family:var(--hd);font-size:clamp(1rem,1.5vw,1.12rem);font-weight:700;letter-spacing:-.022em;
  color:var(--ink);margin:0;line-height:1.25}
.tm__r{margin:.4rem 0 0;font-size:.88rem;line-height:1.5;color:var(--mute)}
/* Kurucu satırı — geniş, iki kolon */
.founder{display:grid;gap:clamp(1.8rem,4vw,3.2rem);align-items:center;
  padding-bottom:clamp(2.4rem,4.5vw,3.6rem);margin-bottom:clamp(2.4rem,4.5vw,3.6rem);
  border-bottom:1px solid var(--line)}
@media(min-width:820px){.founder{grid-template-columns:minmax(220px,.38fr) minmax(0,1fr)}}
.founder__p{aspect-ratio:1/1;border-radius:var(--r);overflow:hidden;background:var(--i100);
  max-width:340px}
.founder__p img{width:100%;height:100%;object-fit:cover;display:block;filter:grayscale(1) contrast(1.04)}

/* ── Hizmet kartı ızgarası (hub sayfası) ────────────────────────────────── */
.sv{display:grid;gap:0;border-top:1px solid var(--line)}
.sv__i{display:grid;gap:.6rem 2rem;align-items:start;padding-block:clamp(1.2rem,2.2vw,1.75rem);
  border-bottom:1px solid var(--line);text-decoration:none;color:inherit;
  transition:background-color .3s var(--ease),padding-inline .3s var(--ease)}
@media(min-width:900px){
  .sv__i{grid-template-columns:4.5rem minmax(0,1.15fr) minmax(0,1fr) 3rem}
}
.sv__i:hover{background:var(--i50);padding-inline:clamp(.9rem,1.6vw,1.5rem)}
.sv__n{font-family:var(--hd);font-size:clamp(1.05rem,1.5vw,1.35rem);font-weight:800;color:var(--i400);
  line-height:1;transition:color .3s}
.sv__i:hover .sv__n{color:var(--i500)}
.sv__h{font-family:var(--hd);font-size:clamp(1.25rem,2.2vw,1.85rem);font-weight:700;color:var(--ink);
  letter-spacing:-.032em;line-height:1.14;margin:0}
.sv__d{font-size:.95rem;line-height:1.65;color:var(--body);margin:0}
.sv__m{margin:.5rem 0 0;font-size:.84rem;color:var(--mute);display:flex;flex-wrap:wrap;gap:.35rem .9rem}
.sv__m span{display:inline-flex;align-items:center;gap:.35rem}
.sv__go{justify-self:end;width:46px;height:46px;display:grid;place-items:center;border-radius:var(--pill);
  border:1px solid var(--line);color:var(--i600);
  transition:background-color .3s,border-color .3s,color .3s,transform .3s var(--ease)}
.sv__i:hover .sv__go{background:var(--i500);border-color:var(--i500);color:#fff;transform:translateX(4px)}
@media(max-width:899px){.sv__go{display:none}}

/* ── Kapanış CTA bandı (tüm alt sayfalarda footer'dan önce) ─────────────── */
.cta{background:var(--i900);color:var(--i200);border-radius:var(--r);position:relative;overflow:hidden;
  margin-block:clamp(3rem,6vw,5rem)}
.cta::before{content:"";position:absolute;width:44vw;height:44vw;border-radius:50%;filter:blur(110px);
  opacity:.26;background:var(--i500);left:-8%;top:-60%;pointer-events:none}
.cta__g{position:relative;display:grid;gap:1.8rem 3rem;align-items:center;
  padding:clamp(2.2rem,4.5vw,3.6rem) clamp(1.4rem,4vw,3.4rem)}
@media(min-width:900px){.cta__g{grid-template-columns:minmax(0,1fr) auto}}
.cta h2{font-family:var(--hd);font-size:clamp(1.5rem,3vw,2.35rem);font-weight:700;letter-spacing:-.035em;
  line-height:1.1;color:#fff;margin:0;text-wrap:balance}
.cta p{margin:.9rem 0 0;font-size:1rem;line-height:1.65;color:var(--i200);max-width:52ch}
.cta__b{display:flex;flex-wrap:wrap;gap:.8rem}
.cta .btn{background:#fff;border-color:#fff;color:var(--i700)}
.cta .btn:hover{background:var(--i200);border-color:var(--i200);color:var(--i900)}
.cta .btn--o{background:transparent;color:#fff;border-color:rgba(255,255,255,.45)}
.cta .btn--o:hover{background:#fff;border-color:#fff;color:var(--i700)}
@media(max-width:520px){.cta__b{display:grid;grid-template-columns:1fr}.cta .btn{width:100%}}

/* ── Diğer hizmetler / sayfalar arası gezinme ───────────────────────────── */
.also{border-top:1px solid var(--line);padding-top:clamp(1.8rem,3vw,2.6rem)}
.also__l{display:grid;gap:0;margin-top:1.2rem}
@media(min-width:760px){.also__l{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:2.5rem}}
.also__l a{display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding:.95rem 0;border-bottom:1px solid var(--line);text-decoration:none;color:var(--ink);
  font-family:var(--hd);font-weight:600;font-size:1rem;letter-spacing:-.015em;
  transition:color .25s var(--ease),padding-left .25s var(--ease)}
.also__l a:hover{color:var(--i600);padding-left:.5rem}
.also__l svg{flex:none;color:var(--i300)}
.also__l a:hover svg{color:var(--i500)}

/* ── Bilgi satırları (iletişim sayfası vb.) ─────────────────────────────── */
.kv{display:grid;gap:0;border-top:1px solid var(--line)}
.kv__i{display:grid;gap:.2rem 1.5rem;padding-block:.95rem;border-bottom:1px solid var(--line)}
@media(min-width:620px){.kv__i{grid-template-columns:minmax(150px,.3fr) minmax(0,1fr);align-items:baseline}}
.kv__k{font-family:var(--hd);font-size:.75rem;font-weight:900;letter-spacing:.14em;text-transform:uppercase;
  color:var(--mute)}
.kv__v{font-size:1rem;line-height:1.6;color:var(--ink);overflow-wrap:break-word}
.kv__v a{color:inherit;text-decoration:none;transition:color .2s var(--ease)}
.kv__v a:hover{color:var(--i500)}
.kv__v small{display:block;margin-top:.25rem;font-size:.88rem;color:var(--body)}

@media(max-width:1219px){
  .kv__v a{display:inline-block;padding-block:.6rem;margin-block:-.45rem}
}
/* Kırıntı yolu sayfa başlığı bandının içinde — üstbaşlıkla arasına nefes */
.ph .crumb{margin-bottom:clamp(.75rem,1.5vw,1.05rem)}

/* ── Hizmet vitrini — Hizmetlerimiz sayfasına özel ────────────────────────
   Ana sayfadaki .hz satır listesi kompakttır (görsel 136px). Kendi sayfasında
   her hizmetin daha fazla ağırlığa ihtiyacı var: büyük medya + kapsam etiketleri,
   satırlar dönüşümlü (tek numaralarda görsel solda, çiftlerde sağda).        */
.sf{display:grid;gap:clamp(2.4rem,4.5vw,3.8rem);margin-top:clamp(2rem,4vw,3rem)}
.sf__i{display:grid;gap:clamp(1.3rem,3vw,2.8rem);align-items:center;
  padding-bottom:clamp(2.4rem,4.5vw,3.8rem);border-bottom:1px solid var(--line)}
.sf__i:last-child{border-bottom:0;padding-bottom:0}
@media(min-width:900px){
  .sf__i{grid-template-columns:1.02fr 1fr}
  .sf__i:nth-child(even)>.sf__m{order:2}
}
.sf__m{display:block;border-radius:var(--r);overflow:hidden;aspect-ratio:16/10;
  background:var(--i800);position:relative}
.sf__m img{width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .55s var(--ease)}
.sf__i:hover .sf__m img{transform:scale(1.04)}
.sf__b{min-width:0}
.sf__n{display:block;font-family:var(--hd);font-size:.82rem;font-weight:800;letter-spacing:.08em;
  color:var(--i400);margin-bottom:.7rem}
.sf__h{font-family:var(--hd);font-size:clamp(1.45rem,2.7vw,2.15rem);font-weight:700;
  letter-spacing:-.035em;line-height:1.12;margin:0 0 .75rem;color:var(--ink)}
.sf__h a{color:inherit;text-decoration:none;transition:color .25s var(--ease)}
.sf__h a:hover{color:var(--i600)}
.sf__l{margin:0;font-size:1rem;line-height:1.65;color:var(--body)}
.sf__meta{display:flex;flex-wrap:wrap;gap:.4rem .9rem;margin-top:.9rem;
  font-family:var(--hd);font-size:.85rem;font-weight:700;color:var(--i600)}
.sf__meta span{display:inline-flex;align-items:center;gap:.4rem}
.sf__meta span+span::before{content:"";width:4px;height:4px;border-radius:var(--pill);
  background:var(--i200);margin-right:.5rem}
.sf__k{display:block;margin:1.4rem 0 .55rem;font-size:.72rem;font-weight:800;letter-spacing:.14em;
  text-transform:uppercase;color:var(--mute)}
.sf__c{display:flex;flex-wrap:wrap;gap:.45rem;list-style:none;margin:0;padding:0}
.sf__c li{font-size:.85rem;line-height:1.3;color:var(--i700);background:var(--i100);
  border-radius:var(--pill);padding:.42rem .85rem}
.sf__go{display:inline-flex;align-items:center;gap:.55rem;margin-top:1.5rem;
  font-family:var(--hd);font-size:.98rem;font-weight:700;letter-spacing:-.018em;
  color:var(--i600);text-decoration:none;padding-block:.35rem;
  transition:gap .25s var(--ease)}
.sf__go:hover{gap:.95rem}
.sf__go svg{flex:none}
@media(max-width:899px){
  .sf__go{min-height:44px;align-items:center}
}
/* .sf__c, .ku__b içinde kullanıldığında: .ku__b ul (0,1,1) düz .sf__c'yi (0,1,0)
   eziyor ve etiketler tam genişlik satıra dönüşüyordu. Kapsamı eşitliyoruz. */
.ku__b ul.sf__c{display:flex;flex-wrap:wrap;gap:.45rem;margin:0}
.ku__b ul.sf__c li{padding-left:.85rem;font-size:.85rem;line-height:1.3;margin-top:0;
  color:var(--i700);background:var(--i100);border-radius:var(--pill);padding:.42rem .85rem}
.ku__b ul.sf__c li::before{content:none}

/* ── Fayda / adım ızgarası — .prose içindeki uzun <strong> başlıklı listeler
   için. Madde madde akan 8 satırlık bir liste yerine taranabilir bir ızgara.
   Yalnızca listeye class eklenir; içerik markup'ı değişmez.
   Özgüllük notu: .prose ul>li::before (0,1,3) tabanını ezmek için seçiciler
   .prose ile kapsamlanıp sınıf sayısı artırıldı.                            */
.prose .bn{list-style:none;margin:1.9em 0 0;padding:0;counter-reset:bn;
  display:grid;gap:0 clamp(1.8rem,3.5vw,3.2rem)}
@media(min-width:720px){.prose .bn{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* 3. sütun yalnızca yan sütunsuz (tam genişlik) prose bloklarında —
   .doc içinde prose ~700px kalıyor ve 3 sütun 210px'e düşüp okunmuyor. */
@media(min-width:1240px){.prose[style*="max-width:none"] .bn--3{grid-template-columns:repeat(3,minmax(0,1fr))}}
.prose .bn>li{counter-increment:bn;position:relative;margin:0;padding:1.25rem 0 1.4rem;
  border-top:1px solid var(--line);font-size:.95rem;line-height:1.62;color:var(--body)}
.prose ol.bn>li::before{content:counter(bn,decimal-leading-zero);position:static;
  display:block;width:auto;height:auto;background:none;border-radius:0;
  font-family:var(--hd);font-size:.8rem;font-weight:800;letter-spacing:.05em;
  color:var(--i400);margin-bottom:.55rem}
.prose ul.bn>li::before{content:"";position:static;display:block;width:22px;height:2px;
  background:var(--i300);border-radius:var(--pill);margin-bottom:.95rem;top:auto;left:auto}
.prose .bn>li>strong{display:block;font-family:var(--hd);font-size:1.03rem;font-weight:700;
  letter-spacing:-.022em;line-height:1.3;color:var(--ink);margin-bottom:.4rem}

/* ── UX: carousel duraklat/oynat (WCAG 2.2.2) ───────────────────────────── */
.car__pause{position:absolute;z-index:4;top:clamp(.6rem,1.6vw,1.15rem);right:clamp(.6rem,1.6vw,1.15rem);
  width:40px;height:40px;padding:0;display:grid;place-items:center;border-radius:var(--pill);
  background:rgba(255,255,255,.92);border:1px solid var(--line);color:var(--i700);cursor:pointer;
  transition:background-color .25s var(--ease),transform .25s var(--ease)}
.car__pause:hover{background:#fff;transform:scale(1.06)}
@media(max-width:600px){.car__pause{width:44px;height:44px;top:.6rem;right:.6rem}}

/* Logo şeridi klavye kullanıcısı için de dursun (yalnız :hover yetmiyordu) */
.mq:focus-within .mq__t{animation-play-state:paused}

/* ── UX: form alan hatası ───────────────────────────────────────────────── */
.fhata{margin:.5rem 0 0;font-size:.85rem;line-height:1.45;color:#b4232a;font-weight:600}
.fld input[aria-invalid="true"],
.fld select[aria-invalid="true"],
.fld textarea[aria-invalid="true"]{border-color:#b4232a;box-shadow:0 1px 0 0 #b4232a}

/* ── UX: menüde aktif durum ─────────────────────────────────────────────
   Masaüstünde arka plan yok; aktif sayfa yalnızca renk ve alt çizgiyle
   belli oluyor (bkz. .nav a::after). Mobil menüde liste dikey olduğu için
   çizgi okunmuyor, orada dolgu kalıyor. */
#nav a[aria-current="page"]{background:var(--i100);color:var(--i700);font-weight:600}

/* Footer artık 5 sütun (Marka · Kurumsal · Keşfet · Hizmetlerimiz · İletişim) */
@media(min-width:700px){.ft__g{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1000px){.ft__g{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(min-width:1280px){.ft__g{grid-template-columns:1.55fr .9fr .9fr 1fr 1.25fr}}

/* ── Logo duvarı (Referanslar sayfası) — kayan şerit değil, sabit ızgara ── */
/* ── LOGO IZGARASI — bitişik hücreler, sürekli ızgara çizgisi ─────────────
   Hücreler arasında boşluk yok; her hücre yalnızca SAĞ ve ALT kenarını
   çiziyor, kapsayıcı da ÜST ve SOL kenarı veriyor. Böylece komşu hücreler
   arasında çift çizgi oluşmuyor ve ızgara tek parça bir tablo gibi okunuyor.
   Marquee'deki .lg sabit genişlikli; ızgarada kolon ölçüsünü devralıyor. */
.lgw{display:grid;gap:0;grid-template-columns:repeat(2,minmax(0,1fr));
  grid-auto-rows:clamp(80px,7.6vw,104px);
  margin-top:clamp(2rem,4vw,3rem);background:#fff;
  border:1px solid var(--line);border-radius:var(--r-s);overflow:hidden}
@media(min-width:560px){.lgw{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(min-width:860px){.lgw{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(min-width:1180px){.lgw{grid-template-columns:repeat(6,minmax(0,1fr))}}

/* Ayraçlar hücrenin SAĞ ve ALT kenarlığı; dış çerçeveyi kapsayıcı veriyor ve
   overflow:hidden son kolon/satırdaki fazlalığı kırpıyor. Böylece logo sayısı
   kolon sayısına tam bölünmese de (77 logo / 6 kolon → son satırda 5 hücre)
   ızgara dört yandan kapalı kalıyor.
   Satır yüksekliği kapsayıcıda sabit: içeriğe bırakılınca kare ya da dikey
   logolar satırı şişirip çizgiyi kırıyordu. */
.lgw .lg{
  width:auto;height:100%;min-height:0;overflow:hidden;margin:0;
  padding:clamp(.7rem,1.4vw,1.15rem);
  background:#fff;border:0;border-radius:0;
  border-right:1px solid var(--line);border-bottom:1px solid var(--line);
  transition:background-color .25s var(--ease)}
/* Bitişik ızgarada yükselme hareketi çizgiyi kırıyor; vurgu zemin tonuyla. */
.lgw .lg:hover{transform:none;background:var(--i50);border-color:transparent}
.lgw .lg img{max-height:100%;max-width:100%;width:auto;height:auto;object-fit:contain}

/* ── Video listesi (Ortak Akıl TV) ──────────────────────────────────────── */
.vd{display:grid;gap:clamp(1.6rem,3vw,2.4rem);margin-top:clamp(2rem,4vw,3rem)}
@media(min-width:760px){.vd{grid-template-columns:repeat(2,minmax(0,1fr))}}
.vd__i{display:block;text-decoration:none;color:inherit}
.vd__m{display:block;position:relative;border-radius:var(--r);overflow:hidden;aspect-ratio:16/10;
  background:var(--i800)}
.vd__m img{width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .55s var(--ease)}
.vd__i:hover .vd__m img{transform:scale(1.04)}
.vd__play{position:absolute;left:1.1rem;bottom:1.1rem;width:56px;height:56px;border-radius:var(--pill);
  display:grid;place-items:center;background:rgba(255,255,255,.95);color:var(--i700);
  transition:transform .35s var(--ease)}
.vd__i:hover .vd__play{transform:scale(1.08)}
.vd__b{display:block;padding-top:1.05rem}
.vd__k{display:inline-block;font-size:.72rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
  color:var(--i500);margin-bottom:.5rem}
.vd__t{display:block;font-family:var(--hd);font-size:clamp(1.1rem,1.8vw,1.32rem);font-weight:700;
  letter-spacing:-.025em;line-height:1.22;color:var(--ink)}
.vd__d{display:block;margin-top:.45rem;font-size:.94rem;line-height:1.6;color:var(--body)}
.vd__go{display:inline-flex;align-items:center;gap:.5rem;margin-top:.85rem;font-family:var(--hd);
  font-size:.92rem;font-weight:700;color:var(--i600);transition:gap .25s var(--ease)}
.vd__i:hover .vd__go{gap:.9rem}
@media(max-width:759px){.vd__go{min-height:44px}}

/* ── Yazı listesi (Blog) ────────────────────────────────────────────────── */
.pl{display:grid;gap:0;border-top:1px solid var(--line);margin-top:clamp(2rem,4vw,3rem)}
.pl__i{display:grid;gap:.3rem 2rem;align-items:baseline;padding-block:clamp(.95rem,1.7vw,1.25rem);
  border-bottom:1px solid var(--line);text-decoration:none;color:inherit;
  transition:background-color .3s var(--ease),padding-inline .3s var(--ease)}
@media(min-width:820px){.pl__i{grid-template-columns:9.5rem minmax(0,1fr) 2.5rem}}
.pl__i:hover{background:var(--i50);padding-inline:clamp(.8rem,1.5vw,1.4rem)}
.pl__d{font-family:var(--hd);font-size:.82rem;font-weight:700;color:var(--mute);letter-spacing:.01em;
  white-space:nowrap}
.pl__b{display:block;min-width:0}
.pl__t{display:block;font-family:var(--hd);font-size:clamp(1.05rem,1.7vw,1.28rem);font-weight:700;
  letter-spacing:-.025em;line-height:1.28;color:var(--ink);transition:color .25s var(--ease)}
.pl__i:hover .pl__t{color:var(--i600)}
.pl__x{display:block;margin-top:.4rem;font-size:.93rem;line-height:1.6;color:var(--body)}
.pl__go{justify-self:end;color:var(--i300);transition:color .25s var(--ease),transform .25s var(--ease)}
.pl__i:hover .pl__go{color:var(--i500);transform:translate(3px,-3px)}
@media(max-width:819px){.pl__go{display:none}}

/* ═══════════════════════════════════════════════════════════════════════
   YAZDIRMA
   Danışmanlık teklifi/hizmet sayfaları yazdırılıyor. Ekranda anlamı olan
   ama kâğıtta yer kaplayan her şey çıkarılır; bağlantı adresleri metne
   dökülür ki basılı sayfada kaynak kaybolmasın.
   ═══════════════════════════════════════════════════════════════════════ */
@media print{
  /* Ekrana özgü ve etkileşimli olanlar */
  .tbar,.hdr,#nav,.fab,.car__nav,.car__dots,.car__pause,.hs__nav,
  .crumb,.also,.cta,.ft__cta,.mq,.lgw,.arrow,.sf__go,.sv__go,.pl__go,
  .hz__go,.vd__go,.btn,.ku__tabs,.hs__rail,.toc,.aside{display:none!important}

  /* Beliriş animasyonu kâğıtta içeriği gizlememeli */
  .rv{opacity:1!important;transform:none!important}
  *,*::before,*::after{animation:none!important;transition:none!important;
    box-shadow:none!important;text-shadow:none!important}

  /* Sekmeli içerikte gizli paneller de basılsın — kâğıtta sekme yok */
  .ku__p[hidden],.hs__s[hidden]{display:grid!important}

  html{font-size:11pt}
  body{background:#fff;color:#000}
  .wrap{width:100%;max-width:none;margin:0;padding:0}
  .sec{padding-block:1.2rem}
  .sec--l,.sec--d,.ph{background:#fff!important;color:#000!important}
  .ph{border-bottom:1px solid #999;padding-block:0 1rem}
  .ph__h,.st__h,.prose h2,.prose h3,.sv__h,.sf__h,.tm__n{color:#000!important}
  .st__k,.ph__k,.sf__n,.sv__n,.hs__big{color:#444!important}
  .st__h::after{background:#000!important}
  .doc{display:block}
  .prose{max-width:none}
  img{max-width:100%!important;height:auto!important}
  .ku__m,.hs__v,.sf__m,.tm__p,.mw{page-break-inside:avoid}

  /* Sayfa bölünmesi */
  h1,h2,h3{page-break-after:avoid;break-after:avoid}
  p,li,tr,figure,.sv__i,.bn>li{page-break-inside:avoid;break-inside:avoid}
  .sec{page-break-before:auto}

  /* Bağlantı adresleri kâğıtta görünsün — sayfa içi çapa ve boş bağlar hariç */
  .prose a[href^="http"]::after{content:" (" attr(href) ")";font-size:.85em;color:#555;
    word-break:break-all}

  /* Alt bilgi sadeleşsin, iletişim bilgisi kalsın */
  .ft{background:#fff!important;color:#000!important;border-top:1px solid #999;
    border-radius:0;margin-top:1.5rem}
  .ft::before{display:none}
  .ft a,.ft h3,.ft__about,.ft__c span{color:#000!important}
  .ft__s,.ft__logo,.ft__b ul{display:none}
  .ft__g{display:block}
  .ft__g>div{margin-bottom:.6rem}
}

/* ── Odak halkasi: koyu zeminlerde ic beyaz bant ────────────────────────
   .fab a kendi box-shadow'unu tasiyor ve taban :focus-visible kuralini
   ozgullukle yeniyor; en dusuk kontrastli ogeler orada oldugu icin
   ayrica yazildi (WhatsApp yesili uzerinde indigo halka 2.03:1 idi). */
.fab a:focus-visible{box-shadow:0 0 0 3px #fff,var(--sh-l)}

/* ── WCAG 2.2.2: kayan seritler icin duraklat denetimi ──────────────────
   .mq (logo seridi) sonsuz kayiyor; 5 saniyeden uzun otomatik hareketin
   durdurulabilir olmasi gerekiyor. Duyuru seridi kaldirilinca dugme buraya
   tasindi. right:calc(5% + .6rem): .mq uzerindeki mask-image alt ogeleri de
   maskeliyor, %95'ten sonrasi soluyor — dugme o sinirin icinde kalir.
   Zemin acik oldugu icin dugme de acik: beyaz zemin, indigo ikon. */
html.oa-dur .mq__t{animation-play-state:paused!important}
.mq{position:relative;overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}
.mq__dur{position:absolute;right:calc(5% + .6rem);top:50%;transform:translateY(-50%);
  width:30px;height:30px;display:grid;place-items:center;padding:0;z-index:2;
  border:1px solid var(--line);border-radius:var(--pill);
  background:#fff;color:var(--i600);cursor:pointer;box-shadow:0 1px 3px rgba(30,27,75,.10)}
.mq__dur:hover{border-color:var(--i300);color:var(--i500)}

/* ═══ TEK YAZI · ARAMA · 404 ═════════════════════════════════════════════ */

/* Yazı künyesi — başlık altındaki tarih · kategori · okuma süresi satırı.
   .prose'un üstünde durur, onun 72ch ölçüsüyle hizalı kalsın diye aynı
   max-width'i alır. */
.art__m{max-width:72ch;margin:0 0 2.2rem;font-family:var(--hd);font-size:.82rem;
  font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--mute)}
.art__m a{color:var(--i600);text-decoration:none}
.art__m a:hover{text-decoration:underline;text-underline-offset:3px}
.art__s{margin-inline:.6rem;color:var(--i300)}

/* Sayfalama — .pl listesinin altında. Sayı düğmeleri 44px: WCAG 2.5.8'in
   24px eşiğinin üstünde, parmakla basılabilir. */
.pg{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:2.6rem}
.pg a,.pg span{display:grid;place-items:center;min-width:44px;height:44px;padding-inline:.9rem;
  border:1px solid var(--line);border-radius:var(--pill);font-family:var(--hd);
  font-size:.9rem;font-weight:700;color:var(--body);text-decoration:none;
  transition:border-color .2s var(--ease),color .2s var(--ease)}
.pg a:hover{border-color:var(--i500);color:var(--i600)}
.pg .current{background:var(--i500);border-color:var(--i500);color:#fff}
.pg .dots{border-color:transparent}

/* Sonuç yok bloğu */
.bos{max-width:52ch;padding:clamp(2.4rem,5vw,3.6rem) 0}
.bos__h{font-family:var(--hd);font-size:clamp(1.5rem,2.9vw,2.15rem);font-weight:700;
  letter-spacing:-.032em;line-height:1.16;color:var(--ink);margin:0 0 .9rem}
.bos__d{font-size:1.02rem;line-height:1.75;color:var(--body);margin:0 0 1.8rem}

/* Elementor Pro arama formu — kendi düğme/alan biçimini getiriyor, siteninkine
   çeviriyoruz. Alan altı çizgili, düğme hap biçimli: iletişim formuyla aynı dil.
   !important şart: Elementor widget CSS'i (widget-search-form.min.css) tema
   stilinden SONRA yükleniyor, aynı özgüllükte kaynak sırası onu kazandırıyor. */
.oa-sf{display:block;margin:0 0 2.8rem}   /* üst boşluk sayfaya göre değişir:
   arama sayfasında form bölümün ilk ögesi, 404'te .also listesinin altında —
   ayrım kapsayıcı dolgusuyla veriliyor, sınıfa gömülmüyor */
.oa-sf .elementor-search-form{width:100%}
.oa-sf .elementor-search-form__container{display:flex;gap:1rem;align-items:center;
  flex-wrap:wrap;max-width:46rem;
  background:transparent!important;border:0!important;border-radius:0!important;
  min-height:auto!important;overflow:visible}
.oa-sf .elementor-search-form__input{flex:1 1 16rem;min-width:0;font:inherit;font-size:1rem;
  color:var(--ink);background:transparent!important;
  border:0!important;border-bottom:1px solid #8a86a8!important;border-radius:0!important;
  padding:.55rem 0 .7rem!important;box-shadow:none;min-height:auto}
.oa-sf .elementor-search-form__input:focus,
.oa-sf .elementor-search-form__input:focus-visible{outline:0;border-bottom-color:var(--i500)!important}
.oa-sf .elementor-search-form__input::placeholder{color:var(--mute);opacity:1}
.oa-sf button,
.oa-sf .elementor-search-form__submit{flex:none;font-family:var(--hd);
  font-size:.88rem;font-weight:700;line-height:1;padding:.85rem 1.8rem!important;
  border:0;border-radius:var(--pill)!important;
  background:var(--i500)!important;color:#fff!important;cursor:pointer;
  min-width:auto!important;min-height:auto!important;height:auto!important;
  transition:background .2s var(--ease)}
.oa-sf button:hover,
.oa-sf .elementor-search-form__submit:hover{background:var(--i600)!important}

/* ── Video oynatıcı — tıkla-yükle (.vp) ──────────────────────────────────
   Haritayla (.ct__map) aynı iskelet: yerel kapak + üstünde oynat düğmesi,
   iframe ancak tıklanınca geliyor. */
.vp{position:relative;aspect-ratio:16/9;max-width:var(--oa-video-max,none);overflow:hidden;border-radius:var(--r);
  background:var(--i800);isolation:isolate}
.vp img,.vp iframe{position:absolute;inset:0;width:100%;height:100%;border:0;
  object-fit:cover;display:block}
/* Kapak görselinin üzerine degrade perde çekilmiyor: kapak zaten koyu ve
   üzerindeki beyaz metin okunur. Perde görseli soluklaştırıyordu. */
.vp::after{content:none}
.vp__btn{position:absolute;inset:0;z-index:2;width:100%;height:100%;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:1rem;background:none;border:0;cursor:pointer;color:#fff;padding:0}
.vp__play{display:grid;place-items:center;width:5rem;height:5rem;flex:none;
  border-radius:var(--pill);background:rgba(255,255,255,.16);color:#fff;
  backdrop-filter:blur(6px);
  transition:transform .3s var(--ease),background-color .3s var(--ease)}
.vp__btn:hover .vp__play{transform:scale(1.06);background:var(--i500)}
.vp__btn:focus-visible .vp__play{outline:3px solid #fff;outline-offset:3px}
.vp__lbl{font-family:var(--hd);font-size:clamp(1rem,1.6vw,1.25rem);font-weight:700;
  letter-spacing:-.015em;text-align:center;max-width:32ch;text-wrap:balance}
.vp__sure{display:block;margin-top:.35rem;font-size:.8rem;font-weight:600;
  letter-spacing:.08em;text-transform:uppercase;color:var(--i200)}
.vp__not{position:absolute;left:0;right:0;bottom:0;z-index:2;margin:0;
  padding:.7rem clamp(1rem,2vw,1.5rem);font-size:.78rem;line-height:1.5;
  color:var(--i200);background:rgba(30,27,75,.55);backdrop-filter:blur(4px)}
@media(max-width:559px){
  .vp__play{width:3.6rem;height:3.6rem}
  .vp__not{font-size:.72rem}
}

/* ── Instagram akışı (.ig) ───────────────────────────────────────────────
   Kareler ızgarası. Gerçek gönderiler sunucuda çekilip yerel görsel olarak
   basılacak — Instagram'ın gömme betiği ziyaretçinin IP'sini Meta'ya
   gönderdiği için kullanılmıyor. */
.ig{display:grid;gap:clamp(.5rem,1vw,.85rem);
  grid-template-columns:repeat(2,minmax(0,1fr))}
@media(min-width:640px){.ig{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(min-width:1040px){.ig{grid-template-columns:repeat(6,minmax(0,1fr))}}
.ig__i{position:relative;display:block;aspect-ratio:1;overflow:hidden;
  border-radius:var(--r-s);background:var(--i100);
  text-decoration:none;color:#fff;isolation:isolate}
.ig__i img{width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .45s var(--ease)}
.ig__i:hover img{transform:scale(1.05)}
.ig__i::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(30,27,75,0) 45%,rgba(30,27,75,.62) 100%);
  opacity:0;transition:opacity .3s var(--ease)}
.ig__i:hover::after,.ig__i:focus-visible::after{opacity:1}
.ig__ov{position:absolute;top:.5rem;right:.5rem;z-index:2;display:grid;
  place-items:center;width:1.9rem;height:1.9rem;border-radius:var(--pill);
  background:rgba(255,255,255,.18);backdrop-filter:blur(4px);color:#fff;
  opacity:0;transform:translateY(-.2rem);
  transition:opacity .3s var(--ease),transform .3s var(--ease)}
.ig__i:hover .ig__ov,.ig__i:focus-visible .ig__ov{opacity:1;transform:none}
.ig__c{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:.6rem .7rem;
  font-size:.76rem;line-height:1.4;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  opacity:0;transition:opacity .3s var(--ease)}
.ig__i:hover .ig__c,.ig__i:focus-visible .ig__c{opacity:1}
.ig + .arrow{margin-top:clamp(1.2rem,2vw,1.6rem)}

/* ── Metin akordiyonu (.pa) ──────────────────────────────────────────────
   Uzun rehber metinleri tek parça akışta altı ekranı buluyordu. <details>
   ile her H2 kapalı bir başlık: ziyaretçi ilgilendiğini açıyor, sayfa boyu
   bir ekrana iniyor. JS yok — açma/kapama tarayıcının işi. */
.pa{margin-top:1.6em;border-top:1px solid var(--line)}
.pa__i{border-bottom:1px solid var(--line)}
.pa__s{display:flex;align-items:center;gap:.9rem;padding:1.05rem 2.4rem 1.05rem 0;
  position:relative;cursor:pointer;list-style:none;
  font-family:var(--hd);font-size:clamp(1.02rem,1.5vw,1.15rem);font-weight:700;
  letter-spacing:-.018em;line-height:1.35;color:var(--ink);
  transition:color .2s var(--ease)}
.pa__s::-webkit-details-marker{display:none}
.pa__s:hover{color:var(--i600)}
.pa__s:focus-visible{outline:2px solid var(--i500);outline-offset:3px;border-radius:var(--r-s)}
/* artı/eksi göstergesi */
.pa__s::after{content:"";position:absolute;right:.3rem;top:50%;width:13px;height:13px;
  margin-top:-6.5px;flex:none;
  background:
    linear-gradient(var(--i500),var(--i500)) center/100% 2px no-repeat,
    linear-gradient(var(--i500),var(--i500)) center/2px 100% no-repeat;
  transition:transform .28s var(--ease)}
/* Açıkken yalnız yatay çizgi (eksi) kalsın. Döndürme uygulanınca kalan tek
   çizgi dikeye dönüyordu — kapalıyla aynı görünüyordu. */
.pa__i[open] .pa__s::after{
  background:linear-gradient(var(--i500),var(--i500)) center/100% 2px no-repeat}
.pa__i[open] .pa__s{color:var(--i600)}
.pa__b{padding:0 0 1.4rem}
.pa__b > *:first-child{margin-top:0}
/* Yazdırmada hepsi açık gelsin */
@media print{.pa__i{border:0}.pa__i .pa__b{display:block!important}}

/* ── BÖLÜM SEKMELERİ (.tabgrup → .tg) ─────────────────────────────────────
   Arka arkaya gelen bölümleri tek ekrana toplar. İşaretlemeyi JS üretir
   (bolumSekmeleri); JS yoksa bölümler alt alta görünür ve bu blok devreye
   girmez — tüm kurallar .tg sınıfına bağlı, onu da JS ekler.

   Biçim, tasarımın düz dilinden: kart ve gölge yok. Grup tek bir yüzey
   (--i50); sekme şeridi beyaz bir bant; seçili sekme panelle aynı rengi
   alarak bandı deler ve gövdeye bağlanır. Ayrım çizgileri saç teli. */
.tg{background:var(--i50);padding-inline:0;--e-con-padding:0}
.tg>.tg__p{background:transparent!important;padding-block:var(--py)!important}
.tg__gizli{display:none!important}
/* Elementor kapsayıcılara .e-con{display:flex} veriyor; bu, tarayıcının
   [hidden]{display:none} kuralını sınıf önceliğiyle eziyordu. */
.tg>[hidden]{display:none!important}

.tg__bar{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.tg__ray{display:flex;gap:0;overflow-x:auto;scrollbar-width:none;
  width:min(100% - (var(--gut) * 2),var(--wrap));margin-inline:auto;
  scroll-snap-type:x proximity}
.tg__ray::-webkit-scrollbar{display:none}

.tg__t{position:relative;flex:none;scroll-snap-align:start;
  display:inline-flex;align-items:baseline;gap:.55rem;
  background:none;border:0;border-right:1px solid var(--line-2);cursor:pointer;
  padding:var(--oa-tab-pad,1.15rem) 1.35rem;min-height:44px;
  font:inherit;color:var(--body);white-space:nowrap;
  transition:background-color .2s var(--ease),color .2s var(--ease)}
.tg__t:first-child{border-left:1px solid var(--line-2)}
.tg__n{font-family:var(--bd);font-style:normal;font-size:.7rem;font-weight:800;
  letter-spacing:.08em;color:var(--mute);transition:color .2s var(--ease)}
.tg__e{font-size:.95rem;font-weight:500;letter-spacing:-.01em}
.tg__t:hover{background:var(--i50);color:var(--i600)}
.tg__t:hover .tg__n{color:var(--i400)}

/* Seçili sekme: panelle aynı zemin + üstte marka çizgisi. Alt kenardaki
   1px'i örterek gövdeye bağlanır — "bağlı sekme" görünümü, gölgesiz. */
.tg__t[aria-selected="true"]{background:var(--i50);color:var(--ink)}
.tg__t[aria-selected="true"] .tg__e{font-weight:700}
.tg__t[aria-selected="true"] .tg__n{color:var(--i500)}
.tg__t[aria-selected="true"]::before{content:"";position:absolute;inset:0 auto auto 0;
  width:100%;height:2px;background:var(--i500)}
.tg__t[aria-selected="true"]::after{content:"";position:absolute;left:0;right:0;bottom:-1px;
  height:1px;background:var(--i50)}
.tg__t:focus-visible{outline:2px solid var(--i500);outline-offset:-3px}

/* Koyu bölümler grup içine girerse şerit de ters okunur. */
.tg .sec--d{background:transparent!important}

@media(max-width:700px){
  .tg__t{padding:.95rem 1rem}
  .tg__e{font-size:.88rem}
  .tg__n{font-size:.64rem}
}
@media(prefers-reduced-motion:reduce){
  .tg__t{transition:none}
}

/* ── FORM ALANLARI — Pro'nun kendi kuralını geri alma ─────────────────────
   Ölçüm: .elementor-field-textual arka planı #fff, yüksekliği 83px geliyordu;
   oysa yukarıdaki kuralımız transparent + otomatik yükseklik veriyor. Pro'nun
   .elementor-form-fields-wrapper .elementor-field-group .elementor-field
   seçicisi (0,3,0) bizimkini (0,2,0) yeniyor. Aynı derinlikte yazınca
   sonradan gelen bizim bloğumuz kazanıyor — !important gerekmiyor.
   Alanlar tasarımın geri kalanıyla aynı: alt çizgili, dolgusuz. */
.elementor-form .elementor-field-group .elementor-field-textual{
  background:transparent;border:0;border-bottom:1px solid #8a86a8;border-radius:0;
  height:auto;min-height:0;padding:.55rem 0 .7rem;box-shadow:none}
.elementor-form .elementor-field-group .elementor-field-textual:focus{
  border-bottom-color:var(--i500);box-shadow:0 1px 0 0 var(--i500)}
.elementor-form .elementor-field-group textarea.elementor-field-textual{
  min-height:104px}
.elementor-form .elementor-field-group select.elementor-field-textual{
  padding-right:1.6rem}

/* ── İLETİŞİM — harita sol kolonda, bilgilerin altında ────────────────────
   Harita ayrı bir bölümdeyken sayfayı bir ekran uzatıyordu; artık iletişim
   listesiyle aynı kolonda, onun devamı olarak duruyor. */
.ctx__sol{display:grid;gap:clamp(1.5rem,2.6vw,2.2rem);align-content:start}
.ctx__sol .elementor-widget-oa-map .wrap{width:100%;padding-inline:0}
.ctx__sol .mp{aspect-ratio:4/3;border-radius:var(--r);overflow:hidden}
@media(min-width:1040px){.ctx__sol .mp{aspect-ratio:16/10}}

/* ── SAYFALAMA (.pg) — paginate_links type:list <ul><li> basıyor ──────────
   Önceki kurallar düz <a> zinciri varsayıyordu; madde imleri ve dikey
   liste görünüyordu. İşaretlemenin gerçek hâline göre yazıldı. */
.pg{display:block;margin-top:clamp(2rem,3.4vw,2.8rem);
  border-top:1px solid var(--line);padding-top:1.4rem}
.pg ul,.pg .page-numbers{list-style:none;margin:0;padding:0}
.pg ul{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center}
.pg li{margin:0}
.pg a,.pg span.page-numbers{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:44px;min-height:44px;padding:0 .85rem;
  border:1px solid var(--line);border-radius:var(--pill);
  font-family:var(--bd);font-size:.9rem;font-weight:600;
  color:var(--body);text-decoration:none;
  transition:border-color .2s var(--ease),color .2s var(--ease),background-color .2s var(--ease)}
.pg a:hover{border-color:var(--i500);color:var(--i600);background:var(--i50)}
.pg a:focus-visible{outline:2px solid var(--i500);outline-offset:2px}
.pg .current{background:var(--i500);border-color:var(--i500);color:#fff}
.pg .dots{border-color:transparent;background:none;min-width:auto;padding:0 .3rem}
.pg .prev,.pg .next{font-weight:700}

/* ── İLETİŞİM HARİTASI — sol kolonu doldurur ──────────────────────────────
   Ayrı bölümdeyken tam genişlikteydi; kolona taşınınca widget'ın kendi
   .wrap'ı onu tekrar daraltıyordu. Kolon içinde ölçü kolonun kendisidir. */
.ctx__sol{display:grid;gap:clamp(1.6rem,2.8vw,2.4rem);align-content:start}
.ctx__sol>.elementor-element>.elementor-widget-container>.wrap,
.ctx__sol .wrap{width:100%;max-width:none;margin-inline:0;padding-inline:0}
.ctx__sol .ct__map{width:100%;aspect-ratio:4/3}
@media(min-width:1040px){.ctx__sol .ct__map{aspect-ratio:16/11}}

/* ── YAN SÜTUN — sidebar olduğu belli olsun ───────────────────────────────
   Önceden 290px'lik çıplak bir kolondu; metnin devamı gibi okunuyor,
   sayfayla ilişkisi kurulmuyordu. Artık kendi yüzeyi olan, sayfayla
   birlikte kaydıktan sonra sabitlenen bir panel. Yüzey dili aynı: düz
   dolgu, saç teli kenar, kart gölgesi yok. */
@media(min-width:1040px){
  .doc{grid-template-columns:minmax(0,1fr) var(--oa-side-w,22rem)}
  .side{background:var(--i50);border:1px solid var(--line);border-radius:var(--r);
    padding:clamp(1.3rem,1.9vw,1.7rem);gap:1.6rem;top:calc(var(--hdr-h,86px) + 1.5rem)}
  /* Panelin içindeki bloklar kendi üst çizgilerini taşımasın; ayrımı
     panelin kendi ayraçları yapıyor. */
  .side>*+*{border-top:1px solid var(--line);padding-top:1.5rem}
  .side .aside{border-top:0;padding-top:0}
}
.side .toc>h2,.side .aside>h3,.side .aside__b{
  font-family:var(--bd);font-size:.74rem;font-weight:800;letter-spacing:.12em;
  text-transform:uppercase;color:var(--i600);margin:0 0 .8rem}
.side .toc ol{border-top:0}
.side .toc li:last-child{border-bottom:0}
.side .btn{width:100%;justify-content:center}

/* ── ÖLÇÜ KORUMASI — iç içe sarmalayıcı ───────────────────────────────────
   Elementor'da bir kapsayıcıya "wrap" sınıfı verilip içindeki widget da
   kendi .wrap'ını basınca ölçü iki kez uygulanıyor ve blok 48px içeri
   kayıyordu (ölçüldü: form bölümü l=97, diğer bölümler l=49). Ölçüyü her
   zaman en dıştaki sarmalayıcı belirler. */
.wrap .wrap{width:100%;max-width:none;margin-inline:0;padding-inline:0}
.ctx__sol{padding-inline:0}

/* Açıklaması olmayan sayılı liste — üçüncü kolon kalkar, başlık genişler. */
.sv--dar .sv__i{grid-template-columns:4.5rem minmax(0,1fr) 3rem}

/* Sekme şeridi taştığında sağ kenarda soluklaşma — kaydırılabilir olduğu
   belli olsun. Yalnızca gerçekten taşıyorsa görünür (scroll-timeline yok;
   maske sabit ama şerit sığıyorsa kenar zaten boş kalır). */
@media(max-width:900px){
  .tg__bar{position:relative}
  .tg__bar::after{content:"";position:absolute;inset:0 0 0 auto;width:2.5rem;
    pointer-events:none;background:linear-gradient(90deg,rgba(255,255,255,0),#fff 70%)}
}

/* ── İÇ İÇE SEKME — hiyerarşi ─────────────────────────────────────────────
   Bir sekme panelinin içinde ikinci bir sekme bileşeni (.ku) olabiliyor.
   İkisi de numaralı, altı çizili yatay ray olunca hangisinin üst düzey
   olduğu okunmuyordu. İçteki ray ikincil bir denetime dönüşür: numara yok,
   punto küçük, seçili olan dolu hap. Şekil farkı düzey farkını anlatır. */
.tg__p .ku__tabs{
  border-bottom:0;gap:.35rem;margin-bottom:clamp(1.3rem,2.4vw,2rem)}
.tg__p .ku__tab{
  padding:.55rem .95rem;border-radius:var(--pill);
  background:transparent;color:var(--body);
  transition:background-color .2s var(--ease),color .2s var(--ease)}
.tg__p .ku__tab>span{display:none}
.tg__p .ku__tab b{font-family:var(--bd);font-size:.88rem;font-weight:600;letter-spacing:-.005em}
.tg__p .ku__tab::before,.tg__p .ku__tab::after{display:none!important}
.tg__p .ku__tab:hover{background:#fff;color:var(--i600)}
.tg__p .ku__tab[aria-selected="true"]{background:var(--i500)}
.tg__p .ku__tab[aria-selected="true"] b{color:#fff}
.tg__p .ku__tab:focus-visible{outline:2px solid var(--i500);outline-offset:2px}
/* Panel gövdesindeki "01 / 04" sayacı da artık gereksiz — hangi sekmede
   olduğunu dolu hap zaten söylüyor. */
.tg__p .ku__c{display:none}
@media(max-width:900px){
  .tg__p .ku__tabs{flex-direction:row;flex-wrap:wrap}
  .tg__p .ku__tab{flex:0 0 auto;max-width:none;border-bottom:0}
}

/* ── LOGO CAROUSEL (.lgw--c) ──────────────────────────────────────────────
   Referanslar kendi sayfasında tüm logoları ızgarada gösteriyor; ana sayfa
   ve Kurumsal'da aynı hücre dili yatay iki sıralı bir carousel'e dönüyor.
   Hücre görünümü değişmiyor — yalnızca akış yönü ve kaydırma.
   Dış çerçeveyi ve yuvarlatmayı carousel'de görüş alanı (.hzc__vp) veriyor;
   ray taşabilsin diye .lgw kendi çerçevesini bırakıyor. */
.lgc .hzc__vp{
  border:1px solid var(--line);border-radius:var(--r-s);background:#fff;
  scroll-snap-type:x proximity}
.lgw--c{
  grid-template-columns:none;grid-auto-flow:column;
  grid-template-rows:repeat(2,clamp(80px,7.6vw,104px));
  grid-auto-columns:clamp(148px,14vw,204px);
  grid-auto-rows:auto;
  border:0;border-radius:0;overflow:visible;margin-top:0;
  width:max-content;min-width:100%}
.lgw--c>.lg{scroll-snap-align:start}
/* Tek sıralı kalmasın diye tek sayıda logoda son hücre boş satır bırakır;
   sıra sayısı dar ekranda bire düşüyor. */
@media(max-width:700px){
  .lgw--c{grid-template-rows:repeat(2,clamp(74px,16vw,96px));
    grid-auto-columns:clamp(132px,38vw,168px)}
}
.lgc{margin-top:clamp(2rem,4vw,3rem)}

/* ── VİDEO — yan yana düzen (.vg) ─────────────────────────────────────────
   Tam genişlikte 16:9 oynatıcı bölümü ~1000px'e çıkarıyor ve tamamını
   görmek için iki ekran kaydırmak gerekiyordu. Yan yana düzende başlık
   solda, oynatıcı sağda; bölüm yarı yüksekliğe iniyor ve metin oynatıcıyla
   birlikte okunuyor. */
.vg{display:grid;gap:clamp(1.5rem,3vw,3rem);align-items:center}
@media(min-width:1000px){
  .vg{grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr)}
}
.vg>.head,.vg>.st{margin:0}
.vg .st__d{margin-top:.7rem}
.vg .vp{max-width:none;margin-inline:0}

/* ── VİDEO — kenardan kenara (.vp--kenar) ─────────────────────────────────
   Oynatıcı bölümü tümüyle kaplar: yatayda ekran genişliği, dikeyde en fazla
   %80 ekran (16:9 tam genişlikte 810px'e çıkıp iki ekrana taşıyordu).
   Negatif kenar boşluğu klasik full-bleed tekniği — kapsayıcının ölçüsünden
   bağımsız çalışır. Bölümün dikey dolgusu da kalkar ki bant komşularına
   değsin. */
.vp--kenar{
  width:100vw;margin-inline:calc(50% - 50vw);max-width:none;
  border-radius:0;max-height:80vh}
.vp--kenar img{width:100%;height:100%;object-fit:cover}
.sec:has(.vp--kenar){padding-block:0}
.vp--kenar .vp__not{padding-inline:var(--gut)}

/* ── ORTAM IZGARASI (.mw--izgara) ─────────────────────────────────────────
   Galeri sayfasında tüm kareler eşit: duvar düzenindeki 2×2'lik büyük kutu
   bir teaser hamlesi, kendi sayfasında ise ızgara okunaklı. Kareler daha
   büyük olsun diye masaüstünde üç sütun. */
.mw--izgara{grid-auto-rows:auto}
.mw--izgara>.mw__i{grid-column:auto!important;grid-row:auto!important;aspect-ratio:4/3}
@media(min-width:640px){.mw--izgara{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1040px){.mw--izgara{grid-template-columns:repeat(3,minmax(0,1fr))}}
/* Videonun oynat düğmesi ızgarada da ortada dursun. */
.mw--izgara .mw__play{width:52px;height:52px}
