/* ===== DARK LUXURY THEME - Premium Gold & Black ===== */

/* ===== GOLD COLOR PALETTE =====
   Primary Gold: #d4af37
   Light Gold: #f4e4bc
   Dark Gold: #b8962e
   Background: #0a0a0a
   Card BG: rgba(20, 20, 20, 0.9)
===== */

/* Yellow/Gold Tailwind Overrides - Make yellow classes use gold tones */
.text-yellow-300 { color: #f4e4bc !important; }
.text-yellow-400 { color: #d4af37 !important; }
.text-yellow-500 { color: #b8962e !important; }
.text-yellow-600 { color: #a07d25 !important; }
.text-yellow-700 { color: #8a6b1f !important; }
.bg-yellow-400 { background-color: rgba(212, 175, 55, 0.2) !important; }
.bg-yellow-500 { background-color: rgba(212, 175, 55, 0.15) !important; }
.bg-yellow-600 { background-color: rgba(184, 150, 46, 0.15) !important; }
.border-yellow-400 { border-color: rgba(212, 175, 55, 0.5) !important; }
.border-yellow-500 { border-color: rgba(212, 175, 55, 0.4) !important; }
.border-yellow-600 { border-color: rgba(184, 150, 46, 0.4) !important; }

/* Gold gradient backgrounds */
.from-yellow-500 { --tw-gradient-from: #d4af37 !important; }
.from-yellow-600 { --tw-gradient-from: #b8962e !important; }
.from-yellow-700 { --tw-gradient-from: #a07d25 !important; }
.to-yellow-500 { --tw-gradient-to: #d4af37 !important; }
.to-yellow-600 { --tw-gradient-to: #b8962e !important; }
.to-yellow-700 { --tw-gradient-to: #a07d25 !important; }
.via-yellow-500 { --tw-gradient-via: #d4af37 !important; }

/* Gold color classes */
.text-gold-300 { color: #f4e4bc !important; }
.text-gold-400 { color: #d4af37 !important; }
.text-gold-500 { color: #b8962e !important; }
.bg-gold-500 { background-color: rgba(212, 175, 55, 0.15) !important; }
.border-gold-500 { border-color: rgba(212, 175, 55, 0.4) !important; }
.from-gold-500 { --tw-gradient-from: #d4af37 !important; }
.to-gold-500 { --tw-gradient-to: #d4af37 !important; }

/* Green to Gold-Green for status indicators (keeping hierarchy) */
.text-green-300 { color: #9cd474 !important; }
.text-green-400 { color: #7ec850 !important; }
.text-green-500 { color: #5cb02e !important; }
.bg-green-500 { background-color: rgba(94, 176, 46, 0.15) !important; }
.border-green-500 { border-color: rgba(94, 176, 46, 0.4) !important; }
.from-green-500 { --tw-gradient-from: #7ec850 !important; }
.to-emerald-500 { --tw-gradient-to: #5cb02e !important; }

/* Emerald to gold-emerald */
.text-emerald-400, .text-emerald-500 { color: #7ec850 !important; }
.bg-emerald-500 { background-color: rgba(94, 176, 46, 0.15) !important; }

/* Orange for firmware/warning - warm gold tone */
.text-orange-300 { color: #fbbf24 !important; }
.text-orange-400 { color: #f59e0b !important; }
.text-orange-500 { color: #d97706 !important; }
.bg-orange-500 { background-color: rgba(217, 119, 6, 0.15) !important; }
.border-orange-500 { border-color: rgba(217, 119, 6, 0.4) !important; }
.from-orange-500 { --tw-gradient-from: #f59e0b !important; }
.to-red-500, .to-red-600 { --tw-gradient-to: #dc2626 !important; }

/* Custom Scrollbar - Gold Theme */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.3);
    border-radius: 0;
}

::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, 
        rgba(212, 175, 55, 0.6) 0%, 
        rgba(244, 228, 188, 0.8) 50%, 
        rgba(212, 175, 55, 0.6) 100%);
    border-radius: 0;
    border: 1px solid rgba(212, 175, 55, 0.3);
    box-shadow: 
        0 0 10px rgba(212, 175, 55, 0.3),
        inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, 
        rgba(212, 175, 55, 0.8) 0%, 
        rgba(244, 228, 188, 1) 50%, 
        rgba(212, 175, 55, 0.8) 100%);
    box-shadow: 
        0 0 15px rgba(212, 175, 55, 0.5),
        inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

::-webkit-scrollbar-thumb:active {
    background: linear-gradient(180deg, 
        rgba(212, 175, 55, 1) 0%, 
        rgba(244, 228, 188, 1) 50%, 
        rgba(212, 175, 55, 1) 100%);
    box-shadow: 
        0 0 20px rgba(212, 175, 55, 0.7),
        inset 0 1px 0 rgba(255, 255, 255, 0.3);
}

/* Base Body - Dark Luxury Background */
body {
    background: 
        radial-gradient(ellipse at 20% 20%, rgba(212, 175, 55, 0.05) 0%, transparent 50%),
        radial-gradient(ellipse at 80% 80%, rgba(212, 175, 55, 0.03) 0%, transparent 50%),
        radial-gradient(ellipse at 50% 50%, rgba(30, 30, 30, 1) 0%, #0a0a0a 100%) !important;
    background-attachment: fixed !important;
}

/* Gold Floating Particles Effect */
body::before {
    content: '' !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    background-image: 
        radial-gradient(circle at 25% 25%, rgba(212, 175, 55, 0.15) 1px, transparent 1px),
        radial-gradient(circle at 75% 75%, rgba(244, 228, 188, 0.1) 1px, transparent 1px),
        radial-gradient(circle at 50% 50%, rgba(212, 175, 55, 0.12) 1px, transparent 1px) !important;
    background-size: 100px 100px, 150px 150px, 200px 200px !important;
    pointer-events: none !important;
    z-index: 1 !important;
    animation: goldParticles 30s linear infinite !important;
    opacity: 0.5 !important;
}

@keyframes goldParticles {
    0% { transform: translateX(0) translateY(0); }
    25% { transform: translateX(-10px) translateY(-10px); }
    50% { transform: translateX(5px) translateY(-5px); }
    75% { transform: translateX(-5px) translateY(10px); }
    100% { transform: translateX(0) translateY(0); }
}

/* Gold Glow Effect */
body::after {
    content: '' !important;
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 800px !important;
    height: 800px !important;
    background: radial-gradient(circle, rgba(212, 175, 55, 0.06) 0%, rgba(212, 175, 55, 0.02) 40%, transparent 70%) !important;
    pointer-events: none !important;
    z-index: 0 !important;
    animation: goldGlow 8s ease-in-out infinite alternate !important;
}

@keyframes goldGlow {
    0% { 
        transform: translate(-50%, -50%) scale(1);
        opacity: 0.4;
    }
    100% { 
        transform: translate(-50%, -50%) scale(1.2);
        opacity: 0.7;
    }
}

/* Light Beams */
.luxury-light-beams {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    pointer-events: none;
    z-index: 1;
    overflow: hidden;
}

.luxury-light-beams::before,
.luxury-light-beams::after {
    content: '';
    position: absolute;
    top: -50%;
    width: 1px;
    height: 200%;
    background: linear-gradient(180deg, transparent, rgba(212, 175, 55, 0.1), transparent);
    animation: beamMove 20s linear infinite;
}

.luxury-light-beams::before {
    left: 30%;
    animation-delay: 0s;
}

.luxury-light-beams::after {
    left: 70%;
    animation-delay: -10s;
}

@keyframes beamMove {
    0% { transform: translateX(-100px) skewX(-15deg); opacity: 0; }
    50% { opacity: 1; }
    100% { transform: translateX(100px) skewX(-15deg); opacity: 0; }
}

/* Override Purple Colors with Gold */
.text-purple-400, .text-purple-500, .text-purple-600,
.text-violet-400, .text-violet-500, .text-violet-600 {
    color: #d4af37 !important;
}

.bg-purple-500, .bg-purple-600, .bg-purple-700,
.bg-violet-500, .bg-violet-600, .bg-violet-700 {
    background: linear-gradient(135deg, #d4af37 0%, #b8962e 100%) !important;
}

.border-purple-400, .border-purple-500, .border-purple-600,
.border-violet-400, .border-violet-500, .border-violet-600 {
    border-color: rgba(212, 175, 55, 0.5) !important;
}

/* Glass Cards - Gold Theme */
.glass-card {
    background: rgba(20, 20, 20, 0.85) !important;
    backdrop-filter: blur(20px) !important;
    border: 1px solid rgba(212, 175, 55, 0.2) !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4) !important;
}

.glass-card:hover {
    box-shadow: 0 8px 25px rgba(212, 175, 55, 0.15) !important;
    border-color: rgba(212, 175, 55, 0.4) !important;
}

/* Navigation Links - Gold Theme */
.nav-link {
    background: rgba(20, 20, 20, 0.8) !important;
    border: 1px solid rgba(212, 175, 55, 0.2) !important;
}

.nav-link:hover {
    background: rgba(212, 175, 55, 0.1) !important;
    border-color: rgba(212, 175, 55, 0.5) !important;
    box-shadow: 0 6px 20px rgba(212, 175, 55, 0.2) !important;
}

/* Product Cards - Gold Theme */
.product-card {
    background: linear-gradient(135deg, rgba(20, 20, 20, 0.9) 0%, rgba(212, 175, 55, 0.05) 100%) !important;
    border: 1px solid rgba(212, 175, 55, 0.2) !important;
}

.product-card:hover {
    box-shadow: 0 8px 25px rgba(212, 175, 55, 0.15) !important;
    border-color: rgba(212, 175, 55, 0.4) !important;
}

/* Buttons - Gold Theme */
.btn-primary,
.header-btn-primary {
    background: linear-gradient(135deg, #d4af37 0%, #b8962e 50%, #d4af37 100%) !important;
    border: 1px solid rgba(212, 175, 55, 0.4) !important;
    box-shadow: 0 4px 20px rgba(212, 175, 55, 0.3) !important;
    color: #0a0a0a !important;
    font-weight: 600 !important;
}

.btn-primary:hover,
.header-btn-primary:hover {
    background: linear-gradient(135deg, #e5c048 0%, #d4af37 50%, #b8962e 100%) !important;
    box-shadow: 0 8px 30px rgba(212, 175, 55, 0.5) !important;
}

.header-btn {
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.1) 0%, rgba(212, 175, 55, 0.05) 100%) !important;
    border: 1px solid rgba(212, 175, 55, 0.3) !important;
}

.header-btn:hover {
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.2) 0%, rgba(212, 175, 55, 0.1) 100%) !important;
    border-color: rgba(212, 175, 55, 0.6) !important;
    box-shadow: 0 8px 25px rgba(212, 175, 55, 0.2) !important;
}

/* Text Gradient - Gold */
.text-gradient {
    background: linear-gradient(135deg, #d4af37 0%, #f4e4bc 50%, #d4af37 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

/* Badge styles */
.limited-badge {
    background: linear-gradient(135deg, #d4af37 0%, #b8962e 100%) !important;
    color: #0a0a0a !important;
    box-shadow: 0 0 10px rgba(212, 175, 55, 0.4), 0 0 20px rgba(212, 175, 55, 0.2) !important;
}

/* Section backgrounds */
section:nth-child(even) {
    background: linear-gradient(180deg, 
        transparent 0%, 
        rgba(212, 175, 55, 0.02) 20%, 
        rgba(212, 175, 55, 0.03) 50%, 
        rgba(212, 175, 55, 0.02) 80%, 
        transparent 100%) !important;
}

section:nth-child(odd) {
    background: linear-gradient(180deg, 
        transparent 0%, 
        rgba(244, 228, 188, 0.02) 20%, 
        rgba(244, 228, 188, 0.03) 50%, 
        rgba(244, 228, 188, 0.02) 80%, 
        transparent 100%) !important;
}

/* Footer styling */
footer {
    border-top: 1px solid rgba(212, 175, 55, 0.2) !important;
}

/* Links */
a:not(.btn):not(.nav-link):not(.header-btn) {
    color: #d4af37;
}

a:not(.btn):not(.nav-link):not(.header-btn):hover {
    color: #f4e4bc;
}

/* Form inputs */
input, textarea, select {
    background: rgba(20, 20, 20, 0.8) !important;
    border-color: rgba(212, 175, 55, 0.3) !important;
}

input:focus, textarea:focus, select:focus {
    border-color: rgba(212, 175, 55, 0.6) !important;
    box-shadow: 0 0 15px rgba(212, 175, 55, 0.2) !important;
}

/* Hover effects for icons */
.fa-discord:hover, .fa-telegram:hover {
    color: #d4af37 !important;
}

/* Ring/Border colors */
.ring-purple-500, .ring-violet-500 {
    --tw-ring-color: rgba(212, 175, 55, 0.5) !important;
}

.focus\:ring-purple-500:focus, .focus\:ring-violet-500:focus {
    --tw-ring-color: rgba(212, 175, 55, 0.5) !important;
}

/* Gradient overlays */
.from-purple-500, .from-violet-500 {
    --tw-gradient-from: #d4af37 !important;
}

.to-purple-600, .to-violet-600 {
    --tw-gradient-to: #b8962e !important;
}

.via-purple-500, .via-violet-500 {
    --tw-gradient-via: #d4af37 !important;
}

/* Hover states */
.hover\:text-purple-400:hover, .hover\:text-violet-400:hover {
    color: #d4af37 !important;
}

.hover\:bg-purple-500:hover, .hover\:bg-violet-500:hover {
    background-color: rgba(212, 175, 55, 0.2) !important;
}

.hover\:border-purple-500:hover, .hover\:border-violet-500:hover {
    border-color: rgba(212, 175, 55, 0.5) !important;
}

/* Glow effects */
.glow-purple, .glow-violet {
    box-shadow: 0 0 20px rgba(212, 175, 55, 0.3) !important;
}

/* Progress bars */
.bg-gradient-to-r.from-purple-500, 
.bg-gradient-to-r.from-violet-500 {
    background: linear-gradient(90deg, #d4af37, #f4e4bc) !important;
}

/* Corner accents - Luxury style */
.luxury-corner {
    position: fixed;
    width: 60px;
    height: 60px;
    border-color: rgba(212, 175, 55, 0.3);
    border-style: solid;
    pointer-events: none;
    z-index: 100;
}

.luxury-corner-tl { top: 20px; left: 20px; border-width: 2px 0 0 2px; }
.luxury-corner-tr { top: 20px; right: 20px; border-width: 2px 2px 0 0; }
.luxury-corner-bl { bottom: 20px; left: 20px; border-width: 0 0 2px 2px; }
.luxury-corner-br { bottom: 20px; right: 20px; border-width: 0 2px 2px 0; }

/* ===== EXTENDED COLOR OVERRIDES - Purple/Pink to Gold ===== */

/* All purple shades - text */
.text-purple-300, .text-purple-400, .text-purple-500, .text-purple-600, .text-purple-700,
.text-violet-300, .text-violet-400, .text-violet-500, .text-violet-600, .text-violet-700,
.text-fuchsia-300, .text-fuchsia-400, .text-fuchsia-500, .text-fuchsia-600,
.text-pink-300, .text-pink-400, .text-pink-500, .text-pink-600 {
    color: #d4af37 !important;
}

/* All purple shades - backgrounds */
.bg-purple-400, .bg-purple-500, .bg-purple-600, .bg-purple-700, .bg-purple-800, .bg-purple-900,
.bg-violet-400, .bg-violet-500, .bg-violet-600, .bg-violet-700, .bg-violet-800, .bg-violet-900,
.bg-fuchsia-500, .bg-fuchsia-600, .bg-fuchsia-700,
.bg-pink-500, .bg-pink-600, .bg-pink-700 {
    background: linear-gradient(135deg, #d4af37 0%, #b8962e 100%) !important;
}

/* All purple shades - borders */
.border-purple-300, .border-purple-400, .border-purple-500, .border-purple-600, .border-purple-700,
.border-violet-300, .border-violet-400, .border-violet-500, .border-violet-600, .border-violet-700,
.border-fuchsia-400, .border-fuchsia-500, .border-fuchsia-600,
.border-pink-400, .border-pink-500, .border-pink-600 {
    border-color: rgba(212, 175, 55, 0.5) !important;
}

/* Blue colors - text (convert to light gold) */
.text-blue-300, .text-blue-400, .text-blue-500, .text-blue-600 {
    color: #f4e4bc !important;
}

/* Blue colors - backgrounds */
.bg-blue-500, .bg-blue-600, .bg-blue-700 {
    background: linear-gradient(135deg, #d4af37 0%, #b8962e 100%) !important;
}

/* Blue borders */
.border-blue-400, .border-blue-500, .border-blue-600 {
    border-color: rgba(212, 175, 55, 0.5) !important;
}

/* Inline style overrides for hex colors commonly used */
[style*="#a855f7"], [style*="#8b5cf6"], [style*="#7c3aed"], 
[style*="#6366f1"], [style*="#ec4899"], [style*="#d946ef"] {
    color: #d4af37 !important;
}

/* Shadow/glow color overrides */
.shadow-purple-500, .shadow-violet-500, .shadow-blue-500 {
    --tw-shadow-color: rgba(212, 175, 55, 0.3) !important;
}

/* Unified Header - Gold Theme */
.unified-header {
    background: linear-gradient(135deg, 
        rgba(10, 10, 10, 0.95) 0%, 
        rgba(20, 20, 20, 0.95) 50%,
        rgba(30, 30, 30, 0.95) 100%) !important;
    border-bottom: 1px solid rgba(212, 175, 55, 0.3) !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5), 0 0 30px rgba(212, 175, 55, 0.1) !important;
}

/* Logo text gradient */
.logo-text, .nav-logo .logo-text {
    background: linear-gradient(135deg, #d4af37 0%, #f4e4bc 50%, #d4af37 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

/* Status badges */
.status-badge, .badge {
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.2) 0%, rgba(212, 175, 55, 0.1) 100%) !important;
    border: 1px solid rgba(212, 175, 55, 0.4) !important;
    color: #d4af37 !important;
}

/* Price styling */
.price, .price-tag, [class*="price"] {
    color: #d4af37 !important;
    text-shadow: 0 0 10px rgba(212, 175, 55, 0.3) !important;
}

/* Feature icons */
.feature-icon, [class*="feature"] i, .fa {
    color: #d4af37 !important;
}

/* Dividers */
hr, .divider {
    border-color: rgba(212, 175, 55, 0.2) !important;
}

/* Tables */
table {
    border-color: rgba(212, 175, 55, 0.2) !important;
}

th {
    background: rgba(212, 175, 55, 0.1) !important;
    border-color: rgba(212, 175, 55, 0.3) !important;
    color: #d4af37 !important;
}

td {
    border-color: rgba(212, 175, 55, 0.15) !important;
}

tr:hover {
    background: rgba(212, 175, 55, 0.05) !important;
}

/* Code blocks */
code, pre {
    background: rgba(20, 20, 20, 0.9) !important;
    border: 1px solid rgba(212, 175, 55, 0.2) !important;
    color: #f4e4bc !important;
}

/* Alerts and notifications */
.alert, .notification, [class*="alert"], [class*="notification"] {
    border-color: rgba(212, 175, 55, 0.3) !important;
}

/* Selection highlight */
::selection {
    background: rgba(212, 175, 55, 0.3) !important;
    color: #fff !important;
}

/* Placeholder text */
::placeholder {
    color: rgba(212, 175, 55, 0.4) !important;
}

/* Dropdown menus */
.dropdown, [class*="dropdown"], #language-dropdown {
    background: rgba(15, 15, 15, 0.95) !important;
    border: 1px solid rgba(212, 175, 55, 0.3) !important;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.5), 0 0 20px rgba(212, 175, 55, 0.1) !important;
}

.dropdown button:hover, #language-dropdown button:hover {
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.2) 0%, rgba(212, 175, 55, 0.1) 100%) !important;
}

/* Loading spinners */
.spinner, .loading, [class*="spinner"], [class*="loading"] {
    border-color: rgba(212, 175, 55, 0.2) !important;
    border-top-color: #d4af37 !important;
}

/* Accordion/Expandable items */
details {
    border-color: rgba(212, 175, 55, 0.2) !important;
}

details[open] summary {
    background: rgba(212, 175, 55, 0.1) !important;
}

/* Tags */
.tag, [class*="tag"] {
    background: rgba(212, 175, 55, 0.15) !important;
    border: 1px solid rgba(212, 175, 55, 0.3) !important;
    color: #d4af37 !important;
}

/* Tooltips */
[class*="tooltip"] {
    background: rgba(10, 10, 10, 0.95) !important;
    border: 1px solid rgba(212, 175, 55, 0.3) !important;
    color: #f4e4bc !important;
}

/* Modal/Dialog */
.modal, .dialog, [class*="modal"], [class*="dialog"] {
    background: rgba(15, 15, 15, 0.98) !important;
    border: 1px solid rgba(212, 175, 55, 0.3) !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.7), 0 0 40px rgba(212, 175, 55, 0.15) !important;
}

/* Overlay/Backdrop */
.overlay, .backdrop, [class*="overlay"], [class*="backdrop"] {
    background: rgba(0, 0, 0, 0.85) !important;
}

/* Pagination */
.pagination a, .pagination button {
    border-color: rgba(212, 175, 55, 0.3) !important;
}

.pagination a:hover, .pagination button:hover,
.pagination .active {
    background: linear-gradient(135deg, #d4af37 0%, #b8962e 100%) !important;
    color: #0a0a0a !important;
}

/* Accordion headers */
summary, .accordion-header {
    border-color: rgba(212, 175, 55, 0.2) !important;
}

summary:hover, .accordion-header:hover {
    background: rgba(212, 175, 55, 0.1) !important;
}

/* Progress indicators */
progress::-webkit-progress-bar {
    background: rgba(20, 20, 20, 0.8) !important;
}

progress::-webkit-progress-value {
    background: linear-gradient(90deg, #d4af37, #f4e4bc) !important;
}

/* Range inputs */
input[type="range"]::-webkit-slider-thumb {
    background: #d4af37 !important;
    box-shadow: 0 0 10px rgba(212, 175, 55, 0.5) !important;
}

input[type="range"]::-webkit-slider-runnable-track {
    background: rgba(212, 175, 55, 0.3) !important;
}

/* Checkbox/Radio custom */
input[type="checkbox"]:checked, 
input[type="radio"]:checked {
    background-color: #d4af37 !important;
    border-color: #d4af37 !important;
}

/* Focus states */
*:focus {
    outline-color: rgba(212, 175, 55, 0.5) !important;
}

/* Active states */
.active, [class*="active"] {
    border-color: rgba(212, 175, 55, 0.5) !important;
}

/* Disabled states */
:disabled, [disabled], .disabled {
    opacity: 0.5 !important;
    border-color: rgba(212, 175, 55, 0.2) !important;
}

/* Hover state for interactive elements */
button:hover, .btn:hover, [class*="btn"]:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(212, 175, 55, 0.2) !important;
}

/* Z-index fix for decorations */
.luxury-light-beams,
.luxury-corner {
    pointer-events: none;
}

/* Ensure content is above decorations */
header, main, footer, section, nav {
    position: relative;
    z-index: 10;
}

/* ===== ENHANCED CARD STYLES ===== */
.product-hub-card {
    background: linear-gradient(135deg, rgba(20, 20, 20, 0.95) 0%, rgba(30, 30, 30, 0.9) 100%) !important;
    border: 1px solid rgba(212, 175, 55, 0.15) !important;
    transition: all 0.3s ease !important;
}

.product-hub-card:hover {
    border-color: rgba(212, 175, 55, 0.4) !important;
    box-shadow: 0 10px 40px rgba(212, 175, 55, 0.15), 0 0 20px rgba(212, 175, 55, 0.1) !important;
    transform: translateY(-5px) !important;
}

/* Explore buttons */
.explore-button {
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.1) 0%, rgba(212, 175, 55, 0.05) 100%) !important;
    border: 1px solid rgba(212, 175, 55, 0.3) !important;
    transition: all 0.3s ease !important;
}

.explore-button:hover {
    background: linear-gradient(135deg, #d4af37 0%, #b8962e 100%) !important;
    color: #0a0a0a !important;
    border-color: #d4af37 !important;
    box-shadow: 0 5px 20px rgba(212, 175, 55, 0.4) !important;
}

.explore-button:hover span,
.explore-button:hover i {
    color: #0a0a0a !important;
}

/* ===== ICON WRAPPERS ===== */
.icon-wrapper {
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.2) 0%, rgba(212, 175, 55, 0.05) 100%);
    border: 1px solid rgba(212, 175, 55, 0.3);
    color: #d4af37;
}

/* ===== WHY CARDS ===== */
.why-card {
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.08) 0%, rgba(20, 20, 35, 0.95) 100%) !important;
    border: 1px solid rgba(212, 175, 55, 0.15) !important;
    transition: all 0.3s ease !important;
}

.why-card:hover {
    border-color: rgba(212, 175, 55, 0.4) !important;
    transform: translateY(-5px) !important;
    box-shadow: 0 15px 40px rgba(212, 175, 55, 0.15) !important;
}

/* ===== REVIEW CARDS ===== */
.review-card {
    background: linear-gradient(135deg, rgba(20, 20, 20, 0.95) 0%, rgba(30, 30, 30, 0.9) 100%) !important;
    border: 1px solid rgba(212, 175, 55, 0.15) !important;
}

/* ===== HEADER IMPROVEMENTS ===== */
.unified-header {
    background: linear-gradient(180deg, rgba(10, 10, 10, 0.98) 0%, rgba(15, 15, 15, 0.95) 100%) !important;
    border-bottom: 1px solid rgba(212, 175, 55, 0.2) !important;
    backdrop-filter: blur(20px) !important;
}

.unified-header-btn {
    background: rgba(212, 175, 55, 0.08) !important;
    border: 1px solid rgba(212, 175, 55, 0.2) !important;
    transition: all 0.3s ease !important;
}

.unified-header-btn:hover {
    background: rgba(212, 175, 55, 0.15) !important;
    border-color: rgba(212, 175, 55, 0.5) !important;
    box-shadow: 0 4px 15px rgba(212, 175, 55, 0.2) !important;
}

/* ===== FOOTER ===== */
footer {
    background: linear-gradient(180deg, rgba(10, 10, 10, 0.98) 0%, rgba(5, 5, 5, 1) 100%) !important;
    border-top: 1px solid rgba(212, 175, 55, 0.15) !important;
}

/* ===== GLASS MORPHISM ===== */
.glass-card, .backdrop-blur-lg {
    background: rgba(15, 15, 15, 0.9) !important;
    backdrop-filter: blur(20px) !important;
    border: 1px solid rgba(212, 175, 55, 0.15) !important;
}

/* ===== HERO SECTION ===== */
.hero-title {
    background: linear-gradient(135deg, #f4e4bc 0%, #d4af37 50%, #b8962e 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

/* ===== ANIMATIONS ===== */
@keyframes goldShimmer {
    0% { background-position: -200% center; }
    100% { background-position: 200% center; }
}

.gold-shimmer {
    background: linear-gradient(90deg, #d4af37 0%, #f4e4bc 50%, #d4af37 100%);
    background-size: 200% auto;
    animation: goldShimmer 3s linear infinite;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* ===== SOCIAL ICONS ===== */
.fa-discord:hover { color: #d4af37 !important; }
.fa-telegram:hover { color: #d4af37 !important; }
.fa-twitter:hover { color: #d4af37 !important; }

/* ===== RESPONSIVE IMPROVEMENTS ===== */
@media (max-width: 768px) {
    .luxury-corner { display: none; }
    .luxury-light-beams { opacity: 0.3; }
}

/* ===== ENHANCED BUTTON STYLES ===== */
.bg-yellow-600, .bg-yellow-700 {
    background: linear-gradient(135deg, #d4af37 0%, #b8962e 100%) !important;
    border: 1px solid rgba(244, 228, 188, 0.3) !important;
    box-shadow: 0 4px 15px rgba(212, 175, 55, 0.3) !important;
}

.bg-yellow-600:hover, .bg-yellow-700:hover,
.hover\:bg-yellow-700:hover {
    background: linear-gradient(135deg, #f4e4bc 0%, #d4af37 100%) !important;
    box-shadow: 0 6px 25px rgba(212, 175, 55, 0.5) !important;
    transform: translateY(-2px);
}

/* ===== FORM INPUT GOLD FOCUS ===== */
input:focus, textarea:focus, select:focus {
    outline: none !important;
    border-color: rgba(212, 175, 55, 0.6) !important;
    box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.2), 0 0 15px rgba(212, 175, 55, 0.15) !important;
}

.focus\:ring-yellow-500:focus {
    --tw-ring-color: rgba(212, 175, 55, 0.5) !important;
    box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.3) !important;
}

/* ===== GRADIENT TEXT ENHANCEMENTS ===== */
.bg-gradient-to-r.from-yellow-500,
.bg-gradient-to-r.from-yellow-400,
.bg-gradient-to-r.from-gold-400 {
    background: linear-gradient(90deg, #f4e4bc 0%, #d4af37 50%, #b8962e 100%) !important;
}

.text-transparent.bg-clip-text {
    -webkit-background-clip: text !important;
    background-clip: text !important;
}

/* ===== SHADOW UTILITIES GOLD ===== */
.shadow-yellow-500\/25, .hover\:shadow-yellow-500\/25:hover {
    box-shadow: 0 10px 40px rgba(212, 175, 55, 0.25) !important;
}

.shadow-lg {
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.4), 0 0 10px rgba(212, 175, 55, 0.1) !important;
}

/* ===== LINK HOVER GOLD ===== */
a:not([class*="bg-"]):hover {
    color: #f4e4bc !important;
    text-shadow: 0 0 10px rgba(212, 175, 55, 0.4);
}

/* ===== BORDER GOLD HIGHLIGHTS ===== */
.border-yellow-400, .border-yellow-500 {
    border-color: rgba(212, 175, 55, 0.5) !important;
}

.border-yellow-400\/30 {
    border-color: rgba(212, 175, 55, 0.3) !important;
}

/* ===== PRICE TAG GOLD ===== */
.text-4xl.font-bold, .text-5xl.font-bold {
    color: #f4e4bc !important;
    text-shadow: 0 0 20px rgba(212, 175, 55, 0.4) !important;
}

/* ===== BADGE/TAG GOLD ===== */
.rounded-full.bg-yellow-500, .rounded-full.bg-yellow-600 {
    background: linear-gradient(135deg, #d4af37 0%, #b8962e 100%) !important;
    color: #0a0a0a !important;
    font-weight: 600 !important;
}

/* ===== ICON GOLD GLOW ===== */
.fa-crown, .fa-gem, .fa-star {
    color: #d4af37 !important;
    filter: drop-shadow(0 0 8px rgba(212, 175, 55, 0.5)) !important;
}

/* ===== LOADING/PULSE ANIMATION GOLD ===== */
@keyframes goldPulse {
    0%, 100% { 
        box-shadow: 0 0 0 0 rgba(212, 175, 55, 0.4);
    }
    50% { 
        box-shadow: 0 0 0 10px rgba(212, 175, 55, 0);
    }
}

.animate-pulse {
    animation: goldPulse 2s ease-in-out infinite !important;
}

/* ===== TABLE/GRID GOLD ACCENTS ===== */
th, thead {
    background: rgba(212, 175, 55, 0.1) !important;
    border-bottom: 2px solid rgba(212, 175, 55, 0.3) !important;
    color: #f4e4bc !important;
}

tr:hover {
    background: rgba(212, 175, 55, 0.05) !important;
}

/* ===== SELECTION HIGHLIGHT GOLD ===== */
::selection {
    background: rgba(212, 175, 55, 0.4) !important;
    color: #0a0a0a !important;
}

::-moz-selection {
    background: rgba(212, 175, 55, 0.4) !important;
    color: #0a0a0a !important;
}
