File size: 1,372 Bytes
884b0e4 a0df41f 884b0e4 a0df41f 884b0e4 a0df41f 884b0e4 a0df41f 884b0e4 a0df41f 884b0e4 a0df41f 884b0e4 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 |
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');
body {
font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}
.grain-bg {
background:
radial-gradient(ellipse at 20% 50%, rgba(98, 99, 68, 0.15) 0%, transparent 50%),
radial-gradient(ellipse at 80% 50%, rgba(98, 99, 68, 0.15) 0%, transparent 50%),
url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)' opacity='0.05'/%3E%3C/svg%3E"),
#000000;
}
/* Smooth scroll behavior */
html {
scroll-behavior: smooth;
}
/* Custom selection color */
::selection {
background: #626344;
color: white;
}
/* Custom scrollbar */
::-webkit-scrollbar {
width: 8px;
}
::-webkit-scrollbar-track {
background: #111;
}
::-webkit-scrollbar-thumb {
background: #626344;
border-radius: 4px;
}
/* Animation for product cards */
@keyframes fadeIn {
from { opacity: 0; transform: translateY(10px); }
to { opacity: 1; transform: translateY(0); }
}
product-card {
animation: fadeIn 0.6s ease-out forwards;
animation-delay: calc(var(--order) * 0.1s);
} |