/* ======================================================================
   ADA DEMİRHAN MÜHENDİSLİK
   🔴 BU DOSYA BİR KEZ YENİDEN YAZILDI. İlk sürümde siteyi kendi
   kurgumla kurmuştum (tipografi kahramanı + alt alta kartlar). Kullanıcı
   düzeltti (2026-10-09): *"Adademirhan'ı birebir'e yakın uygula"* —
   ilk talimat da zaten "tasarımı koruyabilirsin de" diyordu.
   Artık ESKİ SİTENİN KURGUSU ÖLÇÜLÜP izleniyor:
     · mermer gri doku, tüm sayfayı kaplıyor (_img/bg.jpg -> zemin.webp)
     · üç marka YAN YANA, her biri dairesel beyaz rozet (279x283)
     · rozetin altında 01/02/03 numarası, ad, paragraf
     · altında 49x49 yuvarlak "+" işareti
     · en altta ikonlu iletişim şeridi + e-bülten
     · sağ üstte MENÜ (soldan açılan panel) ve TR/EN
   Yazı tipi Poppins — eski sitenin kendi yazı tipi, YERELE alındı
   (dış istek bırakmamak için).
   ====================================================================== */

@font-face{font-family:Poppins;font-style:normal;font-weight:400;font-display:swap;
  src:url(/assets/font/poppins-400-latin-ext.woff2) format('woff2');
  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:Poppins;font-style:normal;font-weight:400;font-display:swap;
  src:url(/assets/font/poppins-400-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Poppins;font-style:normal;font-weight:600;font-display:swap;
  src:url(/assets/font/poppins-600-latin-ext.woff2) format('woff2');
  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:Poppins;font-style:normal;font-weight:600;font-display:swap;
  src:url(/assets/font/poppins-600-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Poppins;font-style:normal;font-weight:700;font-display:swap;
  src:url(/assets/font/poppins-700-latin-ext.woff2) format('woff2');
  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:Poppins;font-style:normal;font-weight:700;font-display:swap;
  src:url(/assets/font/poppins-700-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* 🔴 İKİ YAZI TİPİ VAR, BİRİ DEĞİL. Ölçüldü 2026-10-09 (kullanıcı:
   "fontlar aynı değil"): numaralar ve marka başlıkları RAJDHANI 600,
   gövde metni POPPINS. Ben ikisini de Poppins yapmıştım; Rajdhani daha
   dar ve köşeli, aradaki fark ekranda hemen görünüyor. */
@font-face{font-family:Rajdhani;font-style:normal;font-weight:600;font-display:swap;
  src:url(/assets/font/rajdhani-600-latin-ext.woff2) format('woff2');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-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:Rajdhani;font-style:normal;font-weight:600;font-display:swap;
  src:url(/assets/font/rajdhani-600-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  --kirmizi:#d01020;
  --baslik:#231f20;      /* ölçüldü: marka başlığı rengi */
  --metin:#757575;       /* ölçüldü: paragraf ve numara rengi */
  --mavi:#28599f;        /* ölçüldü: e-bülten ok düğmesi zemini */
  --mavi-ok:#7ea6df;     /* ölçüldü: ok simgesi rengi */
  --kutu-bg:#dde6ee;     /* ölçüldü: e-bülten girdi kutusu */      /* logodan örneklendi */
  --murekkep:#2b2b2b;
  --gri:#6f6f6f;
  --gri-ac:#9a9a9a;
  --cizgi:#dcdee1;
  --olcu:1200px;
  --golge-rozet:0 10px 34px rgba(40,46,55,.16);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;color:var(--murekkep);
  font:400 15px/1.7 Poppins,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  /* 🔴 ZEMİN ESKİ SİTENİN KENDİ DOKUSU (bg.jpg -> webp, 112 KB -> 24 KB).
     `fixed` yerine normal akış: iOS'ta `background-attachment:fixed`
     zıplıyor ve dokuyu devasa ölçekliyor. */
  background:#eceef0 url(/assets/img/zemin.webp) top center / cover no-repeat;
  min-height:100vh;display:flex;flex-direction:column;
}
img{max-width:100%}
h1,h2{margin:0;line-height:1.2;letter-spacing:-.01em}
p{margin:0 0 1em}
a{color:var(--kirmizi)}

.kapsa{width:min(100% - 32px, var(--olcu));margin-inline:auto}

.atla{position:absolute;left:-9999px}
.atla:focus{left:16px;top:10px;z-index:99;background:#fff;padding:10px 14px;border-radius:8px}
.gizli-etiket{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.bal{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}

/* ------------------------------------------------------------------ başlık */
.ust{padding:26px 0 0}
.ust-ic{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.marka{display:inline-flex;align-items:center;min-height:44px}
/* Logo eski sitede 262x177; oran korunuyor, ölçü akışkan. */
.marka img{width:clamp(150px,16vw,220px);height:auto;display:block}

.ust-sag{display:flex;align-items:center;gap:14px;padding-top:10px}
.menu-dugme{display:inline-flex;align-items:center;gap:9px;min-height:44px;
            padding:8px 4px;background:none;border:0;cursor:pointer;
            font:600 12.5px/1 Poppins,sans-serif;letter-spacing:.14em;
            text-transform:uppercase;color:var(--murekkep)}
.menu-dugme .cizgi{display:grid;gap:3.5px;width:22px}
.menu-dugme .cizgi i{display:block;height:2px;background:var(--murekkep);border-radius:2px}
.menu-dugme .cizgi i:nth-child(2){width:70%;margin-left:auto}

.sosyal{display:inline-flex;align-items:center;gap:12px}
.sosyal a{display:inline-flex;color:var(--yazi,#666);transition:color .15s}
.sosyal a:hover{color:var(--kirmizi)}
.sosyal svg{width:20px;height:20px;flex:none}
.dil{display:inline-flex;align-items:center;padding-left:14px;border-left:1px solid var(--cizgi)}
.dil a{display:inline-flex;align-items:center;justify-content:center;
       min-width:44px;min-height:44px;font-size:12.5px;font-weight:600;
       letter-spacing:.1em;color:var(--gri-ac);text-decoration:none}
.dil a[aria-current="true"]{color:var(--kirmizi)}

/* --------------------------------------------------------- yan menü (MENÜ) */
/* 🔴 PANEL VARSAYILAN OLARAK KAPALI AMA İÇERİĞİ GİZLEMİYOR: sayfanın
   bütün bilgisi ana akışta duruyor, panel yalnız kısayol. Betik hiç
   çalışmazsa MENÜ düğmesi işe yaramaz, sayfa yine eksiksiz okunur. */
.yan{position:fixed;inset:0 auto 0 0;width:min(320px,86vw);z-index:90;
     background:#1f2124;padding:68px 10px 20px;
     transform:translateX(-100%);transition:transform .32s ease;
     box-shadow:0 0 40px rgba(0,0,0,.35);overflow:auto}
.yan.acik{transform:none}
.yan a{display:flex;align-items:center;min-height:48px;padding:8px 22px;
       color:#d7d9dd;text-decoration:none;font-weight:600;font-size:15px;
       border-bottom:1px solid rgba(255,255,255,.08)}
.yan a:hover{color:#fff;background:rgba(255,255,255,.06)}
.yan-kapat{position:absolute;top:12px;right:12px;width:44px;height:44px;
           background:none;border:0;color:#d7d9dd;font-size:26px;line-height:1;cursor:pointer}
.yan-perde{position:fixed;inset:0;z-index:89;background:rgba(0,0,0,.5);
           opacity:0;visibility:hidden;transition:opacity .32s ease,visibility .32s}
.yan-perde.acik{opacity:1;visibility:visible}

/* -------------------------------------------------------------- markalar */
main{flex:1}
.markalar{padding:clamp(26px,4vw,52px) 0 clamp(20px,3vw,36px)}
/* 🔴 ÜÇ SÜTUN YAN YANA — eski sitenin kurgusu bu. Ölçüldü: 1280'de
   rozetler x=56/493/930, yani eşit üç sütun. */
.marka-izgara{display:grid;gap:clamp(20px,3vw,46px);grid-template-columns:repeat(3,1fr)}
/* 🔴 ROZET ORTADA, METİN SOLA YASLI. Ölçüldü (eski sayfanın ekranı,
   2026-10-09): 01 / ad / paragraf aynı sol kenardan başlıyor (x=362),
   rozet ve "+" ise sütunun ORTASINDA. İlk yazımda hepsini ortaladım;
   ortalanmış paragraf hem eski siteye benzemiyor hem okumayı zorlaştırıyor. */
.marka-sutun{display:flex;flex-direction:column;align-items:stretch;text-align:left}

/* Rozet: eski sitede 279x283 beyaz disk. Görselin kendisi zaten dairesel
   ve gölgeli; biz yalnız ölçüyü ve yumuşak gölgeyi veriyoruz. */
.rozet{display:block;width:clamp(170px,22vw,279px);margin-inline:auto}
.rozet img{width:100%;height:auto;display:block;filter:drop-shadow(0 10px 26px rgba(40,46,55,.18))}

/* Numaranın altında kısa çizgi — eski sayfada da öyle. */
/* Ölçülen: Rajdhani 18px/600, #757575, satır 25.2px. */
.no{display:inline-block;margin:clamp(18px,2.4vw,30px) 0 10px;padding:0 10px 4px 0;
    font:600 18px/1.4 Rajdhani,Poppins,sans-serif;color:var(--metin);
    border-bottom:1px solid #b9bbbe}
/* Ölçülen: Rajdhani 23px/600, #231f20, satır 32.2px. */
.marka-sutun h2{font:600 23px/1.4 Rajdhani,Poppins,sans-serif;color:var(--baslik);
                margin-bottom:.4em;letter-spacing:0}
/* Ölçülen: Poppins 14px, #757575, satır 19.6px. */
.marka-metin{margin:0;color:var(--metin);font:400 14px/1.4 Poppins,sans-serif;max-width:40ch}
/* Paragrafın başındaki marka adı kalın — eski sayfadaki gibi. */
/* Ölçülen: baştaki marka adı Poppins 700 ama RENGİ AYNI (#757575). */
.marka-metin b{font-weight:700;color:var(--metin)}

/* "+" işareti — eski sitede 49x49 yuvarlak. */
/* 🔴 ÜÇ ARTI TEK HİZADA. Eski sitede y=802/804/806, yani hizalı; bende
   paragraf uzunluğuna göre 50 px'e varan fark vardı, kullanıcı kırmızı
   kutuyla gösterdi (2026-10-09). margin-top:auto sütunun DİBİNE iter;
   ızgara zaten sütunları eşit yüksekliğe çekiyor. */
.arti{display:inline-flex;align-items:center;justify-content:center;
      width:49px;height:49px;margin:0 auto;margin-top:auto;
      padding-top:clamp(16px,2vw,26px);box-sizing:content-box}
.arti img{width:100%;height:auto;display:block}
a.arti{border-radius:50%}
a.arti:hover img{transform:scale(1.06);transition:transform .25s ease}
/* 🔴 HEDEFİ OLMAYAN "+" BAĞLANTI DEĞİL. Eski sitede Soft Agry ve Soft Ays'ın
   "+" düğmeleri `javascript:void(0)` idi, yani ÖLÜ. Görsel simetriyi
   bozmamak için işaret duruyor ama tıklanabilir yapılmadı — ölü düğme
   ziyaretçiyi kandırır. Firma sayfa açarsa `markalar()`a `bag` eklemek yeter. */
span.arti{opacity:.5}

/* -------------------------------------------------------------- alt şerit */
.alt{background:#fbfbfc;margin-top:auto;
     padding:clamp(22px,3vw,34px) 0 14px}
.alt-izgara{display:grid;gap:clamp(18px,2.6vw,34px);
            grid-template-columns:repeat(3,minmax(0,1fr)) minmax(240px,1.1fr)}
.alt-kutu{display:flex;flex-direction:column;gap:8px}
.alt-ikon{height:34px;width:auto;object-fit:contain;align-self:flex-start}
.alt-kutu p{margin:0;color:var(--metin);font:400 14px/1.75 Poppins,sans-serif}
/* 🔴 SEÇİCİ ÇOK GENİŞTİ, DÜĞMELERİ DE YAKALIYORDU. Özgüllüğü (0,1,1)
   benim wa-dugme / harita-dugme kurallarımı (0,1,0) yeniyordu: WhatsApp
   düğmesinin yazısı yeşil üstünde gri çıkıyor, HARİTADA GÖR üzerine
   gelince koyu zeminde KIRMIZI yazıyordu (kullanıcı 2026-10-09:
   "üzerine gelince buton rengi kötü"). Bugün aynı tuzağa ÜÇÜNCÜ düşüş.
   Çözüm yine aynı: seçiciyi daralt, üstüne geri alma kuralı yazma. */
.alt-kutu .bag{color:var(--metin);text-decoration:none}
.alt-kutu .bag:hover{color:var(--kirmizi)}
/* 🔴 DOKUNMA HEDEFİ: şeritte telefon ve e-posta var, sitenin iki kritik eylemi. */
/* 🔴 44 px KURALI TELEFONDA. Masaüstünde de 44 verince iki telefon
   numarasının arası açılıp şerit dağılıyordu; eski sitede satırlar sık. */
@media (max-width:860px){ .alt-kutu .bag{display:inline-flex;align-items:center;min-height:44px} }
/* Eski sitede çerçeveli "HARİTADA GÖR" düğmesi. */
/* Eski sitede ince AÇIK çerçeveli düğme; koyu dolgu yoktu. */
.harita-dugme{display:inline-flex;align-items:center;justify-content:center;
              align-self:flex-start;min-height:48px;margin-top:12px;padding:12px 30px;
              border:1px solid #b9bbbe;color:var(--baslik);text-decoration:none;
              font:600 13px Rajdhani,Poppins,sans-serif;letter-spacing:.14em;
              text-transform:uppercase;transition:border-color .2s ease,background .2s ease}
.harita-dugme:hover{border-color:var(--baslik);background:rgba(35,31,32,.05);color:var(--baslik)}

/* e-bülten */
/* Ölçülen: Poppins 700, siyah. */
.bulten b{display:block;font:700 15px/1.4 Poppins,sans-serif;color:#000;text-transform:uppercase}
.bulten p{margin:.25em 0 .8em;color:var(--metin);font:400 13.6px/1.4 Poppins,sans-serif}
.bulten-alan{display:flex;gap:8px;flex-wrap:wrap}
.bulten-alan input[type="email"]{flex:1 1 150px;min-height:44px;padding:10px 14px;
      border:0;font:inherit;font-size:13.6px;color:var(--baslik);background:var(--kutu-bg)}
.bulten-alan input[type="email"]:focus{outline:2px solid var(--kirmizi);outline-offset:-2px}
/* Ok düğmesi — eski sitedeki gibi kutunun sağına bitişik. */
/* Ölçülen: 58x39, zemin #28599f, ok #7ea6df. Yükseklik 44'e çıkarıldı
   (dokunma hedefi eşiği); genişlik eski sitedeki gibi 58. */
.bulten-ok{flex:none;width:58px;min-height:44px;border:0;cursor:pointer;
           background:var(--mavi);color:var(--mavi-ok);font-size:13px;line-height:1}
.bulten-ok:hover{background:#1f4883;color:#fff}
.bulten-alan{gap:0}
.dugme{display:inline-flex;align-items:center;justify-content:center;gap:8px;
       min-height:44px;padding:10px 20px;border-radius:999px;text-decoration:none;
       font:600 14px Poppins,sans-serif;border:0;cursor:pointer}
.dugme-ana{background:var(--kirmizi);color:#fff}
.dugme-ana:hover{background:#a01020}
.dugme-wa{background:#0f7a3d;color:#fff}
.bulten-sonuc{margin:.6em 0 0;font-weight:600;font-size:13.6px}
.bulten-sonuc.ok{color:#0f7a3d}
.bulten-sonuc.hata{color:var(--kirmizi)}

.alt-son{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:18px;
         padding-top:12px;border-top:1px solid var(--cizgi);color:var(--gri-ac);
         font:400 12.2px Poppins,sans-serif}
.alt-son img{height:9px;width:auto;opacity:.75}

/* ======================================================================
   🔴 SVG'YE ÖLÇÜ VERİLMEZSE KABI DOLDURUR. `wa_ikonu()` yalnız `viewBox`
   taşıyan bir SVG döndürüyor; `width`/`height` yoksa tarayıcı onu esnek
   sayıyor ve flex kabında DEVASA büyüyor. Ölçüldü 2026-10-09: alt şeritteki
   WhatsApp düğmesi 260 px'e çıkıp sütunu ezmişti, kullanıcı ekranda gösterdi.
   Kural: ikon SVG'si basan her yerde ölçü CSS'te verilir.
   ====================================================================== */
.wa-dugme svg,.yuzen a svg,.y-wa svg,.dugme svg{width:20px;height:20px;flex:none;fill:currentColor}
.yuzen a svg{width:26px;height:26px}

/* Alt şeritteki WhatsApp düğmesi — şeridin ölçüsünü bozmayacak kadar sade. */
.wa-dugme{display:inline-flex;align-items:center;justify-content:center;gap:8px;
          align-self:flex-start;min-height:44px;margin-top:4px;padding:10px 18px;
          border-radius:999px;background:#0f7a3d;color:#fff;text-decoration:none;
          font:600 13.4px Poppins,sans-serif}
.wa-dugme:hover{background:#0b6231}

/* ------------------------------------------------------------------ yüzen */
.yuzen{display:none;position:fixed;right:14px;bottom:14px;z-index:70;gap:10px}
.yuzen a{display:inline-flex;align-items:center;justify-content:center;
         width:52px;height:52px;border-radius:999px;text-decoration:none;
         color:#fff;font-size:21px;box-shadow:0 8px 22px rgba(0,0,0,.28)}
.yuzen-tel{background:var(--kirmizi)}
.yuzen-wa{background:#0f7a3d}
.y-wa{display:inline-flex;align-items:center;justify-content:center;
      width:44px;height:44px;border-radius:999px;background:#0f7a3d;color:#fff;text-decoration:none}

/* ======================================================================
   🔴 WHATSAPP İKİ MOD — ÇİFT SINIF ŞART.
   ortak/whatsapp.php İKİ bağlantı birden basıyor; hangisinin görüneceğine
   CSS karar verir. Bu blok unutulursa ikon İKİ KEZ çıkar.
   🔴 Sınıf İKİ KEZ yazılıyor (özgüllük 0,2,0): düz hâli .yuzen a gibi
   kurallara yeniliyor ve gizleme çalışmıyor. Bu kitte DÖRT kez yaşandı.
   ====================================================================== */
.wa-masaustu.wa-masaustu{display:none}
@media (min-width:601px){
  .wa-mobil.wa-mobil{display:none}
  .wa-masaustu.wa-masaustu{display:inline-flex}
}

/* ------------------------------------------------------------------ belirme */
/* 🔴 GÖRÜNÜRLÜK BETİĞE BAĞLANMAZ — belirme tamamen CSS. */
@supports (animation-timeline: view()){
  @media (prefers-reduced-motion: no-preference){
    .bel{animation:bel-gir linear both;animation-timeline:view();animation-range:entry 0% entry 42%}
  }
}
@keyframes bel-gir{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}

/* ------------------------------------------------------------------ duyarlı */
@media (max-width:1000px){
  .alt-izgara{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:820px){
  /* 🔴 ÜÇ SÜTUN TELEFONDA ALT ALTA. Eski site duyarlıydı ama rozetler
     ezilerek küçülüyordu; burada tam ölçüde alt alta iniyorlar. */
  .marka-izgara{grid-template-columns:1fr;gap:38px}
  .marka-metin{max-width:46ch}
  .yuzen{display:flex}
}
@media (max-width:560px){
  .alt-izgara{grid-template-columns:1fr}
  .ust{padding-top:16px}
  .ust-sag{padding-top:4px}
  /* 🔴 YAZI GİZLENİNCE DÜĞME 44 PX ALTINA DÜŞÜYOR (ölçüldü: 30x44).
     Yalnız etiketi kaldırmak dokunma hedefini de kaldırıyor. */
  .menu-dugme span.yazi{display:none}
  .menu-dugme{min-width:44px;justify-content:center}
}
