body { font-family: 'Inter', sans-serif; overflow-x: hidden; }
        .serif-italic { font-family: 'Playfair Display', serif; font-style: italic; }
        .bg-acid-red { background-color: #EE3640; }
        .text-acid-red { color: #EE3640; }
        .border-acid-red { border-color: #EE3640; }
        
/* Smooth scrolling */
        html { scroll-behavior: smooth; }

        /* Custom scrollbar */
        .no-scrollbar::-webkit-scrollbar { display: none; }
        .no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

        /* Hero Background Effects */
        .hero-mesh {
            background: radial-gradient(circle at 50% 50%, #151515 0%, #000000 100%);
            position: relative;
        }

        .glow-blob {
            position: absolute;
            width: 600px;
            height: 600px;
            background: radial-gradient(circle, rgba(238, 54, 64, 0.15) 0%, transparent 70%);
            border-radius: 50%;
            filter: blur(80px);
            z-index: 1;
            pointer-events: none;
        }

        .blob-1 { top: -10%; left: -10%; animation: drift 20s infinite alternate; }
        .blob-2 { bottom: -10%; right: -5%; animation: drift 25s infinite alternate-reverse; }

        @keyframes drift {
            from { transform: translate(0, 0) scale(1); }
            to { transform: translate(100px, 50px) scale(1.1); }
        }

        .grid-overlay {
            position: absolute;
            inset: 0;
            background-image: radial-gradient(rgba(255, 255, 255, 0.05) 1px, transparent 1px);
            background-size: 40px 40px;
            mask-image: radial-gradient(ellipse at center, black, transparent 80%);
            pointer-events: none;
            z-index: 2;
        }

        /* Animations for Hero Section Content */
        @keyframes float {
            0% { transform: translateY(0px) rotate(0deg); }
            50% { transform: translateY(-20px) rotate(2deg); }
            100% { transform: translateY(0px) rotate(0deg); }
        }
        .float-animation { animation: float 6s ease-in-out infinite; }
        .float-delay { animation-delay: 2s; }
        /* Project Card Transitions */
        .project-card {
            transition: all 0.6s cubic-bezier(0.22, 1, 0.36, 1);
            transform-origin: center top;
        }
        
        .project-card.is-active {
            transform: translateY(0) scale(1);
            opacity: 1;
            z-index: 20;
        }

        .project-card.is-prev {
            transform: translateY(-40px) scale(0.92);
            opacity: 0.5;
            z-index: 10;
        }

        .project-card.is-next {
            transform: translateY(40px) scale(0.95);
            opacity: 0;
            z-index: 5;
        }

        /* Hover animations for services */
        .service-row {
            transition: all 0.3s ease;
        }
        .service-row:hover {
            transform: translateX(10px);
        }

        /* Success Story Card Hovers - Refined Transformation */
        .story-card {
            transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
            position: relative;
            overflow: hidden;
        }
        
        .story-card:hover {
            background-color: #EE3640 !important;
            transform: translateY(-12px);
            border-color: #EE3640;
        }

        .story-card:hover h3, 
        .story-card:hover p, 
        .story-card:hover .arrow-circle {
            color: white !important;
        }

        .story-card:hover .icon-bg {
            background-color: white !important;
        }
        
        .story-card:hover .icon-bg svg {
            color: #EE3640 !important;
        }

        .story-card:hover .arrow-circle {
            border-color: rgba(255,255,255,0.3) !important;
        }

        /* Testimonial Card Interaction */
        .testimonial-card {
            transition: all 0.4s ease;
        }
        .testimonial-card:hover {
            transform: translateY(-8px);
            background-color: #1a1a1a;
            border-color: rgba(238, 54, 64, 0.4);
        }

        /* Auto-Scrolling Marquee Animations */
        @keyframes marquee {
            0% { transform: translateX(0); }
            100% { transform: translateX(calc(-50% - 12px)); }
        }

        @keyframes marquee-reverse {
            0% { transform: translateX(calc(-50% - 12px)); }
            100% { transform: translateX(0); }
        }

        .animate-marquee {
            display: flex;
            width: max-content;
            animation: marquee 50s linear infinite;
        }

        .animate-marquee-reverse {
            display: flex;
            width: max-content;
            animation: marquee-reverse 50s linear infinite;
        }

        .marquee-container:hover .animate-marquee,
        .marquee-container:hover .animate-marquee-reverse {
            animation-play-state: paused;
        }

       
        /* Counter Card Tilt & Interactive Effects */
        .counter-tilt-1 { transform: rotate(-3deg); }
        .counter-tilt-2 { transform: rotate(2deg); }
        .counter-tilt-3 { transform: rotate(-1.5deg); }
        .counter-tilt-4 { transform: rotate(4deg); }

        .counter-card {
            transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
            background-color: #ffffff;
            border: 1px solid #f3f4f6;
        }

        .counter-card span {
            color: #111827; /* gray-900 */
            transition: color 0.4s ease;
        }

        .counter-card p {
            transition: color 0.4s ease;
        }

        .counter-card:hover {
            background-color: #EE3640 !important;
            transform: rotate(0deg) translateY(-15px);
            box-shadow: 0 30px 60px -12px rgba(238, 54, 64, 0.3);
            border-color: #EE3640;
            z-index: 10;
        }

        .counter-card:hover span,
        .counter-card:hover p {
            color: #ffffff !important;
        }

        /* Accordion Transitions */
        .faq-content {
            max-height: 0;
            overflow: hidden;
            transition: max-height 0.4s cubic-bezier(0.4, 0, 0.2, 1);
        }
        .faq-item.active .faq-content {
            max-height: 200px;
        }
        .faq-item.active .faq-icon {
            transform: rotate(45deg);
            background-color: #EE3640;
            color: white;
        }


        /* Brands Section Glow (Modified for Red Theme) */
        .brands-glow-light {
            background: radial-gradient(circle at 10% 10%, rgba(238, 54, 64, 0.15) 0%, transparent 50%);
        }