:root {
     --primary: #35D1D1;
     --secondary: #000;
     --white: #fff;
 }
 
 body {
     font-family: 'Poppins', sans-serif;
 }
 
 .collapse {
     visibility: visible !important;
 }
 
 .font-merriweather {
     font-family: 'Merriweather', serif;
 }
 
 .bg-primary-custom {
     background-color: var(--primary);
 }
 
 .text-primary-custom {
     color: var(--primary);
 }
 
 .hover-lift {
     transition: all 0.3s ease;
 }
 
 .hover-lift:hover {
     transform: translateY(-8px);
     box-shadow: 0 15px 40px rgba(53, 209, 209, 0.25);
 }
 
 .nav-link-custom {
     position: relative;
     color: #000;
     font-weight: 600;
     text-transform: uppercase;
     letter-spacing: 0.5px;
     padding: 0.5rem 0;
     transition: color 0.3s ease;
 }
 
 .nav-link-custom::after {
     content: '';
     position: absolute;
     bottom: 0;
     left: 0;
     width: 0;
     height: 3px;
     background: var(--primary);
     transition: width 0.3s ease;
 }
 
 .nav-link-custom:hover {
     color: var(--primary);
 }
 
 .nav-link-custom:hover::after {
     width: 100%;
 }
 
 .gradient-1 {
     background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
 }
 
 .gradient-2 {
     background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
 }
 
 .gradient-3 {
     background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
 }
 
 .gradient-4 {
     background: linear-gradient(135deg, #43e97b 0%, #38f9d7 100%);
 }
 
 .gradient-5 {
     background: linear-gradient(135deg, #fa709a 0%, #fee140 100%);
 }
 
 .gradient-6 {
     background: linear-gradient(135deg, #30cfd0 0%, #330867 100%);
 }
 
 .gradient-7 {
     background: linear-gradient(135deg, #a8edea 0%, #fed6e3 100%);
 }
 
 .gradient-8 {
     background: linear-gradient(135deg, #ff9a9e 0%, #fecfef 100%);
 }
 
 .blog-image {
     height: 250px;
     position: relative;
     overflow: hidden;
 }
 
 .page-header {
     background: linear-gradient(135deg, #000 0%, #1a1a1a 100%);
     padding: 4rem 0 3rem;
     margin-bottom: 3rem;
     position: relative;
     overflow: hidden;
 }
 
 .page-header::before {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     right: 0;
     bottom: 0;
     background: radial-gradient(circle at 30% 30%, rgba(53, 209, 209, 0.2) 0%, transparent 60%), radial-gradient(circle at 70% 70%, rgba(53, 209, 209, 0.2) 0%, transparent 60%);
     animation: pulse 20s ease-in-out infinite;
 }
 
 @keyframes pulse {
     0%,
     100% {
         opacity: 1;
     }
     50% {
         opacity: 0.7;
     }
 }
 
 .filter-btn {
     transition: all 0.3s ease;
     cursor: pointer;
     border: 2px solid transparent;
 }
 
 .filter-btn:hover,
 .filter-btn.active {
     background-color: var(--primary) !important;
     color: #000 !important;
     border-color: var(--primary);
     transform: translateY(-2px);
 }
 
 .search-box {
     border: 2px solid #e9ecef;
     transition: all 0.3s ease;
 }
 
 .search-box:focus {
     border-color: var(--primary);
     box-shadow: 0 0 0 0.2rem rgba(53, 209, 209, 0.25);
 }
 
 .blog-count {
     font-size: 0.9rem;
     color: #666;
 }