:root {
    --brand-blue: #3b82f6;
    --brand-blue-dark: #2563eb;
    --brand-blue-light: #eff6ff;
    --text-slate: #1e293b;
    --text-muted: #64748b;
    --bg-main: #f8fafc;
    --glass: rgba(255, 255, 255, 0.98);
}

* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }

body { 
    background-color: var(--bg-main); 
    color: var(--text-slate); 
    scroll-behavior: smooth; 
    line-height: 1.5;
}

/* Glass Navigation */
.glass-nav {
    background: var(--glass);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(0,0,0,0.05);
}

/* Slideshow - Unchanged */
#slides-wrapper { 
    transition: transform 0.8s cubic-bezier(0.65, 0, 0.35, 1); 
}

/* Custom Select Styling */
#sortOrder {
    appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%233b82f6'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2.5' d='M19 9l-7 7-7-7'%3E%3C/path%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 1rem center;
    background-size: 1.2em;
}

/* Card Animations */
.animate-slide-up {
    animation: slideUp 0.6s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

@keyframes slideUp {
    from { opacity: 0; transform: translateY(30px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Interaction States - Optimized */
.product-card {
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
    outline: none;
}
.product-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.05);
    border-color: var(--brand-blue-light);
}
.product-card:focus-visible {
    outline: 3px solid var(--brand-blue);
    outline-offset: 2px;
}

/* Active Filter Buttons */
.brand-btn-active {
    background-color: var(--brand-blue) !important;
    color: white !important;
    border-color: var(--brand-blue) !important;
    box-shadow: 0 10px 15px -3px rgba(59, 130, 246, 0.2);
}

/* Accessibility: Focus Rings */
button:focus-visible, input:focus-visible, select:focus-visible {
    outline: 2px solid var(--brand-blue);
    outline-offset: 2px;
}

/* Hide scrollbars but keep functionality */
.no-scrollbar::-webkit-scrollbar { display: none; }
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 10px; }