/* Base styles and custom utilities */
    html {
        scroll-behavior: smooth;
    }

    body {
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }

    /* Custom scrollbar */
    ::-webkit-scrollbar {
        width: 6px;
    }
    ::-webkit-scrollbar-track {
        background: #0a1f3f;
    }
    ::-webkit-scrollbar-thumb {
        background: #c9a84c;
        border-radius: 3px;
    }
    ::-webkit-scrollbar-thumb:hover {
        background: #d4b962;
    }

    /* Nav link hover underline animation */
    .nav-link {
        position: relative;
        color: rgba(255,255,255,0.65);
        text-decoration: none;
        transition: color 0.3s ease;
    }
    .nav-link::after {
        content: '';
        position: absolute;
        bottom: -4px;
        left: 0;
        width: 0;
        height: 1px;
        background: #c9a84c;
        transition: width 0.4s cubic-bezier(0.22, 1, 0.36, 1);
    }
    .nav-link:hover {
        color: #c9a84c;
    }
    .nav-link:hover::after {
        width: 100%;
    }

    /* Mobile nav links */
    .mobile-nav-link {
        position: relative;
        color: rgba(255,255,255,0.7);
        text-decoration: none;
        transition: color 0.3s ease;
    }
    .mobile-nav-link:hover {
        color: #c9a84c;
    }

    /* Selection color */
    ::selection {
        background: rgba(201, 168, 76, 0.3);
        color: #fff;
    }

    /* Focus styles */
    a:focus-visible,
    button:focus-visible {
        outline: 1px solid #c9a84c;
        outline-offset: 4px;
    }

    /* Smooth image loading */
    img {
        image-rendering: crisp-edges;
        opacity: 1;
        transition: opacity 0.4s ease;
    }

    /* Subtle hover lift on cards */
    .group:hover {
        transform: translateY(-2px);
    }

    /* Prevent layout shift on images */
    .aspect-\[4\/5\] {
        aspect-ratio: 4/5;
    }
    .aspect-\[3\/4\] {
        aspect-ratio: 3/4;
    }