/* ============================================ FORCE COLORS - MAXIMUM PRIORITY !!! ============================================ */ /* 1. CTA SECTION - FORCE WHITE TEXT !!! */ .cta-section, #cta, section:has(.cta-form), section:has(form) { background: linear-gradient(135deg, #2573D1 0%, #4A90E2 100%) !important; } /* FORCE ALL TEXT TO BE WHITE */ .cta-section *, #cta *, .cta-section h1, .cta-section h2, .cta-section h3, .cta-section p, .cta-section span, .cta-section div, .cta-section small, .cta-section strong, .cta-section em, .cta-section label, .cta-section .form-hint, .cta-section .privacy-note, .cta-section .section-title, .cta-section .section-subtitle, .cta-section .cta-text { color: #FFFFFF !important; -webkit-text-fill-color: #FFFFFF !important; text-shadow: 0 1px 3px rgba(0, 0, 0, 0.2) !important; } /* Force placeholder text to be visible */ .cta-section input::placeholder, .cta-section textarea::placeholder { color: rgba(31, 41, 55, 0.6) !important; -webkit-text-fill-color: rgba(31, 41, 55, 0.6) !important; } /* Force icon colors */ .cta-section i, .cta-section .fa, .cta-section .fas, .cta-section .far, .cta-section .fab { color: #FFFFFF !important; } /* 2. FOOTER - FORCE BLACK TEXT !!! */ footer .logo, footer .logo span, .footer .logo, .footer .logo span, footer h1, footer h2, footer h3, footer .footer-title { color: #000000 !important; -webkit-text-fill-color: #000000 !important; } footer p, footer .footer-text, footer .footer-description, .footer p, .footer .footer-text { color: #374151 !important; -webkit-text-fill-color: #374151 !important; } /* Footer logo specific */ footer .logo i, .footer .logo i { color: #2573D1 !important; } /* 3. SEAMLESS INFINITE PATTERN !!! */ .hero { position: relative; overflow: hidden; } .hero::before { content: ''; position: absolute; top: 0; left: 0; width: 200%; height: 200%; background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.1'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); background-repeat: repeat; animation: seamless-scroll 15s linear infinite; pointer-events: none; z-index: 1; } @keyframes seamless-scroll { 0% { transform: translate(0, 0); } 100% { transform: translate(60px, 60px); } } /* 4. SUPER VISIBLE ROBOT HEAD EFFECTS !!! */ .robot-display { position: relative !important; } /* BRIGHT PULSING RING */ .robot-display::before { content: ''; position: absolute; top: 30%; left: 50%; transform: translate(-50%, -50%); width: 150px; height: 150px; border: 4px solid #FFFFFF; border-radius: 50%; box-shadow: 0 0 30px #FFFFFF, inset 0 0 30px #FFFFFF, 0 0 60px rgba(255, 255, 255, 0.5); animation: bright-pulse 2s ease-in-out infinite; pointer-events: none; z-index: 10; } @keyframes bright-pulse { 0%, 100% { transform: translate(-50%, -50%) scale(1); opacity: 0.3; } 50% { transform: translate(-50%, -50%) scale(1.3); opacity: 1; } } /* ENERGY BEAMS FROM HEAD */ .robot-3d { position: relative !important; } .robot-3d::before { content: ''; position: absolute; top: 15%; left: 50%; transform: translateX(-50%); width: 200px; height: 4px; background: linear-gradient(90deg, transparent 0%, #FFFFFF 20%, #FFFFFF 80%, transparent 100%); box-shadow: 0 0 20px #FFFFFF, 0 0 40px #FFFFFF, 0 0 60px rgba(255, 255, 255, 0.5); animation: laser-scan 1.5s ease-in-out infinite; pointer-events: none; z-index: 15; } .robot-3d::after { content: ''; position: absolute; top: 20%; left: 50%; transform: translateX(-50%); width: 150px; height: 3px; background: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.8) 30%, rgba(255, 255, 255, 0.8) 70%, transparent 100%); box-shadow: 0 0 15px rgba(255, 255, 255, 0.8), 0 0 30px rgba(255, 255, 255, 0.5); animation: laser-scan 1.5s ease-in-out infinite; animation-delay: 0.75s; pointer-events: none; z-index: 15; } @keyframes laser-scan { 0%, 100% { width: 0; opacity: 0; } 50% { width: 250px; opacity: 1; } } /* GLOWING ORB ON HEAD */ .robot-head-glow { position: absolute; top: 10%; left: 50%; transform: translateX(-50%); width: 80px; height: 80px; background: radial-gradient(circle, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0.8) 30%, rgba(255, 255, 255, 0.4) 60%, transparent 100%); border-radius: 50%; animation: orb-glow 2s ease-in-out infinite; pointer-events: none; z-index: 12; } @keyframes orb-glow { 0%, 100% { transform: translateX(-50%) scale(0.8); opacity: 0.5; } 50% { transform: translateX(-50%) scale(1.2); opacity: 1; } } /* SPARK PARTICLES */ .spark { position: absolute; width: 4px; height: 4px; background: #FFFFFF; border-radius: 50%; box-shadow: 0 0 10px #FFFFFF; pointer-events: none; z-index: 14; } .spark-1 { top: 15%; left: 45%; animation: spark-fly-1 2s ease-out infinite; } .spark-2 { top: 15%; left: 55%; animation: spark-fly-2 2s ease-out infinite; animation-delay: 0.5s; } .spark-3 { top: 20%; left: 50%; animation: spark-fly-3 2s ease-out infinite; animation-delay: 1s; } @keyframes spark-fly-1 { 0% { transform: translate(0, 0) scale(0); opacity: 0; } 20% { transform: translate(-20px, -20px) scale(1); opacity: 1; } 100% { transform: translate(-60px, -80px) scale(0); opacity: 0; } } @keyframes spark-fly-2 { 0% { transform: translate(0, 0) scale(0); opacity: 0; } 20% { transform: translate(20px, -20px) scale(1); opacity: 1; } 100% { transform: translate(60px, -80px) scale(0); opacity: 0; } } @keyframes spark-fly-3 { 0% { transform: translate(0, 0) scale(0); opacity: 0; } 20% { transform: translate(0, -25px) scale(1); opacity: 1; } 100% { transform: translate(0, -90px) scale(0); opacity: 0; } } /* OVERRIDE ALL PREVIOUS STYLES */ .cta-section * { color: #FFFFFF !important; } footer .logo span, footer h3, footer .footer-title { color: #000000 !important; } /* Mobile adjustments */ @media (max-width: 768px) { .robot-display::before, .robot-3d::before, .robot-3d::after, .robot-head-glow { display: block !important; opacity: 0.7; } }