/* ismaildoner.com — temel katman: tokenlar, tipografi, kabuk, yardımcılar
 *
 * YÖN (21 Ağu, yönetici referansları cigdeci.com + hidayetarasan.com):
 * gövde AÇIK ve sakin — güveni veren şey bu. Teknoloji hissi yalnız
 * KAHRAMANDA, koyu ve canlı bir katman olarak yaşar. Site baştan sona
 * koyu olduğunda "kişi" değil "şablon" okunuyordu; ölçülen şikâyet buydu.
 *
 * Renkler: lacivert (kurumsal güven) + amber (kendi tabelalarındaki altın,
 * aynı zamanda cigdeci.com'un vurgusu). Tek vurgu, gradyan yok.
 */

:root{
  /* zemin — kâğıt */
  --zemin:#FFFFFF;
  --zemin-2:#F6F7F9;
  --zemin-3:#EDEFF3;

  /* gece — yalnız kahraman ve alt bilgi */
  --gece:#0C1626;
  --gece-2:#132339;
  --gece-3:#1D3049;

  /* çizgiler */
  --cizgi:#E4E7EC;
  --cizgi-2:#D0D5DD;
  --cizgi-gece:rgba(255,255,255,.12);

  /* metin */
  --baslik:#0F1E33;
  --metin:#3B4757;
  --metin-2:#667085;
  --metin-3:#636C7B;   /* beyaz 5,3 · gri bölümde 4,95 — AA. Önceki #98A2B3 2,58,
                          ara adım #6E7787 gri zeminde 4,21 ile hâlâ kalıyordu. */
  --metin-gece:#E8EDF5;
  --metin-gece-2:#94A6BE;

  /* vurgu */
  --vurgu:#E39A0F;          /* dolgular, çizgiler, ikonlar */
  --vurgu-parlak:#F5B32C;   /* koyu zeminde */
  --vurgu-metin:#8A5B03;    /* AÇIK zeminde YAZI için — AA geçer */
  --vurgu-soft:#FDF3E2;
  --vurgu-cizgi:rgba(227,154,15,.35);

  /* durum */
  --canli:#0E6B4D;      /* kendi yumuşak zemini üstünde 5,75 (12805C 4,35 idi) */
  --canli-soft:#E3F5EE;
  --kurulan:#8F4B06;    /* kendi yumuşak zemini üstünde 5,90 (B25E09 4,17 idi) */
  --kurulan-soft:#FDF0E3;

  /* tipografi */
  --f-baslik:"Jost",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --f-ana:"Geist",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --f-mono:"Geist Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;

  /* ölçü */
  --kolon:1180px;
  --gutter:clamp(20px,4vw,40px);
  --bolum:clamp(64px,8vw,112px);
  --r:12px;
  --r-s:8px;
  --r-pill:100px;

  --golge:0 1px 2px rgba(16,24,40,.05);
  --golge-2:0 8px 24px -12px rgba(16,24,40,.18);
  --gecis:200ms cubic-bezier(.2,.6,.3,1);
}

/* Koyu tema İSTEĞE BAĞLI — varsayılan değil. */
:root[data-tema="koyu"]{
  --zemin:#0C1626;
  --zemin-2:#101E31;
  --zemin-3:#16283F;
  --cizgi:rgba(255,255,255,.10);
  --cizgi-2:rgba(255,255,255,.18);
  --baslik:#F1F5FA;
  --metin:#C3CEDC;
  --metin-2:#94A6BE;
  --metin-3:#6C7F98;
  --vurgu-metin:#F5B32C;
  --vurgu-soft:rgba(227,154,15,.14);
  --canli:#3FD09B;
  --canli-soft:rgba(63,208,155,.13);
  --kurulan:#F5B32C;
  --kurulan-soft:rgba(245,179,44,.13);
  --golge:none;
  --golge-2:0 8px 30px -14px rgba(0,0,0,.7);
}

/* Fontlar temaya GÖMÜLÜ — @font-face mutlak adresle ve satır içi verilir.
   TUZAK (ölçüldü): LiteSpeed Google Fonts <link>'ini HTML'den siler; CSS
   birleştirme de göreli url()'i kırar. Bkz. functions.php → idm_font_kurallari. */

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

body.idm{
  margin:0;
  background:var(--zemin);
  color:var(--metin);
  font-family:var(--f-ana);
  font-size:16.5px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

.idm img,.idm svg,.idm canvas{max-width:100%;display:block}
.idm img{height:auto}
/* TUZAK: bu sıfırlama `.idm a` (0,1,1) yazılırsa `.dugme--ana` gibi SINIF
   kurallarını (0,1,0) ezer ve buton yazısı kaybolur — aynı gün iki temada
   yaşandı. `:where()` özgüllüğü sıfırlar. */
:where(.idm a){color:inherit;text-decoration:none}
.idm h1,.idm h2,.idm h3,.idm h4{
  margin:0;font-family:var(--f-baslik);color:var(--baslik);
  font-weight:600;line-height:1.14;letter-spacing:-.015em;text-wrap:balance;
}
.idm p{margin:0}
.idm ul,.idm ol{margin:0;padding:0;list-style:none}

.sar{width:100%;max-width:var(--kolon);margin-inline:auto;padding-inline:var(--gutter)}
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
:focus-visible{outline:2px solid var(--vurgu);outline-offset:3px;border-radius:3px}

.atla{position:absolute;left:-9999px;top:0;z-index:200;background:var(--vurgu);color:#241701;padding:10px 16px;font-weight:600;border-radius:0 0 var(--r-s) 0}
.atla:focus{left:0}

/* --- ortak parçalar --------------------------------------------------- */
.kunye{
  font-family:var(--f-mono);font-size:.6875rem;font-weight:500;
  letter-spacing:.12em;text-transform:uppercase;color:var(--metin-3);
}

/* Bölüm başlığı ORTALI ve altında vurgu çizgisi — iki referansın da
   ortak dilbilgisi; Türk kişisel/kurumsal sitelerinde "bölüm burada
   başlıyor" işareti bu. */
.bolum-bas{text-align:center;max-width:64ch;margin:0 auto clamp(36px,5vw,58px)}
.bolum-bas .ustlk{
  font-family:var(--f-mono);font-size:.6875rem;font-weight:500;letter-spacing:.16em;
  text-transform:uppercase;color:var(--vurgu-metin);display:block;margin-bottom:12px;
}
.bolum-bas h2{font-size:clamp(1.625rem,3.6vw,2.5rem)}
/* TUZAK: <span> satır içidir — width/height/margin:auto UYGULANMAZ ve çizgi
   hiç çizilmez. Bugün panel kutusunda da aynı hata yapıldı (etiket ve rakam
   yan yana düşmüştü). Ölçü verilen her span'a display gerekir. */
.bolum-bas .cizgi{
  display:block;width:64px;height:3px;background:var(--vurgu);border-radius:2px;
  margin:18px auto 0;
}
.bolum-bas .bolum-ozet{margin-top:18px;color:var(--metin-2);font-size:1.0625rem}

/* durum rozeti — yalnız GERÇEK durum */
.durum{
  display:inline-flex;align-items:center;gap:7px;
  font-family:var(--f-mono);font-size:.625rem;font-weight:600;
  letter-spacing:.1em;text-transform:uppercase;
  padding:5px 11px;border-radius:var(--r-pill);
}
.durum i{width:6px;height:6px;border-radius:50%;flex:none}
.durum--aktif{color:var(--canli);background:var(--canli-soft)}
.durum--aktif i{background:var(--canli)}
.durum--kuruluyor{color:var(--kurulan);background:var(--kurulan-soft)}
.durum--kuruluyor i{background:var(--kurulan)}

/* düğmeler — hap biçimi, referansların ikisinde de bu */
.dugme{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  font-family:var(--f-baslik);font-size:.9375rem;font-weight:500;letter-spacing:.01em;
  padding:13px 26px;border-radius:var(--r-pill);border:1.5px solid transparent;
  cursor:pointer;transition:background var(--gecis),border-color var(--gecis),color var(--gecis),transform var(--gecis),box-shadow var(--gecis);
}
.dugme svg{width:15px;height:15px;flex:none}
.dugme--ana{background:var(--vurgu);color:#231600;font-weight:600;box-shadow:0 4px 14px -6px rgba(227,154,15,.7)}
.dugme--ana:hover{background:var(--vurgu-parlak);transform:translateY(-2px);box-shadow:0 8px 20px -8px rgba(227,154,15,.75)}
.dugme--kenar{border-color:var(--cizgi-2);color:var(--baslik);background:transparent}
.dugme--kenar:hover{border-color:var(--vurgu);color:var(--vurgu-metin);transform:translateY(-2px)}
.dugme--gece{border-color:rgba(255,255,255,.32);color:#fff;background:transparent}
.dugme--gece:hover{border-color:#fff;background:rgba(255,255,255,.10);transform:translateY(-2px)}
@media (prefers-reduced-motion:reduce){.dugme:hover{transform:none}}

/* kart */
.kart{
  background:var(--zemin);border:1px solid var(--cizgi);border-radius:var(--r);
  box-shadow:var(--golge);
  transition:border-color var(--gecis),box-shadow var(--gecis),transform var(--gecis);
  position:relative;
}
.kart:hover{border-color:var(--vurgu-cizgi);box-shadow:var(--golge-2);transform:translateY(-3px)}
@media (prefers-reduced-motion:reduce){.kart:hover{transform:none}}

/* --- üst şerit: iletişim görünür (güven işareti, cigdeci dilbilgisi) --- */
.serit{background:var(--gece);color:var(--metin-gece-2);font-size:.8125rem}
.serit .sar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-block:9px;flex-wrap:wrap}
.serit-sol{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.serit a{display:inline-flex;align-items:center;gap:7px;transition:color var(--gecis)}
.serit a:hover{color:var(--vurgu-parlak)}
.serit svg{width:14px;height:14px;color:var(--vurgu-parlak);flex:none}
.serit-sag{display:flex;align-items:center;gap:14px}
@media (max-width:700px){.serit-sag{display:none}.serit .sar{justify-content:center}}

/* --- üst bar --- */
.ust{
  position:sticky;top:0;z-index:100;background:var(--zemin);
  border-bottom:1px solid var(--cizgi);
  transition:box-shadow var(--gecis),padding var(--gecis);
  padding-block:14px;
}
/* TUZAK: kaydırınca dolguyu değiştirmek üst barın YÜKSEKLİĞİNİ değiştirir ve
   altındaki her şeyi kaydırır — ölçüldü, masaüstünde CLS 0,136. Sabitlenince
   yalnız gölge değişir; yükseklik sabit kalır. */
.ust.sabit{box-shadow:0 4px 18px -10px rgba(16,24,40,.25)}
.ust .sar{display:flex;align-items:center;justify-content:space-between;gap:20px}

.marka{display:flex;align-items:center;gap:11px;flex:none}
.marka-im{
  width:34px;height:34px;flex:none;border-radius:9px;display:grid;place-items:center;line-height:1;
  background:var(--gece);color:var(--vurgu-parlak);
  font-family:var(--f-baslik);font-size:.8125rem;font-weight:600;letter-spacing:.02em;
}
.marka-ad{font-family:var(--f-baslik);font-size:1.0625rem;font-weight:600;letter-spacing:-.01em;color:var(--baslik);white-space:nowrap}
.marka-alt{display:block;font-family:var(--f-mono);font-size:.5625rem;letter-spacing:.14em;text-transform:uppercase;color:var(--metin-3);margin-top:2px}

.menu{display:flex;align-items:center;gap:2px}
.menu a{
  font-family:var(--f-baslik);font-size:.9375rem;font-weight:500;color:var(--metin);
  padding:9px 14px;border-radius:var(--r-s);position:relative;
  transition:color var(--gecis),background var(--gecis);white-space:nowrap;
}
.menu a:hover{color:var(--baslik);background:var(--zemin-2)}

.ust-sag{display:flex;align-items:center;gap:9px;flex:none}
.ust .dugme{padding:10px 20px;font-size:.875rem}

.tema-dugme,.menu-dugme{
  width:38px;height:38px;display:grid;place-items:center;cursor:pointer;
  background:transparent;border:1px solid var(--cizgi);border-radius:var(--r-s);
  color:var(--metin-2);transition:color var(--gecis),border-color var(--gecis),background var(--gecis);
}
.tema-dugme:hover,.menu-dugme:hover{color:var(--baslik);border-color:var(--cizgi-2);background:var(--zemin-2)}
.tema-dugme svg,.menu-dugme svg{width:16px;height:16px}
.tema-dugme .ay{display:none}
:root[data-tema="koyu"] .tema-dugme .gunes{display:none}
:root[data-tema="koyu"] .tema-dugme .ay{display:block}
.menu-dugme{display:none}

@media (max-width:980px){
  .menu{
    position:fixed;inset:auto 0 auto 0;top:var(--menu-ust,110px);
    flex-direction:column;align-items:stretch;gap:0;
    background:var(--zemin);border-bottom:1px solid var(--cizgi);
    box-shadow:0 12px 30px -18px rgba(16,24,40,.4);
    padding:6px var(--gutter) 14px;
    transform:translateY(-8px);opacity:0;visibility:hidden;
    transition:transform var(--gecis),opacity var(--gecis),visibility var(--gecis);
  }
  .menu.acik{transform:none;opacity:1;visibility:visible}
  .menu a{padding:14px 0;font-size:1.0625rem;border-bottom:1px solid var(--cizgi);border-radius:0}
  .menu a:hover{background:transparent}
  .menu-dugme{display:grid}
  .ust .dugme--ana{display:none}
}

/* --- alt bilgi --- */
.alt{background:var(--gece);color:var(--metin-gece-2);padding-block:52px 26px;margin-top:var(--bolum)}
.alt .marka-ad{color:#fff}
.alt .marka-alt{color:var(--metin-gece-2)}
.alt .marka-im{background:var(--gece-3)}
.alt-ust{display:grid;grid-template-columns:1.7fr 1fr 1fr;gap:40px;padding-bottom:34px;border-bottom:1px solid var(--cizgi-gece)}
.alt-ust p{margin-top:14px;max-width:40ch;font-size:.9375rem;line-height:1.65}
.alt-sut h3{font-family:var(--f-mono);font-size:.625rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--vurgu-parlak);margin-bottom:14px}
.alt-sut li+li{margin-top:10px}
.alt-sut a{font-size:.9375rem;transition:color var(--gecis)}
.alt-sut a:hover{color:#fff}
.alt-son{display:flex;flex-wrap:wrap;gap:14px;justify-content:space-between;align-items:center;padding-top:22px;font-size:.8125rem;color:var(--metin-gece-2)}
.alt-son .yasal{display:flex;gap:18px;flex-wrap:wrap}
.alt-son .yasal a:hover{color:#fff}
@media (max-width:760px){.alt-ust{grid-template-columns:1fr;gap:28px}}

/* --- açılış (reveal) — emniyet zamanlayıcısı site.js'te --- */
.ac{opacity:0;transform:translateY(16px);transition:opacity .6s ease,transform .6s cubic-bezier(.2,.7,.3,1)}
.ac.gor{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.ac{opacity:1;transform:none;transition:none}}