/* Shared styles */
        /* GSAP Initial State */
        .gsap-fade-up {
            opacity: 0;
            transform: translateY(30px);
        }

        /* Custom Scrollbar */
        ::-webkit-scrollbar {
            width: 8px;
        }

        ::-webkit-scrollbar-track {
            background: #f1f1f1;
        }

        ::-webkit-scrollbar-thumb {
            background: #0B1554;
        }

        ::-webkit-scrollbar-thumb:hover {
            background: #D51B23;
        }

        /* Swiper Customizations */
        .hero-swiper .swiper-pagination-bullet {
            background: #fff;
            opacity: 0.5;
            width: 10px;
            height: 10px;
            transition: all 0.3s ease;
        }

        .hero-swiper .swiper-pagination-bullet-active {
            background: #0B1554;
            opacity: 1;
            width: 30px;
            border-radius: 5px;
        }

        /* Galeri Thumbs Swiper */
        .gallery-thumbs .swiper-slide {
            opacity: 0.4;
            cursor: pointer;
            transition: opacity 0.3s ease;
        }

        .gallery-thumbs .swiper-slide-thumb-active {
            opacity: 1;
            border: 2px solid #0B1554;
        }

        /* İlan Swiper Customizations */
        .ilan-swiper .swiper-pagination-bullet {
            background: #fff;
            opacity: 0.6;
        }

        .ilan-swiper .swiper-pagination-bullet-active {
            background: #FFEA00;
            opacity: 1;
            width: 24px;
            border-radius: 4px;
        }

        /* Modern Header Styles - Updated */
        #navbar {
            transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
            /* padding-top: 1.5rem;
            padding-bottom: 1.5rem; */
        }

        /* Scrolled State */
        #navbar.scrolled {
            background-color: rgba(255, 255, 255, 0.98);
            backdrop-filter: blur(12px);
            box-shadow: 0 4px 30px rgba(0, 0, 0, 0.05);
            padding-top: 0.75rem;
            padding-bottom: 0.75rem;
        }

        /* Scrolled: Menü Linkleri */
        #navbar.scrolled .nav-link {
            color: #0B1554;
            /* Lacivert */
        }

        /* Transparent State (Başlangıç) */
        #navbar:not(.scrolled) {
            background-color: transparent;
            /* Hafif karanlık gradyan ekleyerek logoyu ve beyaz yazıları patlatıyoruz */
            background: linear-gradient(to bottom, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 100%);
        }

        #navbar:not(.scrolled) .nav-link {
            color: #ffffff;
            font-weight: 500;
            text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
        }

        /* Logo Ayarları - Her zaman orijinal renk */
        .logo-container {
            padding: 0.5rem 1.25rem;
            transition: all 0.3s ease;
        }

        #navbar.scrolled .logo-container {
            background-color: transparent;
            box-shadow: none;
            padding: 0;
        }

        .logo-img {
            height: 6rem;
            /* Büyük Logo */
            transition: all 0.3s ease;
            filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.1));
        }

        #navbar.scrolled .logo-img {
            height: 3.5rem;
            /* Scroll'da hafif küçülme */
        }

        /* Menü Link Efekti */
        .nav-link {
            position: relative;
            letter-spacing: 0.02em;
        }

        .nav-link::after {
            content: '';
            position: absolute;
            width: 0;
            height: 2px;
            bottom: -4px;
            left: 0;
            background-color: #FFEA00;
            transition: width 0.3s ease;
            box-shadow: 0 0 10px rgba(255, 234, 0, 0.5);
        }

        .nav-link:hover::after {
            width: 100%;
        }

        /* Özel Butonlar */
        .btn-360 {
            display: flex;
            align-items: center;
            gap: 0.5rem;
            padding: 0.5rem 1rem;
            border-radius: 999px;
            font-size: 0.875rem;
            font-weight: 600;
            transition: all 0.3s ease;
            backdrop-filter: blur(4px);
        }

        #navbar:not(.scrolled) .btn-360 {
            background-color: rgba(255, 255, 255, 0.2);
            color: white;
            border: 1px solid rgba(255, 255, 255, 0.4);
        }

        #navbar:not(.scrolled) .btn-360:hover {
            background-color: white;
            color: #0B1554;
        }

        #navbar.scrolled .btn-360 {
            background-color: #F1F5F9;
            color: #0B1554;
            border: 1px solid #E2E8F0;
        }

        #navbar.scrolled .btn-360:hover {
            background-color: #0B1554;
            color: white;
        }

        /* Scrolled: Devlet Teşviki Rozeti */
        #navbar.scrolled .badge-label {
            color: #D51B23;
            opacity: 1;
            text-shadow: none;
        }

        #navbar.scrolled .badge-value {
            color: #0B1554;
            text-shadow: none;
        }

        /* Mobil Menü Butonu */
        #navbar:not(.scrolled) .mobile-menu-btn {
            color: white;
        }

        #navbar.scrolled .mobile-menu-btn {
            color: #0B1554;
        }

        /* Image Gradients */
        .hero-gradient {
            background: linear-gradient(to bottom, rgba(11, 21, 84, 0.4) 0%, rgba(0, 0, 0, 0.2) 50%, rgba(0, 0, 0, 0.8) 100%);
        }

        .card-gradient {
            background: linear-gradient(to top, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0) 100%);
        }

        /* Hide element initially for GSAP */
        .gsap-hidden {
            opacity: 0;
            visibility: hidden;
        }

        body {
            overflow-x: hidden;
            background-color: #FAFAFA;
        }

        /* Mobile Menu */
        .mobile-overlay {
            opacity: 0;
            visibility: hidden;
            transition: all 0.3s ease;
        }

        .mobile-overlay.active {
            opacity: 1;
            visibility: visible;
        }

        .mobile-drawer {
            transform: translateX(100%);
            transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
        }

        .mobile-drawer.active {
            transform: translateX(0);
        }

        body.menu-open {
            overflow: hidden;
        }