body {
    background-color: #0f1117;
    color: #efefef;
    font-family: 'Noto Sans SC', system-ui, sans-serif;
}

.text-gradient {
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
}

.card-hover {
    transition: all 0.3s ease;
}
.card-hover:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 40px rgba(184,134,40,0.15);
}

.header-fixed {
    position: fixed;
    width: 100%;
    top: 0;
    z-index: 50;
    background-color: rgba(15, 17, 23, 0.8);
    backdrop-filter: blur(12px);
    border-bottom: 1px solid #1f2937;
}

.nav-link {
    transition: color 0.2s ease;
}
.nav-link:hover {
    color: #b88628;
}


.btn-primary {
    background-color: #b88628;
    color: #000;
    font-weight: 500;
    border-radius: 6px;
    transition: all 0.2s;
}
.btn-primary:hover {
    background-color: #f59e0b;
}

.btn-outline {
    border: 1px solid rgba(184,134,40,0.6);
    border-radius: 6px;
    transition: all 0.2s;
}
.btn-outline:hover {
    border-color: #b88628;
}

.link-arrow {
    color: #b88628;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    transition: gap 0.2s ease;
}
.link-arrow:hover {
    gap: 0.75rem;
}


        tailwind.config = {
            theme: {
                extend: {
                    colors: {
                        gold: {
                            50: '#fffbeb',
                            200: '#fcd34d',
                            400: '#fbbf24',
                            600: '#d97706',
                            800: '#92400e',
                        },
                        dark: {
                            900: '#070707',
                            800: '#121212',
                            700: '#1f1f1f',
                        }
                    },
                    fontFamily: {
                        sans: ['Inter', 'system-ui', 'sans-serif'],
                        serif: ['Noto Serif SC', 'serif']
                    }
                }
            }
        }
    </script>
    <style type="text/tailwindcss">
        @layer utilities {
            .text-shadow-gold {
                text-shadow: 0 0 8px rgba(251,191,36,0.4);
            }
            .card-border {
                background: linear-gradient(135deg, #d97706, #6b4423);
                padding: 1px;
            }
            .bg-glass {
                background: rgba(18,18,18,0.85);
                backdrop-filter: blur(12px);
            }
            .hover-up {
                transition: all 0.3s ease;
            }
            .hover-up:hover {
                transform: translateY(-6px);
                box-shadow: 0 12px 30px rgba(217,119,6,0.25);
            }
        }
