/* Animations */ @keyframes pulse-slow { 0%, 100% { opacity: 0.3; } 50% { opacity: 0.7; } } .animate-pulse-slow { animation: pulse-slow 4s ease-in-out infinite; } .animation-delay-2s { animation-delay: 2s; } .font-outfit { font-family: 'Outfit', sans-serif; } .hide-scrollbar { -ms-overflow-style: none; scrollbar-width: none; } .hide-scrollbar::-webkit-scrollbar { display: none; } /* Provider / integration pills */ .pill { display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.5rem 1rem; border-radius: 0.75rem; border: 1px solid rgba(0,0,0,0.08); background: rgba(0,0,0,0.03); backdrop-filter: blur(12px); font-size: 0.8125rem; font-weight: 500; color: #374151; opacity: 0.7; transition: transform 0.2s, opacity 0.2s, border-color 0.3s, box-shadow 0.3s; } .dark .pill { border-color: rgba(255,255,255,0.08); background: rgba(255,255,255,0.04); color: #d1d5db; } .pill:hover { opacity: 1; transform: scale(1.05); border-color: rgba(249,115,22,0.4); box-shadow: 0 0 20px rgba(249,115,22,0.08); } .dark .pill:hover { border-color: rgba(251,146,60,0.4); box-shadow: 0 0 20px rgba(251,146,60,0.06); } .pill-icon { width: 1rem; height: 1rem; flex-shrink: 0; opacity: 0.8; } .dark .pill-icon { filter: invert(1); } .pill-icon-color { border-radius: 3px; filter: grayscale(1); opacity: 0.7; } .dark .pill-icon-color { filter: grayscale(1) invert(1); } .pill-badge { font-size: 0.5625rem; font-weight: 700; text-transform: uppercase; padding: 0.125rem 0.375rem; border-radius: 9999px; } /* Scroll-reveal for pill groups */ [data-reveal] { opacity: 0; transform: translateY(16px); transition: opacity 0.5s ease-out, transform 0.5s ease-out; } [data-reveal].revealed { opacity: 1; transform: translateY(0); }