/* =====================================================================
   Missofra — Navbar "Liquid Glass"
   ---------------------------------------------------------------------
   Navbar fixed-top ve hero gorselinin uzerinde duruyor. Menu yazilari
   koyu renk (#222) oldugu icin cam katmani tamamen seffaf birakilamaz;
   acik renkli hero karelerinde yazi okunmaz hale gelir. Bu yuzden
   %60-75 bandinda tutuldu: arkasi belli olur ama yazi net kalir.

   Bu dosya en son yuklenir, tek basina silinince site eski haline doner.
   ===================================================================== */

/* --- Cam govde ------------------------------------------------------- */
.navbar {
   position: relative;
   background: linear-gradient(180deg,
         rgba(255, 255, 255, 0.74) 0%,
         rgba(255, 255, 255, 0.58) 100%);
   -webkit-backdrop-filter: blur(22px) saturate(185%);
   backdrop-filter: blur(22px) saturate(185%);
   border: 1px solid rgba(255, 255, 255, 0.55);
   border-top: 0;
   /* dis yumusak golge + ic ust kenar isigi (cam kalinligi hissi) */
   box-shadow:
      0 10px 34px rgba(23, 30, 60, 0.13),
      0 2px 8px rgba(0, 0, 0, 0.05),
      inset 0 1px 0 rgba(255, 255, 255, 0.9),
      inset 0 -1px 0 rgba(255, 255, 255, 0.35);
   transition: background .45s ease, box-shadow .45s ease,
      -webkit-backdrop-filter .45s ease, backdrop-filter .45s ease;
}

/* backdrop-filter desteklemeyen tarayicida cam yerine duz zemin:
   seffaf birakirsak menu okunmaz olur. */
@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
   .navbar {
      background: #f7f7f7;
   }
}

/* --- Menu ogeleri ----------------------------------------------------
   Aktif/hover durumunda kutu (pill) YOK: renk degisimi yeterli.
   Camin uzerinde ayrica bir zemin cizmek gorsel gurultu yapiyordu.
   -------------------------------------------------------------------- */
.navbar .nav-item {
   background: none;
   box-shadow: none;
   transition: none;
}

/* Menu yazisi cam uzerinde biraz daha okunakli olsun */
.navbar-nav a,
.navbar-nav li a i {
   text-shadow: 0 1px 0 rgba(255, 255, 255, 0.6);
}

/* --- Mobil menu (acilan panel) de cam olsun -------------------------- */
.navbar-collapse.show,
.navbar-collapse.collapsing {
   background: linear-gradient(180deg,
         rgba(255, 255, 255, 0.80) 0%,
         rgba(255, 255, 255, 0.66) 100%);
   -webkit-backdrop-filter: blur(20px) saturate(180%);
   backdrop-filter: blur(20px) saturate(180%);
   border-radius: 0 0 22px 22px;
   box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85);
}

/* --- Hamburger dugmesi ---------------------------------------------- */
.navbar-toggler {
   background: rgba(244, 143, 44, 0.88);
   -webkit-backdrop-filter: blur(10px) saturate(160%);
   backdrop-filter: blur(10px) saturate(160%);
   border: 1px solid rgba(255, 255, 255, 0.5);
   box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.55),
      0 4px 14px rgba(244, 143, 44, 0.32);
}

.navbar-toggler:hover {
   background: rgba(244, 143, 44, 1);
}

/* --- Acilir menu (dropdown) de ayni dile uysun ----------------------- */
.navbar .dropdown-menu {
   background: linear-gradient(180deg,
         rgba(255, 255, 255, 0.86) 0%,
         rgba(255, 255, 255, 0.74) 100%);
   -webkit-backdrop-filter: blur(20px) saturate(180%);
   backdrop-filter: blur(20px) saturate(180%);
   border: 1px solid rgba(255, 255, 255, 0.6);
   border-radius: 16px;
   box-shadow:
      0 12px 32px rgba(23, 30, 60, 0.16),
      inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

/* Hareket azaltma tercihini sayan kullanicilar icin */
@media (prefers-reduced-motion: reduce) {

   .navbar,
   .navbar .nav-item {
      transition: none;
   }

   .navbar .nav-item:hover {
      transform: none;
   }
}