/* ═══════════════════════════════════════════
   BODY FORM FIGHT CLUB — Shared Navbar
   Tüm sayfalarda ortak. blog.css / style.css
   ile birlikte yüklenir.
═══════════════════════════════════════════ */

/* Token'lar — style.css yüklü değilse fallback */
:root{
  --neon:     #C8F500;
  --neon-mid: #DCFF3A;
  --red:      #FF2424;
  --red-dark: #CC0000;
  --ink:      #0A0A0A;
  --ink-dim:  rgba(10,10,10,0.55);
  --ink-faint:rgba(10,10,10,0.35);
  --bg:       #FFFFFF;
  --bg-alt:   #F5F5F5;
  --border:   rgba(10,10,10,0.1);
  --border-2: rgba(10,10,10,0.18);
  --ease:     cubic-bezier(0.19,1,0.22,1);
}

/* FOCUS VISIBLE */
:focus-visible{outline:3px solid var(--neon);outline-offset:2px}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:none}

/* ── NAVBAR ── */
#navbar{
  position:fixed;
  top:0;left:0;right:0;
  z-index:999;
  background:#fff;
  border-bottom:3px solid var(--neon);
  transition:box-shadow .3s cubic-bezier(0.19,1,0.22,1);
}
#navbar.scrolled{
  box-shadow:0 4px 24px rgba(0,0,0,.1);
}

.nav-topbar{
  background:var(--ink);
  padding:.35rem 0;
  display:flex;align-items:center;justify-content:flex-end;gap:1.5rem;
}
.nav-topbar-inner{
  width:90%;max-width:1280px;margin:0 auto;
  display:flex;align-items:center;justify-content:flex-end;gap:1.5rem;
}
.nav-topbar a{
  font-family:Oswald,sans-serif;
  font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;
  color:rgba(255,255,255,.55);transition:color .2s;
}
.nav-topbar a:hover{color:var(--neon)}
.nav-topbar-sep{width:1px;height:12px;background:rgba(255,255,255,.15)}

.nav-main{
  display:flex;align-items:center;
  width:90%;max-width:1280px;margin:0 auto;
  height:68px;
}
.nav-logo{display:flex;align-items:center;flex-shrink:0;padding-right:2.5rem}
.nav-logo-img{height:46px;width:auto;object-fit:contain}

.nav-links{display:flex;align-items:stretch;flex:1}
.nav-links a{
  display:flex;align-items:center;
  font-family:Oswald,sans-serif;
  font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;
  color:rgba(10,10,10,.55);font-weight:400;
  padding:0 1.1rem;
  position:relative;
  transition:color .2s;
  white-space:nowrap;
}
.nav-links a::after{
  content:'';
  position:absolute;bottom:0;left:0;right:0;
  height:3px;background:var(--red);
  transform:scaleX(0);transform-origin:center;
  transition:transform .25s cubic-bezier(0.19,1,0.22,1);
}
.nav-links a:hover{color:var(--ink)}
.nav-links a:hover::after{transform:scaleX(1)}

.nav-right{
  display:flex;align-items:center;gap:.75rem;
  margin-left:auto;padding-left:1.5rem;
}
.nav-org-btn{
  background:transparent;
  border:2px solid var(--ink);
  color:var(--ink);
  font-family:Oswald,sans-serif;
  font-size:.72rem;font-weight:700;
  letter-spacing:.15em;text-transform:uppercase;
  padding:.48rem 1.1rem;cursor:pointer;
  transition:all .2s;
}
.nav-org-btn:hover{background:var(--ink);color:#fff}

.nav-cta{
  background:var(--red);color:#fff !important;
  font-family:Oswald,sans-serif;
  font-size:.78rem;font-weight:700;
  letter-spacing:.15em;text-transform:uppercase;
  padding:.55rem 1.4rem;
  transition:background .2s;
  display:flex;align-items:center;gap:.4rem;
}
.nav-cta:hover{background:var(--red-dark)}

.nav-hamburger{
  display:none;flex-direction:column;justify-content:center;
  gap:5px;cursor:pointer;padding:4px;margin-left:auto;align-self:center;
  background:none;border:none;
}
.nav-hamburger span{display:block;width:26px;height:2px;background:var(--ink);transition:all .3s}

@media(max-width:900px){
  .nav-links,.nav-right{display:none}
  .nav-hamburger{display:flex}
  .nav-logo-img{height:38px}
  .nav-main{height:56px}
  .nav-topbar{display:none}
}
@media(min-width:901px){
  .mobile-drawer,.nav-drawer-overlay{display:none !important}
  .nav-hamburger{display:none !important}
}

/* ── MOBILE DRAWER ── */
body.menu-open-lock{overflow:hidden}

.nav-drawer-overlay{
  display:none;position:fixed;inset:0;
  background:rgba(0,0,0,.35);z-index:9990;
  backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);
}
.nav-drawer-overlay.active{display:block}

.mobile-drawer{
  position:fixed;top:0;right:0;
  width:min(82vw,320px);height:100dvh;
  background:#fff;
  border-left:2px solid var(--neon);
  z-index:9991;display:flex;flex-direction:column;
  transform:translateX(100%);
  transition:transform .38s cubic-bezier(0.19,1,0.22,1);
  will-change:transform;
}
.mobile-drawer.open{transform:translateX(0)}

.drawer-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:1.1rem 1.25rem;
  border-bottom:1px solid rgba(10,10,10,.1);flex-shrink:0;
  background:var(--neon);
}
.drawer-logo{height:32px;width:auto;display:block}
.drawer-close{
  background:none;border:none;color:var(--ink);
  font-size:1.3rem;cursor:pointer;line-height:1;padding:.3rem;transition:opacity .2s;
}
.drawer-close:hover{opacity:.6}

.drawer-nav{
  flex:1;display:flex;flex-direction:column;
  overflow-y:auto;overflow-x:hidden;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  padding:.5rem 0;
}
.drawer-link{
  display:flex;align-items:center;gap:.75rem;
  padding:.9rem 1.25rem;
  font-family:Oswald,sans-serif;font-size:.85rem;
  letter-spacing:.22em;text-transform:uppercase;
  color:rgba(10,10,10,.55);
  border-bottom:1px solid rgba(10,10,10,.1);transition:all .2s;
}
.drawer-link::before{
  content:'';flex-shrink:0;width:3px;height:14px;
  background:var(--red);opacity:0;transition:opacity .2s;
}
.drawer-link:hover{color:var(--ink);background:#F5F5F5}
.drawer-link:hover::before{opacity:1}

.drawer-org-link{
  display:flex;align-items:center;gap:.75rem;padding:.9rem 1.25rem;
  font-family:Oswald,sans-serif;font-size:.85rem;letter-spacing:.22em;
  text-transform:uppercase;color:var(--red);
  background:none;border:none;border-bottom:1px solid rgba(10,10,10,.1);
  cursor:pointer;width:100%;text-align:left;transition:all .2s;
}
.drawer-org-link:hover{background:var(--bg-alt)}

.drawer-footer{
  padding:1.25rem;border-top:1px solid rgba(10,10,10,.1);
  display:flex;flex-direction:column;gap:.6rem;flex-shrink:0;
}
.drawer-cta{
  display:block;background:var(--red);color:#fff;font-weight:700;
  text-align:center;padding:.9rem 1rem;
  font-family:Oswald,sans-serif;font-size:.85rem;
  letter-spacing:.2em;text-transform:uppercase;transition:background .2s;
}
.drawer-cta:hover{background:var(--red-dark)}
.drawer-contact{
  display:flex;align-items:center;justify-content:center;gap:.4rem;
  color:rgba(10,10,10,.55);font-size:.72rem;letter-spacing:.1em;transition:color .2s;
}
.drawer-contact:hover{color:var(--ink)}

/* ── ORG PANEL ── */
.org-overlay{
  position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:1998;
  opacity:0;visibility:hidden;transition:opacity .4s,visibility .4s;
  backdrop-filter:blur(4px);
}
.org-overlay.active{opacity:1;visibility:visible}

.org-panel{
  position:fixed;top:0;right:0;bottom:0;width:min(520px,100vw);
  background:#fff;
  border-left:3px solid var(--neon);
  z-index:1999;transform:translateX(100%);
  transition:transform .45s cubic-bezier(0.19,1,0.22,1);
  overflow-y:auto;overflow-x:hidden;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  padding:2.5rem 2rem;
}
.org-panel.active{transform:translateX(0)}

.org-panel-header{
  display:flex;align-items:flex-start;justify-content:space-between;
  gap:1rem;margin-bottom:1.2rem;
}
.org-panel-tag{
  font-size:.6rem;letter-spacing:.4em;text-transform:uppercase;
  color:var(--red);margin-bottom:.4rem;font-weight:700;
  font-family:Oswald,sans-serif;
}
.org-panel-title{
  font-family:Oswald,sans-serif;font-size:2rem;
  letter-spacing:.05em;color:var(--ink);
  text-transform:uppercase;line-height:1;
}
.org-panel-close{
  background:none;border:2px solid rgba(10,10,10,.18);color:var(--ink);
  width:36px;height:36px;display:flex;align-items:center;justify-content:center;
  cursor:pointer;flex-shrink:0;transition:all .2s;font-size:1rem;
}
.org-panel-close:hover{border-color:var(--neon);background:var(--neon)}
.org-panel-desc{
  font-size:.85rem;color:rgba(10,10,10,.55);line-height:1.7;
  margin-bottom:2rem;padding-bottom:2rem;
  border-bottom:2px solid rgba(10,10,10,.1);
  font-family:Inter,sans-serif;
}
.org-form{display:flex;flex-direction:column;gap:1.2rem}
.org-form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.org-field{display:flex;flex-direction:column;gap:.4rem}
.org-field label{
  font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;
  color:rgba(10,10,10,.55);font-weight:500;
  font-family:Oswald,sans-serif;
}
.org-field input,.org-field select,.org-field textarea{
  background:#fff;border:2px solid rgba(10,10,10,.18);color:var(--ink);
  font-family:Inter,sans-serif;font-size:.9rem;padding:.75rem 1rem;
  outline:0;transition:border-color .2s;width:100%;
}
.org-field input::placeholder,.org-field textarea::placeholder{
  color:rgba(10,10,10,.35);
}
.org-field input:focus,.org-field select:focus,.org-field textarea:focus{
  border-color:var(--neon);
}
.org-field select{
  appearance:none;cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23555' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 1rem center;
}
.org-field select option{background:#fff;color:#0A0A0A}
.org-field textarea{resize:vertical;min-height:100px}
.org-submit{
  width:100%;justify-content:center;margin-top:.5rem;
  display:inline-flex;align-items:center;gap:.6rem;
  padding:.95rem 2rem;
  font-family:Oswald,sans-serif;font-size:.9rem;
  letter-spacing:.15em;text-transform:uppercase;
  background:var(--neon);color:#000;font-weight:700;
  border:none;cursor:pointer;transition:background .3s;
}
.org-submit:hover{background:var(--neon-mid)}
.org-success{
  display:none;text-align:center;padding:1rem;
  border:2px solid rgba(0,180,60,.4);background:#F0FFF4;
  color:#00802d;font-size:.85rem;line-height:1.6;
  font-family:Inter,sans-serif;
}
.org-success.show{display:block}

@media(max-width:600px){
  .org-form-row{grid-template-columns:1fr}
}

/* ── NAV SPACER (fixed nav altındaki içerik için) ── */
.nav-spacer{height:98px} /* topbar ~30px + nav 68px */
@media(max-width:900px){.nav-spacer{height:56px}}