/* Custom Styles for Simcoe Connect Hub */ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap'); * { margin: 0; padding: 0; box-sizing: border-box; } body { font-family: 'Inter', sans-serif; line-height: 1.6; } /* Smooth scrolling */ html { scroll-behavior: smooth; } /* Custom animations */ @keyframes fadeInUp { from { opacity: 0; transform: translateY(30px); } to { opacity: 1; transform: translateY(0); } } .fade-in-up { animation: fadeInUp 0.6s ease-out; } /* Gradient text */ .gradient-text { background: linear-gradient(135deg, #3b82f6 0%, #22c55e 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; } /* Floating animation */ @keyframes float { 0%, 100% { transform: translateY(0px); } 50% { transform: translateY(-10px); } } .float { animation: float 3s ease-in-out infinite; } /* Custom scrollbar */ ::-webkit-scrollbar { width: 8px; } ::-webkit-scrollbar-track { background: #f1f1f1; } ::-webkit-scrollbar-thumb { background: #3b82f6; border-radius: 4px; } ::-webkit-scrollbar-thumb:hover { background: #2563eb; } /* Loading states */ .loading-shimmer { background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%); background-size: 200% 100%; animation: shimmer 1.5s infinite; } @keyframes shimmer { 0% { background-position: -200% 0; } 100% { background-position: 200% 0; } } /* Responsive image containers */ .image-container { position: relative; overflow: hidden; border-radius: 12px; } .image-container img { transition: transform 0.3s ease; } .image-container:hover img { transform: scale(1.05); } /* Card hover effects */ .hover-lift { transition: transform 0.2s ease, box-shadow 0.2s ease; } .hover-lift:hover { transform: translateY(-4px); box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); } /* Custom button styles */ .btn-primary { background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%); transition: all 0.3s ease; } .btn-primary:hover { transform: translateY(-2px); box-shadow: 0 10px 25px -3px rgba(59, 130, 246, 0.4); } .btn-secondary { background: linear-gradient(135deg, #22c55e 0%, #16a34a 100%); transition: all 0.3s ease; } .btn-secondary:hover { transform: translateY(-2px); box-shadow: 0 10px 25px -3px rgba(34, 197, 94, 0.4); } /* Chat widget animations */ .chat-widget-enter { transform: translateY(100%); opacity: 0; } .chat-widget-enter-active { transform: translateY(0); opacity: 1; transition: all 0.3s ease; } /* Mobile menu transitions */ .mobile-menu-enter { transform: translateX(-100%); } .mobile-menu-enter-active { transform: translateX(0); transition: transform 0.3s ease; } /* Focus states for accessibility */ .focus-ring:focus { outline: 2px solid #3b82f6; outline-offset: 2px; } /* Print styles */ @media print { .no-print { display: none !important; } }