
      /* ═══════════════════════════════════════════════════════════════════
         TABAN SIFIRLAMA · Tailwind preflight'ın YERİNE (01.09.2026 · G26-②)

         Tailwind CDN kaldırıldığında yalnız yardımcı sınıflar gitmedi —
         onunla birlikte gelen preflight de gitti ve tema onun SESSİZCE
         sağladığı şeylere güveniyormuş. Ölçüldü, iki şey kırılmıştı:

           1. FONT MİRASI. html ve body font-family'siz kalınca tarayıcı
              varsayılanına düştüler: sayfada 66 öğe TIMES ile görünüyordu —
              üst menünün tamamı, footer'ın tamamı, butonlar. Konsol sessiz,
              sayfa 200, taşma 0; yani hiçbir otomatik kontrol yakalamazdı.
           2. BOX-SIZING. body content-box'a döndü. Tema her yerde
              border-box varsayarak yazılmış; dolgu ve kenarlık genişliğe
              eklenmeye başlamıştı.

         Aşağıdaki blok Tailwind preflight'ın SİTENİN KULLANDIĞI kısmını
         devralır. Amaç Tailwind'i taklit etmek değil, kaldırılan bir
         bağımlılığın verdiği hizmeti üstlenmek — ders şu: bir bağımlılığı
         çıkarırken onun sessizce yaptığı işi de devralmak gerekiyor.

         Font yığını Tailwind'inki DEĞİL, temanın kendi --sans token'ı.
         ═══════════════════════════════════════════════════════════════════ */
      *,::before,::after{box-sizing:border-box;border-width:0;border-style:solid;border-color:currentColor}
      html{-webkit-text-size-adjust:100%;line-height:1.5;tab-size:4;
        font-family:'Figtree',system-ui,-apple-system,'Segoe UI',sans-serif}
      body{margin:0;line-height:inherit;
        font-family:'Figtree',system-ui,-apple-system,'Segoe UI',sans-serif}
      hr{height:0;color:inherit;border-top-width:1px}
      h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}
      a{color:inherit;text-decoration:inherit}
      b,strong{font-weight:bolder}
      /* Form öğeleri fontu MİRAS ALMAZ — açıkça verilmezse Times'a düşerler.
         Ölçüldü: <button> gerçekten Times ile çiziliyordu. */
      button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;
        font-weight:inherit;line-height:inherit;color:inherit;margin:0;padding:0}
      button,select{text-transform:none}
      button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button;
        background-color:transparent;background-image:none}
      blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}
      fieldset{margin:0;padding:0}
      legend{padding:0}
      ol,ul,menu{list-style:none;margin:0;padding:0}
      textarea{resize:vertical}
      img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}
      img,video{max-width:100%;height:auto}
      [hidden]{display:none}

      

      :root{
        /* zemin kademesi — açıktan koyuya doğru okunur */
        --bg:#f3f3f2;            /* sayfa zemini */
        --surface:#ffffff;       /* yüzey 1 — rail, hero kutusu */
        --panel:#ecedee;         /* yüzey 2 — iç kartlar */
        --panel-2:#e3e4e5;       /* yüzey 3 — hover dolgusu */
        /* metin */
        --fg:#191a1c; --muted:#666a70;
        /* çizgi — tek derinlik aracı */
        --line:rgba(0,0,0,.12);
        --line-strong:rgba(0,0,0,.22);   /* hover/aktif sınır (kalınlık DEĞİŞMEZ, renk değişir) */
        /* aksan (gümüş) — ÜÇ AYRI GÖREV, karıştırma:
           --gold        : dekor (hairline, ikon, çizgi vurgusu, BÜYÜK metin ≥32px)
           --aksan-metin : küçük metin için koyulaştırılmış sürüm (eyebrow, etiket) → 5.5:1
           --aksan-dolu  : dolu buton zemini + üstündeki metin rengi → 9.6:1
           Light'ta gri zemin üzerine siyah metin donuk duruyordu; dolu buton artık koyu zemin + beyaz metin. */
        --gold:#7c828c; --gold-soft:rgba(124,130,140,.12);
        --aksan-metin:#5f656e;
        /* YARDIMCI RENK — soğuk çelik mavisi. Gümüşle akraba (ikisi de soğuk nötr) → sırıtmaz.
           Yalnız gradyan akışlarında ve ince vurgularda kullanılır, düz zemin olarak DEĞİL. */
        

        --aksan-2:#a8825c;
        /* KÜÇÜK METİN AKSANI · --aksan-2 açık zeminde 3.15:1 veriyor; 8–11px
           metin için AA sınırı 4.5:1. Ölçüldü ve koyulaştırıldı: 5.52:1.
           Koyu temada --aksan-2 zaten 10:1, olduğu gibi kalıyor. */
        --aksan-kucuk:#7a5c3c;
        --aksan-dolu:#3f444c; --aksan-dolu-fg:#ffffff; --aksan-dolu-hover:#2c3037;
        

        

        --randevu:#79c8de; --randevu-fg:#14161a; --randevu-hover:#66bdd6;
        /* ═══ BOŞLUK ÖLÇEĞİ ═══ 4px tabanlı. Sitede BAŞKA boşluk değeri kullanılmaz.
           Bir gap/padding/margin yazarken mutlaka bu yedi değerden biri seçilir. */
        --bo-1:4px; --bo-2:8px; --bo-3:12px; --bo-4:16px;
        --bo-5:24px; --bo-6:32px; --bo-7:48px;
        /* tipografi & ölçü */
        /* TEK AİLE — ciddi sans. --serif adı geriye uyum için korundu, değeri artık sans. */
        

        --serif:'Figtree',system-ui,-apple-system,'Segoe UI',sans-serif;
        --sans:'Figtree',system-ui,-apple-system,'Segoe UI',sans-serif;
        --govde-w:450;
        --baslik-w:700;
        --maxw:1440px; --pad:24px; --pad-y:clamp(44px,5.5vw,84px); --radius:16px;

        /* METİN ÖLÇEĞİ · TEK KAYNAK (bölümler + footer birlikte kullanır).
           Ölçüldü 06.08.2026: sayfada 10 ayrı gövde puntosu ve 3 ayrı künye
           puntosu vardı; her bölüm kendi değerini yazdığı için 0.5–1px farklar
           birikmişti. Dört basamak yeterli — yeni punto icat edilmez.
             --yazi-xs kart künyesi · --yazi-s yasal not
             --yazi-m  gövde        · --yazi-l giriş paragrafı */
        --yazi-xs:10px; --yazi-s:11.5px; --yazi-m:13.5px; --yazi-l:16px;
        --kunye-px:8px; --kunye-ls:.1em;
        

        --altbaslik-px:var(--kunye-px);

        /* BÜYÜK BAŞLIK ÖLÇÜSÜ + METİN KENARI · önce .t52-home üzerindeydi,
           :root'a alındı — servis/blog gibi anasayfa dışı şablonlar da aynı
           ölçeği kullansın diye. Değerler birebir aynı. */
        --bas-xl:calc(clamp(34px,4.6vw,68px) * var(--olcek-baslik,1));
        --bas-w:800;
      }
      /* ---- CONTAINER STANDARDI (SEÇİLDİ: full-bleed · 02.08.2026) ----
         --edge = içeriğin ekran kenarına olan mesafesi. Rail, hero kutusu ve tüm bölümler bunu kullanır
         → logo, başlık, nav ve portre AYNI dikey çizgiden başlar. */
      :root{--maxw:100%; --pad:56px; --edge:56px}
      @media(max-width:1100px){ :root{--pad:32px; --edge:32px} }
      @media(max-width:767px){  :root{--pad:20px; --edge:20px} }
      /* <i> ETİKETİ · tarayıcı varsayılanı italik. Temada <i> ikon taşıyıcısı
         olarak kullanılıyor (emoji, çizgi, işaret); FontAwesome kendi
         sınıflarında normal'e çekiyor ama sınıfsız/özel olanlar italik
         kalıyordu. Tasarım kuralı italiği yasakladığı için tek kural: */
      i:not([class*="fa-"]){font-style:normal}

      /* metin kenarı: bölüm zemini kenara kadar gidebilir, YAZI buradan başlar */
      :root{--metin-kenar:calc(var(--edge) + var(--bo-5))}
      /* 22.10 · telefon/tablet: logo ile yazılar aynı çizgide — rail iç boşluğu --bo-4 (22-cam), metin kenarı kenar payı + --bo-4 */
      @media(max-width:900px){ :root{--metin-kenar:calc(var(--edge) + var(--bo-4))} }
      @media(min-width:901px){ :root{--altbaslik-px:15px} }
      /* 820 → 900 (18.09.2026) · dar-ekran kırılma noktası site genelinde TEK: 900. */
      @media(max-width:900px){ :root{--bas-xl:calc(clamp(27px,7vw,36px) * var(--olcek-baslik,1))} }
      html.dark{
        --aksan-kucuk:#d9b48a;
        --bg:#0c0d0f; --surface:#141518; --panel:#17191b; --panel-2:#20242a;
        --fg:#f1f2f4; --muted:#9a9ea6;
        --line:rgba(255,255,255,.12);
        --line-strong:rgba(255,255,255,.24);
        --gold:#c9cdd4; --gold-soft:rgba(201,205,212,.14);
        --aksan-metin:#c9cdd4;                                    /* dark'ta zaten 11.9:1 — koyulaştırmaya gerek yok */
        --aksan-2:#d9b48a;
        --aksan-dolu:#c9cdd4; --aksan-dolu-fg:#14161a; --aksan-dolu-hover:#e2e5e9;
        --randevu:#79c8de; --randevu-fg:#14161a; --randevu-hover:#92d3e5;
      }
      /* ── TAILWIND'İN YERİNE GEÇEN ALTI SATIR ──────────────────────────
         Kaldırılan sınıfların birebir karşılığı. Renkler artık Tailwind'in
         hazır paletinden (white / slate-900 / gray-900) değil, temanın kendi
         token'larından geliyor — yani tema değişince bunlar da doğru dönüyor.
         Eskiden bg'yi !important ile ezmek gerekiyordu çünkü Tailwind gövdeye
         beyaz basıyordu; artık ezilecek bir şey yok. */
      body.t52-govde{background:var(--bg);color:var(--fg);
        transition:background-color .3s ease,color .3s ease}
      main.t52-ana{min-height:100svh}

      

      :root{--wa:#1fa855; --wa-hover:#178a45; --wa-fg:#ffffff}
      a[href*="wa.me"]:has(> .fa-whatsapp):not(.t52-footer a):not(.satir-lnk),
      .t52-wa{
        background-color:var(--wa) !important;border-color:transparent !important;
        color:var(--wa-fg) !important}
      a[href*="wa.me"]:has(> .fa-whatsapp):not(.t52-footer a):not(.satir-lnk):hover,
      .t52-wa:hover{background-color:var(--wa-hover) !important}
      a[href*="wa.me"]:has(> .fa-whatsapp):not(.t52-footer a):not(.satir-lnk) i,
      .t52-wa i, html.dark .t52-wa i, .t52-wa .ad,
      html:not(.dark) .t52-nav .wa-ust{color:var(--wa-fg) !important}
      

      .t52-wa{overflow:hidden;isolation:isolate}
      .t52-wa > i, .t52-wa > .ad{position:relative;z-index:2}
      .t52-wa::before{content:"";position:absolute;left:-100%;right:-100%;top:0;height:34%;
        pointer-events:none;z-index:1;opacity:0;
        background:linear-gradient(180deg,transparent,rgba(255,255,255,.55),transparent);
        transform:translateY(-300%) rotate(-22deg)}
      .t52-wa:hover::before{opacity:1;animation:t52-supurme-dikey .85s ease-out 1}
      @keyframes t52-supurme-dikey{
        from{transform:translateY(-300%) rotate(-22deg)}
        to  {transform:translateY(620%)  rotate(-22deg)}
      }
      @media(max-width:900px){
        .t52-wa::before{top:-100%;bottom:-100%;left:0;right:auto;width:34%;height:auto;
          background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);
          transform:translateX(-300%) rotate(22deg)}
        .t52-wa:hover::before{animation-name:t52-supurme}
      }
      @media(prefers-reduced-motion:reduce){ .t52-wa::before{display:none} }
    