/* Custom styles for CurlCraft Studio */ @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&family=Playfair+Display:wght@700;800&display=swap'); html { scroll-behavior: smooth; } body { font-family: 'Poppins', sans-serif; } h1, h2, h3, h4, .font-display { font-family: 'Playfair Display', serif; } /* Custom scrollbar */ ::-webkit-scrollbar { width: 10px; } ::-webkit-scrollbar-track { background: #f1f1f1; } ::-webkit-scrollbar-thumb { background: linear-gradient(to bottom, #a855f7, #ec4899); border-radius: 5px; } ::-webkit-scrollbar-thumb:hover { background: linear-gradient(to bottom, #9333ea, #db2777); } /* Animation for hairstyle cards */ @keyframes float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } } .floating-card { animation: float 5s ease-in-out infinite; } /* Gradient text */ .gradient-text { background: linear-gradient(90deg, #a855f7, #ec4899, #f59e0b); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; } /* Custom button hover effect */ .btn-hover-effect { position: relative; overflow: hidden; z-index: 1; } .btn-hover-effect::before { content: ''; position: absolute; top: 0; left: -100%; width: 100%; height: 100%; background: linear-gradient(90deg, transparent, rgba(255,255,255,0.3), transparent); transition: left 0.7s; z-index: -1; } .btn-hover-effect:hover::before { left: 100%; }