<div class="cursor cursorNone"></div>
<div class="cursorDot cursorNone"></div>
<div class="corner-effect"></div>

<header>
    <div class="logo">
        <style>
            /* Brand name link */
            .navbar-brand,
            .footer-brand-name {
                font-size: 1.4rem;
                font-weight: 700;
                letter-spacing: 0.08em;
                text-transform: uppercase;
                color: #ffffff;
                text-decoration: none;
                transition: color 0.2s ease, opacity 0.2s ease;
            }

            /* Hover effect */
            .navbar-brand:hover,
            .footer-brand-name:hover {
                color: #0BA6DF; /* accent color */
                opacity: 0.9;
            }

            /* Optional: footer-specific tone */
            footer .footer-brand-name {
                font-size: 1.2rem;
                letter-spacing: 0.1em;
                color: #f1f1f1;
            }

            /* Mobile adjustment */
            @media (max-width: 768px) {
                .navbar-brand,
                .footer-brand-name {
                    font-size: 1.1rem;
                    letter-spacing: 0.06em;
                }
            }

        </style>
        {{-- <a href="{{ route('home') }}">
            <img src="{{ asset('assets/logo.png') }}" alt="Logo" />
        </a> --}}
        <a href="{{ route('home') }}" class="navbar-brand footer-brand-name">
            Digital Studio
        </a>


    </div>
    <nav>
        <ul style="padding-left: 0px;">
            <li>
                <a href="{{ route('home') }}" class="{{ request()->routeIs('home') ? 'active' : '' }}">
                    Home
                </a>
            </li>
            <li>
                <a href="{{ route('about') }}" class="{{ request()->routeIs('about') ? 'active' : '' }}">
                    About
                </a>
            </li>

            <!-- Services Dropdown -->
            <li class="dropdown {{ 
                request()->routeIs('services.*') || 
                request()->routeIs('services') ? 'active' : '' 
            }}">
                <a href="{{ route('services') }}" class="dropdown-toggle {{ 
                    request()->routeIs('services.*') || 
                    request()->routeIs('services') ? 'active' : '' 
                }}">
                    Services
                    <span class="arrow">&#9662;</span>
                </a>
                <ul class="dropdown-menu" style="padding-left: 0px;">
                    <li>
                        <a href="{{ route('services') }}" class="{{ request()->routeIs('services') ? 'active' : '' }}">
                            Web Development
                        </a>
                    </li>
                    <li>
                        <a href="{{ route('services.app') }}" class="{{ request()->routeIs('services.app') ? 'active' : '' }}">
                            Mobile Apps
                        </a>
                    </li>
                    <li>
                        <a href="{{ route('services.logo') }}" class="{{ request()->routeIs('services.logo') ? 'active' : '' }}">
                            Logo Design
                        </a>
                    </li>
                    <li>
                        <a href="{{ route('services.ecom') }}" class="{{ request()->routeIs('services.ecom') ? 'active' : '' }}">
                            Ecommerce Website
                        </a>
                    </li>
                    <li>
                        <a href="{{ route('services.brand') }}" class="{{ request()->routeIs('services.brand') ? 'active' : '' }}">
                            Branding
                        </a>
                    </li>
                    <li>
                        <a href="{{ route('services.smm') }}" class="{{ request()->routeIs('services.smm') ? 'active' : '' }}">
                            Social Media Marketing
                        </a>
                    </li>
                    <li>
                        <a href="{{ route('services.seo') }}" class="{{ request()->routeIs('services.seo') ? 'active' : '' }}">
                            Search Engine Optimization
                        </a>
                    </li>
                </ul>
            </li>

            <li>
                <a href="{{ route('packages') }}" class="{{ request()->routeIs('packages') ? 'active' : '' }}">
                    Packages
                </a>
            </li>
            <li>
                <a href="{{ route('portfolio') }}" class="{{ request()->routeIs('portfolio') ? 'active' : '' }}">
                    Portfolio
                </a>
            </li>
        </ul>
    </nav>
    <button class="menu">☰</button>
    <a class="contact-btn" href="{{ route('contact') }}">Contact Us</a>
</header>