/* ==================================================================
   umutkocaoglu.com — ORTAK MENÜ SİSTEMİ
   Bu dosya hem index.html hem de tüm hizmet sayfaları tarafından
   kullanılır. Menüyle ilgili tek doğru kaynak burasıdır.
   ================================================================== */

/* ---------- başlık ---------- */
header{position:sticky;top:0;z-index:200;background:var(--glass);backdrop-filter:blur(18px) saturate(1.3);
  border-bottom:1px solid var(--border-soft);transition:border-color .3s,box-shadow .3s,background .3s}
header::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;
  background:linear-gradient(90deg,transparent,rgba(0,255,156,.45),rgba(34,211,238,.28),transparent);
  opacity:0;transition:opacity .35s}
header.scrolled{border-bottom-color:transparent;box-shadow:0 18px 40px -30px rgba(0,0,0,.95)}
header.scrolled::after{opacity:1}

.nav{display:flex;align-items:center;gap:18px;height:70px}

/* ---------- marka ---------- */
.brand{display:inline-flex;align-items:center;gap:0;font-weight:800;font-size:1.06rem;letter-spacing:-.5px;
  white-space:nowrap;padding:6px 2px;flex:none}
.brand .term{color:var(--green)}
.brand b{color:var(--text);font-weight:800}
.brand .cur{color:var(--green);animation:navBlink 1.15s steps(1) infinite;margin-left:2px}
@keyframes navBlink{50%{opacity:0}}

/* ---------- ana bağlantılar ---------- */
.nav-links{display:flex;align-items:center;gap:4px;margin-left:auto}
.nav-links>a,.nav-dd-btn{position:relative;display:inline-flex;align-items:center;gap:4px;
  padding:9px 13px;border-radius:9px;font-family:var(--font);font-size:.86rem;font-weight:500;
  color:var(--dim);background:none;border:0;cursor:pointer;white-space:nowrap;
  transition:color .2s,background .2s,transform .2s}
.nav-links>a::before,.nav-dd-btn::before{content:"~/";color:var(--mute);transition:color .2s}
.nav-links>a:hover,.nav-dd-btn:hover,
.nav-dd.open .nav-dd-btn,.nav-dd.has-active .nav-dd-btn{color:var(--green);background:var(--surface-2)}
.nav-links>a:hover::before,.nav-dd-btn:hover::before,
.nav-dd.open .nav-dd-btn::before,.nav-dd.has-active .nav-dd-btn::before{color:var(--green)}
.nav-links>a.active{color:var(--green)}
.nav-links>a.active::before{color:var(--green)}
.nav-links>a.active::after{content:"";position:absolute;left:13px;right:13px;bottom:3px;height:2px;border-radius:2px;
  background:var(--green);box-shadow:0 0 10px rgba(0,255,156,.65)}
.nav-dd-btn .material-symbols-rounded{font-size:16px;transition:transform .25s var(--ease)}
.nav-dd.open .nav-dd-btn .material-symbols-rounded{transform:rotate(180deg)}

/* ---------- açılır mega menü (kod penceresi görünümü) ---------- */
.nav-dd{position:relative}
.nav-dd-menu{position:absolute;top:calc(100% + 12px);left:50%;transform:translate(-50%,-10px);
  width:max-content;max-width:min(680px,calc(100vw - 40px));
  background:var(--surface);border:1px solid var(--border);border-radius:14px;overflow:hidden;
  box-shadow:0 40px 70px -34px rgba(0,0,0,.95),0 0 0 1px rgba(0,255,156,.05);
  opacity:0;visibility:hidden;transition:opacity .22s var(--ease),transform .22s var(--ease),visibility .22s;z-index:220}
.nav-dd:hover .nav-dd-menu,.nav-dd.open .nav-dd-menu,.nav-dd:focus-within .nav-dd-menu{
  opacity:1;visibility:visible;transform:translate(-50%,0)}
.nav-dd:last-of-type .nav-dd-menu{left:auto;right:0;transform:translate(0,-10px)}
.nav-dd:last-of-type:hover .nav-dd-menu,.nav-dd:last-of-type.open .nav-dd-menu,
.nav-dd:last-of-type:focus-within .nav-dd-menu{transform:translate(0,0)}

.dd-bar{display:flex;align-items:center;gap:8px;padding:10px 14px;background:var(--surface-2);
  border-bottom:1px solid var(--border-soft)}
.dd-bar .dots{display:flex;gap:6px}
.dd-bar .dots i{width:10px;height:10px;border-radius:50%;display:block}
.dd-bar .dots i:nth-child(1){background:#ff5f57}
.dd-bar .dots i:nth-child(2){background:#febc2e}
.dd-bar .dots i:nth-child(3){background:#28c840}
.dd-bar .dd-file{font-size:.74rem;color:var(--mute);margin-left:4px}
.dd-bar .dd-file b{color:var(--dim);font-weight:500}

.dd-grid{display:grid;grid-template-columns:repeat(2,minmax(272px,1fr));gap:2px;padding:8px}
.dd-grid.one{grid-template-columns:minmax(300px,1fr)}
.nav-dd-menu a{display:flex;align-items:flex-start;gap:11px;padding:11px 12px;border-radius:10px;
  color:var(--dim);transition:background .16s,color .16s,transform .16s}
.nav-dd-menu a::before{content:none}
.nav-dd-menu a:hover{background:var(--surface-3);color:var(--green)}
.nav-dd-menu a.active{background:var(--surface-2);color:var(--green)}
.dd-ico{width:34px;height:34px;flex:none;border-radius:9px;display:grid;place-items:center;
  background:rgba(0,255,156,.07);border:1px solid rgba(0,255,156,.18);color:var(--green);transition:.2s}
.nav-dd-menu a:hover .dd-ico{background:rgba(0,255,156,.14);border-color:rgba(0,255,156,.4);transform:translateY(-1px)}
.dd-ico .material-symbols-rounded{font-size:19px}
.dd-t{display:block;font-size:.87rem;font-weight:600;color:var(--text);line-height:1.35;transition:color .16s}
.nav-dd-menu a:hover .dd-t,.nav-dd-menu a.active .dd-t{color:var(--green)}
.dd-d{display:block;font-size:.74rem;color:var(--mute);line-height:1.45;margin-top:3px}
.dd-label{grid-column:1/-1;font-size:.66rem;color:var(--mute);letter-spacing:1px;text-transform:uppercase;
  padding:10px 12px 4px}
.dd-sep{grid-column:1/-1;height:1px;background:var(--border-soft);margin:6px 12px}
.dd-foot{display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:12px 16px;background:var(--bg2);border-top:1px solid var(--border-soft)}
.dd-foot .tok-com{font-size:.75rem;color:var(--com)}
.dd-foot .dd-cta{display:inline-flex;align-items:center;gap:7px;font-size:.78rem;font-weight:700;
  color:var(--green);padding:7px 13px;border-radius:8px;border:1px solid rgba(0,255,156,.3);
  background:rgba(0,255,156,.06);transition:.2s;white-space:nowrap}
.dd-foot .dd-cta:hover{background:var(--green);color:#05070a;border-color:var(--green)}
.dd-foot .dd-cta .material-symbols-rounded{font-size:16px}

/* ---------- sağ aksiyonlar ---------- */
.nav-actions{display:flex;align-items:center;gap:9px;flex:none;padding-left:8px;
  border-left:1px solid var(--border-soft)}
.icon-btn{min-width:40px;height:40px;padding:0 9px;display:inline-grid;place-items:center;border-radius:9px;
  border:1px solid var(--border);background:transparent;color:var(--dim);cursor:pointer;
  font-family:var(--font);font-size:.78rem;font-weight:700;transition:.2s}
.icon-btn:hover{color:var(--green);border-color:var(--green);transform:translateY(-1px)}
.lang-btn span{color:var(--green)}
.wa-btn:hover{color:#25D366;border-color:#25D366}
.menu-btn{display:none}
.nav-actions .btn{padding:11px 18px}

/* ---------- mobil ---------- */
@media(max-width:1080px){
  .nav-links>a,.nav-dd-btn{padding:9px 10px;font-size:.83rem}
}
@media(max-width:1000px){
  .nav{height:62px;gap:10px}
  .menu-btn{display:inline-grid}
  .nav-actions{border-left:0;padding-left:0}
  .nav-actions .btn-primary{display:none}
  .nav-links{position:fixed;inset:62px 0 auto 0;margin:0;flex-direction:column;align-items:stretch;gap:0;
    background:var(--bg);border-bottom:1px solid var(--border);padding:8px 20px 22px;
    max-height:calc(100dvh - 62px);overflow-y:auto;overscroll-behavior:contain;
    transform:translateY(-125%);transition:transform .34s var(--ease);z-index:190}
  .nav-links.open{transform:none;box-shadow:0 34px 60px -30px rgba(0,0,0,.95)}
  .nav-links>a,.nav-dd-btn{width:100%;justify-content:flex-start;padding:15px 10px;font-size:.95rem;
    border-radius:0;border-bottom:1px solid var(--border-soft)}
  .nav-links>a.active::after{display:none}
  .nav-links>a.active{background:rgba(0,255,156,.05);border-radius:8px}
  .nav-dd{width:100%}
  .nav-dd-btn .material-symbols-rounded{margin-left:auto}
  .nav-dd-menu{position:static;width:auto;max-width:none;transform:none!important;opacity:1;visibility:visible;
    background:transparent;border:0;border-radius:0;box-shadow:none;max-height:0;overflow:hidden;
    transition:max-height .32s var(--ease)}
  .nav-dd:hover .nav-dd-menu,.nav-dd:focus-within .nav-dd-menu{max-height:0}
  .nav-dd.open .nav-dd-menu{max-height:760px}
  .dd-bar{display:none}
  .dd-grid{grid-template-columns:1fr;padding:6px 0 6px 6px;gap:0}
  .dd-label{padding:12px 10px 4px}
  .dd-foot{background:transparent;border:0;padding:10px 8px 14px}
  .dd-foot .tok-com{display:none}
  .dd-foot .dd-cta{width:100%;justify-content:center;padding:12px}
  .nav-cta{display:flex;margin-top:16px}
  .nav-cta .btn{width:100%;justify-content:center;padding:14px}
  body.nav-open{overflow:hidden}
}
@media(min-width:1001px){.nav-cta{display:none}}
@media(prefers-reduced-motion:reduce){
  .brand .cur{animation:none}
  header,.nav-links>a,.nav-dd-btn,.nav-dd-menu,.icon-btn{transition:none}
}