
      
    


      
     


      {} *{} 
     


      #IE-warning {
        display: none;
        position: fixed;
        width: 100%;
        height: 100%;
        z-index: 9999;
        background: white;
      }
      .IE-warning-message {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        text-align: center;
      }
    



 /* Reset and Base Styles */ * { margin: 0; padding: 0; box-sizing: border-box; } body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif; line-height: 1.6; color: #333; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); min-height: 100vh; transition: all 0.3s ease; } /* RTL Support for Arabic */ body.rtl { direction: rtl; font-family: 'Segoe UI', Tahoma, Arial, sans-serif; } body.rtl .ip-detail { border-right: 4px solid #667eea; border-left: none; text-align: right; } body.rtl .testimonial { border-right: 4px solid #667eea; border-left: none; } body.rtl .guarantee-badges { flex-direction: column; align-items: center; } .container { max-width: 1200px; margin: 0 auto; padding: 0 20px; } /* Language Switcher */ .language-switcher { position: fixed; top: 20px; right: 20px; z-index: 1000; background: white; padding: 10px; border-radius: 8px; box-shadow: 0 2px 10px rgba(0,0,0,0.1); display: flex; gap: 5px; } body.rtl .language-switcher { right: auto; left: 20px; } /* Header Section */ .header { background: rgba(255, 255, 255, 0.95); backdrop-filter: blur(10px); padding: 60px 0; text-align: center; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1); } .headline { font-size: 2.5rem; font-weight: 800; color: #2d3748; margin-bottom: 20px; line-height: 1.2; } .subheading { font-size: 1.25rem; color: #4a5568; font-weight: 400; } /* IP Display Section */ .ip-section { padding: 60px 0; background: rgba(255, 255, 255, 0.9); backdrop-filter: blur(10px); } .ip-box { background: white; border-radius: 20px; padding: 40px; box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1); text-align: center; border: 2px solid #e2e8f0; } .ip-box h2 { font-size: 1.75rem; color: #2d3748; margin-bottom: 30px; font-weight: 700; } .ip-info { display: grid; gap: 20px; max-width: 600px; margin: 0 auto; } .ip-detail { background: #f7fafc; padding: 20px; border-radius: 12px; border-left: 4px solid #667eea; text-align: left; transition: all 0.3s ease; } .ip-detail strong { color: #2d3748; font-weight: 600; display: block; margin-bottom: 5px; } .ip-detail span { color: #4a5568; font-size: 1.1rem; } .protected-message { background: linear-gradient(135deg, #48bb78 0%, #38a169 100%); color: white; border-left: 4px solid #2f855a; } .protected-message strong, .protected-message span { color: white; } body.rtl .protected-message { border-right: 4px solid #2f855a; border-left: none; } .loading { font-size: 1.2rem; color: #667eea; font-weight: 500; } /* Warning Section */ .warning-section { padding: 60px 0; background: rgba(255, 255, 255, 0.95); } .warning-box { background: linear-gradient(135deg, #fc8181 0%, #f56565 100%); color: white; padding: 40px; border-radius: 20px; text-align: center; box-shadow: 0 10px 40px rgba(245, 101, 101, 0.3); animation: pulse 2s infinite; } @keyframes pulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.02); } } .warning-icon { font-size: 3rem; margin-bottom: 20px; } .warning-box h3 { font-size: 1.75rem; font-weight: 700; margin-bottom: 15px; } .warning-box p { font-size: 1.1rem; margin-bottom: 10px; } .urgency { font-weight: 600; font-size: 1.2rem !important; text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3); } /* Benefits Section */ .benefits-section { padding: 80px 0; background: rgba(255, 255, 255, 0.9); } .benefits-section h2 { text-align: center; font-size: 2.25rem; color: #2d3748; margin-bottom: 60px; font-weight: 700; } .benefits-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 30px; } .benefit-item { background: white; padding: 40px 30px; border-radius: 20px; text-align: center; box-shadow: 0 8px 30px rgba(0, 0, 0, 0.1); transition: transform 0.3s ease, box-shadow 0.3s ease; border: 2px solid transparent; } .benefit-item:hover { transform: translateY(-10px); box-shadow: 0 15px 50px rgba(0, 0, 0, 0.15); border-color: #667eea; } .benefit-icon { font-size: 3rem; margin-bottom: 20px; } .benefit-item h3 { font-size: 1.25rem; color: #2d3748; margin-bottom: 15px; font-weight: 600; } .benefit-item p { color: #4a5568; line-height: 1.6; } /* CTA Section */ .cta-section { padding: 80px 0; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); } .cta-box { background: white; padding: 60px 40px; border-radius: 25px; text-align: center; box-shadow: 0 20px 60px rgba(0, 0, 0, 0.2); } .cta-box h2 { font-size: 2.5rem; color: #2d3748; margin-bottom: 30px; font-weight: 800; } .offer-timer { margin-bottom: 40px; } .timer-text { font-size: 1.25rem; color: #f56565; font-weight: 600; margin-bottom: 15px; } .countdown { font-size: 1.5rem; font-weight: 700; color: #2d3748; background: #fed7d7; padding: 15px 30px; border-radius: 12px; display: inline-block; } .cta-button { display: inline-block; background: linear-gradient(135deg, #48bb78 0%, #38a169 100%); color: white; padding: 20px 50px; font-size: 1.5rem; font-weight: 700; text-decoration: none; border-radius: 50px; box-shadow: 0 10px 30px rgba(72, 187, 120, 0.4); transition: all 0.3s ease; margin-bottom: 30px; text-transform: uppercase; letter-spacing: 1px; } body.rtl .cta-button { text-transform: none; letter-spacing: normal; } .cta-button:hover { transform: translateY(-3px); box-shadow: 0 15px 40px rgba(72, 187, 120, 0.6); background: linear-gradient(135deg, #38a169 0%, #2f855a 100%); } .guarantee-badges { display: flex; justify-content: center; gap: 20px; flex-wrap: wrap; } .badge { background: #e6fffa; color: #234e52; padding: 10px 20px; border-radius: 25px; font-weight: 600; font-size: 0.9rem; border: 2px solid #81e6d9; } /* Trust Section */ .trust-section { padding: 60px 0; background: rgba(255, 255, 255, 0.95); } .trust-content { text-align: center; } .trust-content h3 { font-size: 1.75rem; color: #2d3748; margin-bottom: 20px; font-weight: 700; } .stars { font-size: 2rem; margin-bottom: 40px; } .testimonials { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 30px; max-width: 800px; margin: 0 auto; } .testimonial { background: white; padding: 30px; border-radius: 15px; box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1); border-left: 4px solid #667eea; transition: all 0.3s ease; } .testimonial:hover { transform: translateY(-5px); box-shadow: 0 15px 35px rgba(0, 0, 0, 0.15); } .testimonial p { font-style: italic; color: #4a5568; margin-bottom: 15px; font-size: 1.1rem; } .testimonial span { color: #667eea; font-weight: 600; } /* Footer */ .footer { padding: 40px 0; background: rgba(45, 55, 72, 0.9); color: white; text-align: center; } .disclaimer { font-size: 0.9rem; color: #a0aec0; max-width: 600px; margin: 0 auto; } /* Mobile Responsive */ @media (max-width: 768px) { .headline { font-size: 2rem; } .subheading { font-size: 1.1rem; } .ip-box, .warning-box, .cta-box { padding: 30px 20px; } .benefits-grid { grid-template-columns: 1fr; } .cta-button { padding: 18px 40px; font-size: 1.25rem; } .guarantee-badges { flex-direction: column; align-items: center; } .countdown { font-size: 1.25rem; padding: 12px 25px; } .language-switcher { top: 10px; right: 10px; padding: 8px; gap: 3px; } body.rtl .language-switcher { right: auto; left: 10px; } } @media (max-width: 480px) { .container { padding: 0 15px; } .headline { font-size: 1.75rem; } .cta-box h2 { font-size: 2rem; } .benefits-section h2 { font-size: 1.75rem; } } /* Enhanced Animations and Effects */ @keyframes fadeInUp { from { opacity: 0; transform: translateY(30px); } to { opacity: 1; transform: translateY(0); } } @keyframes slideInLeft { from { opacity: 0; transform: translateX(-50px); } to { opacity: 1; transform: translateX(0); } } @keyframes slideInRight { from { opacity: 0; transform: translateX(50px); } to { opacity: 1; transform: translateX(0); } } @keyframes glow { 0%, 100% { box-shadow: 0 10px 30px rgba(72, 187, 120, 0.4); } 50% { box-shadow: 0 10px 40px rgba(72, 187, 120, 0.6), 0 0 20px rgba(72, 187, 120, 0.3); } } /* Apply animations to sections */ .header { animation: fadeInUp 0.8s ease-out; } .ip-section { animation: slideInLeft 0.8s ease-out 0.2s both; } .warning-section { animation: slideInRight 0.8s ease-out 0.4s both; } .benefits-section { animation: fadeInUp 0.8s ease-out 0.6s both; } .cta-section { animation: fadeInUp 0.8s ease-out 0.8s both; } /* Enhanced CTA button with glow effect */ .cta-button { animation: glow 2s ease-in-out infinite; position: relative; overflow: hidden; } .cta-button::before { content: ''; position: absolute; top: 0; left: -100%; width: 100%; height: 100%; background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent); transition: left 0.5s; } .cta-button:hover::before { left: 100%; } body.rtl .cta-button::before { left: 100%; } body.rtl .cta-button:hover::before { left: -100%; } /* Security badges styling */ .security-badges { display: flex; justify-content: center; gap: 30px; margin: 40px 0; flex-wrap: wrap; } .security-badge { background: white; padding: 20px; border-radius: 15px; box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1); text-align: center; min-width: 150px; border: 2px solid #e2e8f0; transition: all 0.3s ease; } .security-badge:hover { transform: translateY(-5px); border-color: #667eea; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15); } .security-badge .badge-icon { font-size: 2rem; margin-bottom: 10px; display: block; } .security-badge .badge-text { font-weight: 600; color: #2d3748; font-size: 0.9rem; } /* Enhanced trust indicators */ .trust-indicators { display: flex; justify-content: center; gap: 40px; margin: 30px 0; flex-wrap: wrap; } .trust-indicator { text-align: center; color: #4a5568; } .trust-indicator .number { font-size: 2.5rem; font-weight: 800; color: #667eea; display: block; line-height: 1; } .trust-indicator .label { font-size: 0.9rem; font-weight: 500; text-transform: uppercase; letter-spacing: 1px; } body.rtl .trust-indicator .label { text-transform: none; letter-spacing: normal; } /* Loading spinner for IP detection */ .loading { position: relative; } .loading::after { content: ''; position: absolute; right: -30px; top: 50%; transform: translateY(-50%); width: 20px; height: 20px; border: 2px solid #e2e8f0; border-top: 2px solid #667eea; border-radius: 50%; animation: spin 1s linear infinite; } body.rtl .loading::after { right: auto; left: -30px; } @keyframes spin { 0% { transform: translateY(-50%) rotate(0deg); } 100% { transform: translateY(-50%) rotate(360deg); } } /* Language-specific font adjustments */ body[lang="ar"] { font-family: 'Segoe UI', Tahoma, Arial, sans-serif; } /* Improved accessibility */ .cta-button:focus, .benefit-item:focus { outline: 3px solid #667eea; outline-offset: 2px; } /* High contrast mode support */ @media (prefers-contrast: high) { .warning-box { background: #d32f2f; border: 3px solid #fff; } .cta-button { background: #2e7d32; border: 2px solid #fff; } } /* Reduced motion support */ @media (prefers-reduced-motion: reduce) { * { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; } } 

