/* ============================================================
   HEADER / NAVIGATION — tek kaynak
   Tum sayfalar bu dosyayi kullanir. Sayfa icine kopyalamayin.

   Yapi:
     1) Paylasilan temel kurallar (masaustu + mobil ortak)
     2) MASAUSTU  @media (min-width:861px)  — standart beyaz serit
     3) MOBIL     @media (max-width:860px)  — onceki tasarim, degistirilmedi
   ============================================================ */

:root{
    --coral:#0056B3; --coral-deep:#0056B3; --stone:#292524; --stone-soft:#44403C; --ink:#1C1917;
    --nav-glass:rgba(255,255,255,0.70); --nav-blur:20px; --ease:cubic-bezier(0.22,0.61,0.36,1);
    --nav-h:74px; --nav-line:rgba(28,25,23,0.11);
}

/* ── 1) PAYLASILAN ─────────────────────────────────────────── */
.nav-wrap{position:fixed;left:0;right:0;z-index:100;display:flex;justify-content:center;pointer-events:none;}
.nav{pointer-events:auto;width:100%;display:flex;align-items:center;
    font-family:"Outfit",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;}
.nav a, .nav button{font-family:inherit;}

.brand{display:flex;align-items:center;gap:12px;flex-shrink:0;text-decoration:none;}
.brand img{height:40px;width:auto;object-fit:contain;}
.brand-name{display:none;flex-direction:column;line-height:1.15;}
.brand-name b{font-size:15px;font-weight:700;letter-spacing:-0.012em;color:var(--ink);}
.brand-name span{font-size:9.5px;font-weight:600;letter-spacing:0.15em;text-transform:uppercase;color:var(--stone-soft);}
.logo-dot{position:relative;width:34px;height:34px;border-radius:50%;
    background:radial-gradient(120% 120% at 32% 28%,#0c2f25 0%,#001912 100%);
    box-shadow:0 2px 6px -1px rgba(0,25,18,0.45),0 0 0 1px rgba(255,255,255,0.35) inset;flex-shrink:0;}
.logo-dot::after{content:"";position:absolute;top:9px;left:10px;width:8px;height:8px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(41,37,36,0.25);}

.nav-links{display:flex;align-items:center;}
.nav-link{position:relative;font-size:14px;font-weight:500;color:var(--stone);letter-spacing:-0.005em;white-space:nowrap;text-decoration:none;
    transition:color .2s var(--ease),background-color .2s var(--ease);}
button.nav-link{background:none;border:none;cursor:pointer;}
.nav-link:hover{background:rgba(0,0,0,0.07);}
.nav-link.is-active{color:var(--ink);background:rgba(0,0,0,0.07);}
.nav-link.is-active::after{display:none;}

.has-menu{position:relative;}
.nav-link .chev{display:inline-block;width:10px;height:10px;margin-left:6px;flex-shrink:0;transition:transform .25s var(--ease);}
.has-menu:hover .chev,.has-menu:focus-within .chev{transform:rotate(180deg);}

.submenu{position:absolute;top:calc(100% + 12px);left:50%;transform:translateX(-50%) translateY(6px);min-width:190px;padding:7px;border-radius:16px;
    background:#fff;border:1px solid rgba(28,25,23,0.10);box-shadow:0 18px 40px -18px rgba(41,37,36,0.40);
    opacity:0;visibility:hidden;transition:opacity .22s var(--ease),transform .22s var(--ease),visibility 0s .22s;}
.has-menu:hover .submenu,.has-menu:focus-within .submenu{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);transition:opacity .22s var(--ease),transform .22s var(--ease),visibility 0s;}
.submenu a{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;font-size:13.5px;font-weight:500;color:var(--stone);text-decoration:none;transition:background-color .18s var(--ease);}
.submenu a:hover{background:rgba(0,86,179,0.10);}
.submenu a.is-active{background:rgba(0,86,179,0.14);color:var(--ink);}
.submenu a i{width:6px;height:6px;border-radius:50%;background:var(--coral-deep);flex-shrink:0;}

.nav-cta{display:inline-flex;align-items:center;gap:8px;flex-shrink:0;font-size:14px;font-weight:600;color:#fff;background:#0056B3;padding:11px 20px;border-radius:0;letter-spacing:-0.005em;white-space:nowrap;text-decoration:none;
    box-shadow:0 8px 18px -8px rgba(41,37,36,0.6);transition:transform .2s var(--ease),background-color .2s var(--ease),box-shadow .2s var(--ease);}
.nav-cta:hover{background:#00468f;transform:translateY(-1px);}
.nav-cta:active{transform:translateY(0);}
.nav-cta svg{width:15px;height:15px;}

.nav-wa{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:42px;height:42px;border-radius:50%;
    transition:transform .2s var(--ease),filter .2s var(--ease);}
.nav-wa img{width:40px;height:40px;object-fit:contain;display:block;}
.nav-wa:hover{transform:translateY(-1px);filter:brightness(1.06);}
.nav-wa:active{transform:translateY(0);}
.nav-wa:focus-visible{outline:2px solid #1aa851;outline-offset:2px;}
.wa-glyph{width:22px;height:22px;fill:#fff;}

.nav-toggle{display:none;width:42px;height:42px;border:none;background:var(--stone);border-radius:50%;cursor:pointer;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 8px 18px -8px rgba(41,37,36,0.6);}
.nav-toggle span{position:relative;display:block;width:17px;height:1.8px;background:#fff;border-radius:2px;transition:transform .3s var(--ease),opacity .2s var(--ease);}
.nav-toggle span::before,.nav-toggle span::after{content:"";position:absolute;left:0;width:17px;height:1.8px;background:#fff;border-radius:2px;transition:transform .3s var(--ease);}
.nav-toggle span::before{top:-6px;} .nav-toggle span::after{top:6px;}
body.menu-open .nav-toggle span{background:transparent;}
body.menu-open .nav-toggle span::before{transform:translateY(6px) rotate(45deg);}
body.menu-open .nav-toggle span::after{transform:translateY(-6px) rotate(-45deg);}

.nav-link:focus-visible,.nav-cta:focus-visible,.submenu a:focus-visible,.nav-toggle:focus-visible{outline:2px solid var(--coral-deep);outline-offset:2px;}

/* ── 2) MASAUSTU: standart, tam genislikte beyaz serit ─────── */
@media (min-width:861px){
    html{scroll-padding-top:calc(var(--nav-h) + 20px);}
    body{padding-top:var(--nav-h);}

    .nav-wrap{top:0;padding:0;pointer-events:auto;
        background:#fff;border-bottom:1px solid var(--nav-line);}
    .nav{max-width:1180px;height:var(--nav-h);padding:0 28px;gap:0;}

    .brand{gap:12px;}
    .brand img{height:30px;}
    .brand-name{display:flex;}

    .nav-links{height:var(--nav-h);align-items:stretch;gap:36px;margin:0 auto;}
    .has-menu{display:flex;}
    .nav-link{display:inline-flex;align-items:center;padding:0;border-radius:0;
        font-size:16.5px;font-weight:600;letter-spacing:-0.01em;color:var(--stone-soft);}
    .nav-link:hover{background:none;color:var(--ink);}
    .nav-link.is-active{background:none;color:var(--coral-deep);font-weight:700;}
    .nav-link.is-active::after{display:block;content:"";position:absolute;left:0;right:0;bottom:0;height:2px;
        background:var(--coral-deep);border-radius:2px 2px 0 0;}

    .submenu{top:100%;}

    .nav-wa{width:40px;height:40px;margin-left:24px;margin-right:14px;}
    .nav-cta{padding:12px 22px;box-shadow:none;}
    .nav-cta:hover{box-shadow:none;background:#00468f;}
}

/* ── 2b) DAR MASAUSTU (861-1040px): sikismayi onler ────────── */
@media (min-width:861px) and (max-width:1040px){
    .nav{padding:0 18px;}
    .brand-name b{font-size:14px;}
    .brand-name span{font-size:9px;letter-spacing:0.12em;}
    .brand img{height:27px;}
    .nav-links{gap:22px;margin:0 auto;}
    .nav-link{font-size:15px;}
    .nav-wa{margin-left:16px;margin-right:10px;width:36px;height:36px;}
    .nav-wa img{width:36px;height:36px;}
    .nav-cta{padding:10px 15px;font-size:13.5px;}
}

/* ── 3) MOBIL: onceki tasarim, degistirilmedi ──────────────── */
@media (max-width:860px){
    .nav-wrap{top:0;padding:0;background:#fff;box-shadow:0 1px 0 rgba(0,0,0,0.08);}
    .nav{position:relative;padding:8px 16px;gap:0;max-width:100%;border-radius:0;border:none;background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none;justify-content:center;}
    .brand{padding:0;}
    .brand img{height:48px !important;}
    .nav-toggle{display:inline-flex;position:absolute;right:16px;top:50%;transform:translateY(-50%);}
    .nav-links{position:fixed;top:62px;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;margin:0;padding:8px 12px 16px;
        background:#ffffff;border-top:1px solid rgba(0,0,0,0.08);border-radius:0;
        box-shadow:0 8px 24px rgba(0,0,0,0.12);
        opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity .22s var(--ease),transform .22s var(--ease),visibility 0s .22s;
        z-index:999;}
    body.menu-open .nav-links{opacity:1;visibility:visible;transform:translateY(0);transition:opacity .22s var(--ease),transform .22s var(--ease),visibility 0s;}
    .nav-link{padding:14px 12px;font-size:15px;border-radius:10px;}
    .nav-link.is-active::after{display:none;}
    .submenu{position:static;transform:none;opacity:1;visibility:visible;min-width:0;margin:2px 0 4px 16px;padding:4px 0 4px 12px;
        background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;border:none;border-left:2px solid rgba(0,86,179,0.25);border-radius:0;box-shadow:none;transition:none;}
    .nav-link .chev{display:none;}
    .nav-cta.desktop-cta{display:none;}
    .nav-wa.desktop-wa{display:none;}
    .mobile-cta{display:inline-flex;align-items:center;gap:6px;justify-content:center;margin-top:8px;width:auto;flex:0 0 auto;align-self:flex-start;padding:9px 16px;font-size:13px;}
    .mobile-cta .wa-glyph{width:18px;height:18px;}
    html{scroll-padding-top:80px;}
    .nav-wa{width:44px;height:44px;}
    .nav-toggle{width:44px;height:44px;}
    .has-menu button.nav-link[aria-expanded="true"] ~ .submenu{transform:none;}
}
@media (min-width:861px){ .mobile-cta{display:none;} }

/* ── Ortak son kurallar ────────────────────────────────────── */
.has-menu button.nav-link[aria-expanded="true"] ~ .submenu{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);transition:opacity .22s var(--ease),transform .22s var(--ease),visibility 0s;}
@media (prefers-reduced-motion:reduce){ *{transition:none !important;animation:none !important;} html{scroll-behavior:auto;} }