/*
 * Site kabugu — menu kapsulu ve altbilgi. Her sayfada yuklenir.
 * style.css ile ayni degisken adlarini kullanmamak icin renkler sabit yazildi.
 */
:root{ --olcu:clamp(1.25rem,5vw,3rem); }

#tepe-nokta{position:absolute;top:0;left:0;width:1px;height:1px}
.sinir{max-width:1180px;margin:0 auto;padding-left:var(--olcu);padding-right:var(--olcu)}
/* =========================================================================
 * DÜĞME SİSTEMİ — tek sahibi bu dosyadır.
 * anasayfa.css ve style.css içinde düğme kuralı TANIMLANMAZ. İkisi de bu
 * dosyadan sonra yüklendiği için aynı adlı bir kural buradaki biçimi sessizce
 * ezer; köşe yarıçapı bu yüzden iki kez bozuldu. Yeni bir düğme tipi
 * gerekiyorsa buraya eklenir.
 *
 * Sıra önemli: taban -> renk -> biçim -> durum. Biçim değiştiriciler renk
 * kurallarından sonra geldiği için köşe ve dolgu her zaman kazanır.
 * ========================================================================= */

/* 1. taban */
.btn,.buton{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;
  font:inherit;font-weight:700;font-size:.95rem;line-height:1.2;
  padding:1rem 1.8rem;border-radius:6px;border:1px solid transparent;
  cursor:pointer;text-decoration:none;
  transition:background .15s,border-color .15s,color .15s,transform .15s}

/* 2. renk türleri */
.btn-ana,.buton{background:#22D3EE;color:#04262E;border-color:#22D3EE}
.btn-koyu{background:#080D14;color:#fff;border-color:#080D14}
.btn-hayalet{background:transparent;color:#DCE7F2;border-color:rgba(220,231,242,.28)}
.ikincil{background:transparent;color:#0A7C91;border-color:#E3E9F0}

/* 3. biçim değiştiriciler */
.btn-kapsul,.kapsul-cta{border-radius:999px;padding:.62rem 1.25rem;font-size:.85rem;white-space:nowrap;flex:none}
.btn-tam,.kutu-btn{width:100%}

/* 4. durumlar */
.btn:hover,.buton:hover{transform:translateY(-1px)}
.btn-ana:hover,.buton:hover{background:#4BE2F7;border-color:#4BE2F7}
.btn-koyu:hover{background:#101B28;border-color:#101B28}
.btn-hayalet:hover{border-color:#DCE7F2}
.ikincil:hover{background:#F5F8FB;border-color:#0A7C91;color:#0A7C91;transform:none}
.btn:focus-visible,.buton:focus-visible{outline:2px solid #22D3EE;outline-offset:3px}
.btn:disabled,.buton:disabled,.btn[disabled],.buton[disabled]{opacity:.55;cursor:not-allowed;transform:none}
header{position:sticky;top:0;z-index:40;height:0;padding:0 var(--olcu);pointer-events:none}
.kapsul{pointer-events:auto;position:relative;top:.85rem;width:fit-content;max-width:100%;margin:0 auto;display:flex;align-items:center;gap:1.25rem;
  padding:.42rem .45rem .42rem 1.25rem;border-radius:999px;border:1px solid rgba(255,255,255,.07);
  background:rgba(11,17,25,.72);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  transition:background .25s ease,border-color .25s ease,box-shadow .25s ease}
html:not(.js) .kapsul{background:rgba(11,17,25,.93);border-color:rgba(255,255,255,.1);box-shadow:0 14px 38px rgba(0,0,0,.4)}
.kapsul.yapisik{background:rgba(11,17,25,.93);border-color:rgba(255,255,255,.1);box-shadow:0 14px 38px rgba(0,0,0,.4);backdrop-filter:blur(20px) saturate(140%);-webkit-backdrop-filter:blur(20px) saturate(140%)}
.kapsul-ayrac{width:1px;height:18px;background:rgba(255,255,255,.14);flex:none}
.kapsul .marka{flex-direction:row;font-size:.95rem;white-space:nowrap}
.marka{color:#fff;font-weight:700;font-size:1.02rem;letter-spacing:-.02em;display:flex;flex-direction:column;line-height:1.25}
.marka small{font-size:.68rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:#93A6BB}
.menu{display:flex;align-items:center;gap:1.45rem}
.menu a{color:#C7D5E4;font-size:.88rem;font-weight:600;white-space:nowrap}
.menu a:hover{color:#fff}
.menu-ac{display:none;flex-direction:column;align-items:center;justify-content:center;gap:5px;width:40px;height:40px;padding:0;background:none;border:0;cursor:pointer;flex:none}
.menu-ac span{display:block;width:19px;height:2px;border-radius:1px;background:#C7D5E4;transition:transform .22s,opacity .22s}
.menu-ac[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.menu-ac[aria-expanded="true"] span:nth-child(2){opacity:0}
.menu-ac[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

@media(max-width:860px){
  .kapsul{width:100%;justify-content:space-between;gap:.75rem;padding-left:1.1rem}
  .kapsul-ayrac{display:none}
  .menu-ac{display:flex}
  .menu{position:absolute;top:calc(100% + .6rem);left:0;right:0;flex-direction:column;align-items:stretch;gap:0;
    padding:.5rem;border-radius:16px;border:1px solid rgba(255,255,255,.1);background:#0B1119;
    backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:0 18px 44px rgba(0,0,0,.45);display:none}
  .menu.acik{display:flex}
  .menu a{padding:.75rem 1rem;border-radius:10px;font-size:.95rem}
  .kapsul-cta{padding:.58rem 1.05rem;font-size:.8rem;border-radius:999px}
}

/* ---- altbilgi ---- */
/* style.css icindeki eski footer kurali hala gecerli; daktilo fontunu,
   dar genisligi ve flex duzenini burada geri aliyoruz. */
footer{background:#080D14;color:#93A6BB;border-top:1px solid #1E2A38;font-size:.9rem;
  font-family:inherit;max-width:none;margin:0;padding:0;display:block}
footer .sinir{padding:3rem 0 2.2rem;display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:2rem}
footer h4{color:#fff;font-size:.82rem;letter-spacing:.14em;text-transform:uppercase;margin-bottom:1rem}
footer ul{list-style:none;display:grid;gap:.5rem;margin:0;padding:0}
footer a{color:inherit;text-decoration:none}
footer a:hover{color:#fff}
footer p{margin:0}
.footer-alt{border-top:1px solid #1E2A38;color:inherit;font-size:inherit;margin:0}
.footer-alt .sinir{padding:1.2rem 0;display:flex;justify-content:space-between;gap:1rem;font-size:.84rem}
@media(max-width:820px){ footer .sinir{grid-template-columns:1fr 1fr} }
@media(max-width:560px){ footer .sinir{grid-template-columns:1fr} }

/* ---- eski tasarimli sayfalar ---- */
/* Kapsul icerigin uzerinde yuzuyor; eski sablonlarin ust boslugu buna gore artiyor. */
.alt-sayfa{padding-top:7.4rem}
@media(max-width:860px){ .alt-sayfa{padding-top:6.4rem} }

/* ---- hizmetler açılır menüsü ---- */
.menu-grup{position:relative}
.menu-ust{display:inline-flex;align-items:center;gap:.4rem;font:inherit;font-size:.88rem;font-weight:600;
  color:#C7D5E4;background:none;border:0;padding:0;cursor:pointer;white-space:nowrap}
.menu-ust:hover,.menu-ust.acik,.menu-ust.aktif{color:#fff}
.menu-ok{transition:transform .2s ease;flex:none}
.menu-ust[aria-expanded="true"] .menu-ok{transform:rotate(180deg)}

.alt-menu{position:absolute;top:calc(100% + .95rem);left:50%;transform:translateX(-50%) translateY(-6px);
  min-width:250px;display:flex;flex-direction:column;gap:0;padding:.45rem;
  border-radius:14px;border:1px solid rgba(255,255,255,.1);background:#0B1119;
  backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  box-shadow:0 18px 44px rgba(0,0,0,.5);
  opacity:0;visibility:hidden;pointer-events:none;transition:opacity .18s ease,transform .18s ease,visibility .18s}
.menu-grup.acik .alt-menu{opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(0)}
/* düğme ile panel arasındaki boşlukta imleç kaybolmasın */
.alt-menu::before{content:"";position:absolute;left:0;right:0;top:-.95rem;height:.95rem}
.alt-menu a{display:block;padding:.62rem .8rem;border-radius:9px;font-size:.88rem;font-weight:600;
  color:#C7D5E4;white-space:nowrap}
.alt-menu a:hover,.alt-menu a:focus-visible{background:rgba(255,255,255,.07);color:#fff}
.alt-menu a.aktif{color:#22D3EE}
.alt-menu .alt-tum{margin-top:.3rem;padding-top:.7rem;border-top:1px solid rgba(255,255,255,.09);
  border-radius:0 0 9px 9px;font-size:.82rem;color:#22D3EE}
.alt-menu .alt-tum:hover{background:transparent;color:#7DE9F8}

@media(max-width:860px){
  .menu-grup{position:static}
  .menu-ust{width:100%;justify-content:space-between;padding:.75rem 1rem;border-radius:10px;font-size:.95rem}
  .menu-ust:hover{background:rgba(255,255,255,.06)}
  .alt-menu{position:static;transform:none;min-width:0;padding:.15rem 0 .35rem .6rem;
    border:0;background:none;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;
    border-left:1px solid rgba(255,255,255,.12);margin:0 0 .3rem .9rem;
    display:none;opacity:1;visibility:visible;pointer-events:auto}
  .menu-grup.acik .alt-menu{display:flex;transform:none}
  .alt-menu::before{content:none}
  .alt-menu a{white-space:normal;padding:.55rem .8rem;font-weight:500}
}