*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }  body { font-family: 'Inter', Arial, sans-serif; line-height: 1.65; color: #cbd5e1; background: radial-gradient(ellipse at top left, #131d31, #0d1625 70%), radial-gradient(ellipse at bottom right, rgba(37,99,235,0.06) 0%, transparent 60%); -webkit-font-smoothing: antialiased; } .container { width: 90%; max-width: 1200px; margin: auto; overflow: visible; padding: 20px 0; }  header { background: rgba(18, 30, 50, 0.90); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); color: #94A3B8; padding: 0.9rem 0; border-bottom: 1px solid rgba(0, 212, 255, 0.35); position: sticky; top: 0; z-index: 1000; box-shadow: 0 2px 16px rgba(0, 0, 0, 0.3); transition: box-shadow 0.3s ease; } header .container { display: flex; justify-content: space-between; align-items: center; }  .logo-img { max-height: 48px; width: auto; display: block; transition: opacity 0.2s ease; } .logo-img:hover { opacity: 0.88; } header .logo a { display: flex; align-items: center; text-decoration: none; }  header nav ul { list-style: none; display: flex; gap: 20px; align-items: center; flex-wrap: nowrap; } header nav ul li a { color: #E2E8F0; text-decoration: none; font-weight: 600; font-size: 0.92rem; padding: 7px 14px; border-radius: 8px; transition: color 0.25s ease, background 0.25s ease, box-shadow 0.25s ease; position: relative; overflow: hidden; } a:focus-visible{outline:2px solid #60A5FA;outline-offset:2px;border-radius:4px}.skip-link{position:absolute;top:-999px;left:0;z-index:9999;padding:12px 24px;background:#2563EB;color:#fff;font-weight:700;text-decoration:none;border-radius:0 0 8px 0}.skip-link:focus{top:0;outline:3px solid #60A5FA}.btn:focus-visible{outline:2px solid #60A5FA;outline-offset:2px}header nav ul li a:hover, header nav ul li a.active { background: linear-gradient(135deg, #2563EB, #3B82F6); color: #ffffff; box-shadow: 0 4px 15px rgba(37, 99, 235, 0.4); }  @keyframes navShine { 0% { left: -80%; } 100% { left: 120%; } } header nav ul li a:hover::after, header nav ul li a.active::after { content: ""; position: absolute; top: 0; left: -80%; width: 50%; height: 100%; background: linear-gradient(90deg, transparent, rgba(255,255,255,0.35), transparent); animation: navShine 0.55s ease forwards; pointer-events: none; } .auth-buttons { display: flex; gap: 20px; align-items: center; }  .btn { display: inline-block; padding: 10px 22px; text-decoration: none; border-radius: 8px; font-weight: 700; font-size: 0.95rem; transition: background 0.3s ease, color 0.3s ease, box-shadow 0.3s ease, transform 0.2s ease; border: none; cursor: pointer; position: relative; overflow: hidden; will-change: transform, box-shadow; }  @keyframes btnShine { 0% { left: -80%; } 100% { left: 140%; } } .btn::after { content: ""; position: absolute; top: 0; left: -80%; width: 50%; height: 100%; background: linear-gradient(90deg, transparent, rgba(255,255,255,0.3), transparent); pointer-events: none; } .btn:hover::after { animation: btnShine 0.5s ease forwards; } .primary-btn { background: linear-gradient(135deg, #2563EB, #1d4ed8, #1E40AF); color: #ffffff; box-shadow: 0 4px 14px rgba(37, 99, 235, 0.35); } .primary-btn:hover { background: linear-gradient(135deg, #1D4ED8, #1E40AF); box-shadow: 0 6px 22px rgba(37, 99, 235, 0.55); transform: translateY(-2px); color: #ffffff; } .secondary-btn { background: #050E1A; color: #ffffff; box-shadow: 0 4px 12px rgba(10, 37, 64, 0.25); } .secondary-btn:hover { background: #0F3460; box-shadow: 0 6px 20px rgba(10, 37, 64, 0.4); transform: translateY(-2px); color: #ffffff; } .large-btn { padding: 15px 32px; font-size: 1.05rem; } .ghost-btn { background: rgba(255, 255, 255, 0.15); color: #ffffff; border: 2px solid rgba(255, 255, 255, 0.70); box-shadow: none; } .ghost-btn:hover { background: rgba(255, 255, 255, 0.28); box-shadow: 0 4px 14px rgba(255, 255, 255, 0.25); transform: translateY(-2px); color: #ffffff; } .accent-btn { background: linear-gradient(135deg, #f59e0b, #d97706); color: #ffffff; box-shadow: 0 4px 14px rgba(245, 158, 11, 0.35); } .accent-btn:hover { background: linear-gradient(135deg, #d97706, #b45309); box-shadow: 0 6px 22px rgba(245, 158, 11, 0.55); transform: translateY(-2px); color: #ffffff; } .accent-btn-outline { background: transparent; color: #f59e0b; border: 2px solid #f59e0b; } .accent-btn-outline:hover { background: #f59e0b; color: #ffffff; }  #hero { background: linear-gradient(135deg, #0a2540, #1e40af, #2563eb); color: #ffffff; text-align: center; padding: 95px 0 80px; display: flex; align-items: center; min-height: 100vh; will-change: transform; } .hero-content { overflow: visible; } #hero h1 { font-size: 3rem; font-weight: 800; margin-bottom: 20px; line-height: 1.2; } #hero p { font-size: 1.2rem; margin-bottom: 30px; max-width: 800px; margin-left: auto; margin-right: auto; opacity: 0.92; } .hero-actions { display: flex; justify-content: center; gap: 14px; flex-wrap: wrap; margin-bottom: 26px; }  .page-hero { background: linear-gradient(135deg, #0A2540, #1E40AF, #2563EB); color: #ffffff; text-align: center; } .compact-page-hero { padding: 80px 0; } .page-hero h1 { font-size: 3rem; font-weight: 800; margin-bottom: 18px; } .page-hero p { max-width: 820px; margin: 0 auto; font-size: 1.18rem; opacity: 0.92; } .services-page-hero { background: linear-gradient(135deg, #0a1e35, #1a3a80, #2563EB, #1E40AF); color: #ffffff; padding: 90px 0; position: relative; } .services-page-hero::before { content: ""; position: absolute; inset: 0; background: radial-gradient(ellipse at 100% 0%, rgba(6,182,212,0.12), transparent 50%); pointer-events: none; } .services-page-hero h1 { font-size: 3rem; font-weight: 800; margin-bottom: 20px; } .services-page-hero p { max-width: 850px; margin: 0 auto; font-size: 1.2rem; opacity: 0.92; }  section { padding: 60px 0; text-align: center; transition: background 0.3s ease; }  section h2 { font-size: 2.4rem; font-weight: 800; margin-bottom: 40px; color: #0A2540; }  .trust-strip { display: flex; justify-content: center; gap: 12px; flex-wrap: wrap; margin: 0 auto; max-width: 980px; } .trust-strip span { padding: 8px 14px; border-radius: 999px; background: rgba(10, 37, 64, 0.32); color: #ffffff; border: 1px solid rgba(255, 255, 255, 0.22); font-size: 0.9rem; font-weight: 600; transition: background 0.2s ease; }  .eyebrow { display: inline-block; margin-bottom: 16px; padding: 7px 14px; border-radius: 999px; background: rgba(255, 255, 255, 0.2); border: 1px solid rgba(255, 255, 255, 0.28); color: #ffffff; font-size: 0.85rem; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; } .tag-ai { display: inline-block; padding: 4px 12px; border-radius: 999px; background: linear-gradient(135deg, rgba(6,182,212,0.15), rgba(14,116,144,0.10)); border: 1px solid rgba(6,182,212,0.30); color: #22d3ee; font-size: 0.78rem; font-weight: 700; letter-spacing: 0.03em; } .tag-new { display: inline-block; padding: 4px 12px; border-radius: 999px; background: linear-gradient(135deg, rgba(250,204,21,0.18), rgba(245,158,11,0.10)); border: 1px solid rgba(250,204,21,0.30); color: #fbbf24; font-size: 0.78rem; font-weight: 700; letter-spacing: 0.03em; } .eyebrow.dark { background: rgba(37, 99, 235, 0.12); border-color: #BFDBFE; color: #1D4ED8; }  .section-heading { text-align: center; max-width: 850px; margin: 0 auto; padding-bottom: 36px; } .section-heading h2 { margin-bottom: 14px; color: #0A2540; } .section-heading p { color: #475569; font-size: 1.1rem; }  .hero-services { margin-top: 55px; } .hero-services h2 { color: #ffffff; font-size: 2.2rem; font-weight: 800; margin-bottom: 25px; text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3); } .service-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 24px; margin-top: 20px; } .service-item { background: rgba(16, 30, 50, 0.88); border: 1px solid rgba(0, 212, 255, 0.30); padding: 28px; border-radius: 18px; box-shadow: 0 12px 32px rgba(10, 37, 64, 0.22); text-align: left; backdrop-filter: blur(8px); transition: transform 0.3s ease, box-shadow 0.3s ease; will-change: transform; } .service-item:hover { transform: translateY(-4px); box-shadow: 0 18px 42px rgba(10, 37, 64, 0.3); } .service-item h3 { color: #2563EB; margin-bottom: 12px; font-weight: 700; } .service-item p { color: #475569; }  .outcomes-section, .process-section { background: rgba(255, 255, 255, 0.08); padding: 75px 0; } .outcomes-grid, .process-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 22px; overflow: visible; } .outcome-card, .process-step { background: rgba(10, 37, 64, 0.4); border: 1px solid #BFDBFE; border-radius: 14px; padding: 26px; text-align: left; box-shadow: 0 8px 22px rgba(10, 37, 64, 0.07); transition: transform 0.3s ease, box-shadow 0.3s ease; will-change: transform; } .outcome-card:hover, .process-step:hover { transform: translateY(-3px); box-shadow: 0 14px 34px rgba(10, 37, 64, 0.12); } .outcome-card strong { display: block; color: #1D4ED8; font-size: 1.08rem; margin-bottom: 8px; } .outcome-card span, .process-step p { color: #475569; } .process-step span { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 50%; background: linear-gradient(135deg, #2563EB, #1E40AF); color: #ffffff; font-weight: 800; margin-bottom: 14px; box-shadow: 0 4px 10px rgba(37, 99, 235, 0.35); } .process-step h3 { margin-bottom: 10px; color: #0A2540; font-weight: 700; }  .industries-section { background: rgba(10, 37, 64, 0.4); border: 1px solid rgba(0, 212, 255, 0.3); padding: 75px 0; } .industry-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 16px; overflow: visible; } .industry-grid div { background: rgba(255, 255, 255, 0.08); border: 1px solid #BFDBFE; border-radius: 14px; padding: 22px; font-weight: 700; color: #1D4ED8; box-shadow: 0 6px 18px rgba(10, 37, 64, 0.07); transition: transform 0.25s ease, box-shadow 0.25s ease; } .industry-grid div:hover { transform: translateY(-3px); box-shadow: 0 10px 28px rgba(37, 99, 235, 0.15); }  .cta-band { background: linear-gradient(135deg, #0A2540, #1E40AF, #2563EB, #1E40AF); color: #ffffff; text-align: center; padding: 75px 0; position: relative; } .cta-band::before { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse at 50% 0%, rgba(245,158,11,0.08), transparent 60%); pointer-events: none; } .cta-band h2 { color: #ffffff; margin-bottom: 14px; font-size: 2.2rem; font-weight: 800; } .cta-band p { margin-bottom: 28px; font-size: 1.12rem; opacity: 0.9; }  .services-detail-grid-section { background: rgba(12, 25, 41, 0.5); padding-top: 70px; } .services-detail-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(430px, 1fr)); gap: 28px; overflow: visible; place-items: center; justify-content: center; } .services-cta { text-align: center; padding-top: 40px; } .services-cta h2 { color: #F1F5F9; } .services-cta p { max-width: 720px; margin: 0 auto 25px; color: #CBD5E1; } .service-breakdown { margin-top: 18px; padding-left: 0; list-style: none; } .service-breakdown li { position: relative; margin-bottom: 11px; padding-left: 26px; color: #475569; line-height: 1.5; } .service-breakdown li::before { content: '✓'; position: absolute; left: 0; top: 0; color: #2563EB; font-weight: 700; } .more-link { display: inline-block; margin-top: 16px; color: #2563EB; font-weight: 700; text-decoration: none; transition: color 0.2s ease; } .more-link:hover { color: #1D4ED8; text-decoration: underline; }  .service-detail-page { min-height: calc(100vh - 180px); padding: 70px 0; text-align: left; } .service-detail-page h1 { font-size: 2.8rem; font-weight: 800; color: #0A2540; margin: 18px 0; } .service-detail-intro { max-width: 850px; font-size: 1.15rem; color: #475569; margin-bottom: 30px; } .service-detail-card { background: rgba(255, 255, 255, 0.08); border-radius: 14px; padding: 36px; box-shadow: 0 10px 30px rgba(10, 37, 64, 0.10); transition: transform 0.3s ease, box-shadow 0.3s ease; } .service-detail-card:hover { transform: translateY(-3px); box-shadow: 0 16px 42px rgba(10, 37, 64, 0.14); } .service-detail-card h2 { text-align: left; margin-bottom: 22px; color: #0A2540; } .service-detail-list { list-style: none; margin-bottom: 30px; } .service-detail-list li { position: relative; margin-bottom: 14px; padding-left: 30px; color: #CBD5E1; font-size: 1.05rem; } .service-detail-list li::before { content: '✓'; position: absolute; left: 0; color: #2563EB; font-weight: 700; } .back-link { color: #2563EB; font-weight: 700; text-decoration: none; transition: color 0.2s ease; } .back-link:hover { color: #1D4ED8; }  .service-label { display: inline-block; margin-bottom: 12px; padding: 5px 12px; border-radius: 999px; background: rgba(37, 99, 235, 0.12); color: #1D4ED8; font-size: 0.8rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; } .service-mini-section { margin-top: 24px; } .service-mini-section h3 { margin-bottom: 12px; color: #0A2540; font-size: 1.15rem; font-weight: 700; }  .featured-service-card { border: 2px solid rgba(37, 99, 235, 0.35); background: linear-gradient(180deg, rgba(15, 32, 58, 0.95) 0%, rgba(10, 37, 64, 0.6) 100%); } .shiny-service-card { position: relative; overflow: hidden; border: 1px solid rgba(37, 99, 235, 0.35); background: linear-gradient(135deg, rgba(15, 32, 58, 0.9) 0%, rgba(10, 37, 64, 0.5) 46%, rgba(15, 20, 40, 0.7) 100%); box-shadow: 0 18px 45px rgba(10, 37, 64, 0.12); } .shiny-service-card::before { content: ""; position: absolute; top: -80px; right: -80px; width: 200px; height: 200px; background: radial-gradient(circle, rgba(37, 99, 235, 0.14), transparent 68%); } .shiny-service-card h2 { color: #1D4ED8; }  .pricing-page { min-height: calc(100vh - 180px); padding-top: 80px; } .pricing-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 30px; margin-top: 30px; } .pricing-card { background: rgba(255, 255, 255, 0.08); padding: 40px 24px; border-radius: 14px; box-shadow: 0 6px 20px rgba(10, 37, 64, 0.09); display: flex; flex-direction: column; justify-content: space-between; transition: transform 0.3s ease, box-shadow 0.3s ease; will-change: transform; } .pricing-card:hover { transform: translateY(-8px); box-shadow: 0 14px 36px rgba(10, 37, 64, 0.14); } .pricing-card.featured { border: 2px solid #2563EB; transform: translateY(-8px); box-shadow: 0 14px 36px rgba(37, 99, 235, 0.18); } .pricing-card h3 { font-size: 1.7rem; font-weight: 800; color: #0A2540; margin-bottom: 18px; } .pricing-card .price { font-size: 2.8rem; font-weight: 800; color: #2563EB; margin-bottom: 18px; } .pricing-card .price span { font-size: 1rem; font-weight: 500; color: #64748B; } .pricing-card ul { list-style: none; margin-bottom: 28px; text-align: left; flex-grow: 1; } .pricing-card ul li { margin-bottom: 10px; color: #475569; font-size: 1rem; } .pricing-card ul li::before { content: '✅'; margin-right: 10px; } .pricing-card .btn { width: 100%; margin-top: auto; text-align: center; } .setup-note { margin: -6px 0 16px; color: #64748B; font-weight: 600; font-size: 0.9rem; } .pricing-guidance { margin-top: 46px; padding: 36px; background: rgba(255, 255, 255, 0.08); border-radius: 14px; box-shadow: 0 8px 24px rgba(10, 37, 64, 0.08); text-align: left; } .pricing-guidance h2 { text-align: center; margin-bottom: 26px; color: #0A2540; } .guidance-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 18px; } .guidance-grid div { padding: 20px; border-radius: 12px; background: rgba(10, 37, 64, 0.4); border: 1px solid #BFDBFE; transition: transform 0.2s ease; } .guidance-grid div:hover { transform: translateY(-2px); } .guidance-grid strong { display: block; color: #1D4ED8; margin-bottom: 8px; font-weight: 700; } .guidance-grid span { color: #475569; font-size: 0.95rem; }  .content-page-section, .contact-page-section { padding: 70px 0; background: rgba(12, 25, 41, 0.5); } .content-card, .contact-info-card, .contact-card { background: rgba(255, 255, 255, 0.08); border-radius: 14px; padding: 38px; box-shadow: 0 10px 30px rgba(10, 37, 64, 0.09); text-align: left; } .two-column-content, .contact-layout { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; overflow: visible; } .contact-layout { align-items: start; } .contact-card h2, .contact-info-card h2, .content-card h2 { text-align: left; margin-bottom: 18px; color: #F1F5F9; } .form-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; } .contact-card .form-group { margin-bottom: 18px; } .contact-card label { display: block; margin-bottom: 8px; font-weight: 600; color: #CBD5E1; font-size: 0.92rem; } .contact-card input, .contact-card select, .contact-card textarea { width: 100%; border: 1.5px solid #CBD5E1; border-radius: 10px; padding: 13px 14px; font-size: 0.97rem; font-family: inherit; background: rgba(12, 25, 41, 0.5); color: #94A3B8; transition: border-color 0.25s ease, box-shadow 0.25s ease; } .contact-card textarea { resize: vertical; } .contact-card input:focus, .contact-card select:focus, .contact-card textarea:focus { outline: none; border-color: #2563EB; box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15); background: rgba(255, 255, 255, 0.08); } .form-message { margin-top: 18px; font-weight: 600; } .form-message.success { color: #065F46; background: #D1FAE5; border: 1px solid #A7F3D0; border-radius: 10px; padding: 12px 16px; } .form-message.error { color: #991B1B; background: #FEE2E2; border: 1px solid #FECACA; border-radius: 10px; padding: 12px 16px; } .contact-note { margin-top: 22px; color: #CBD5E1; font-size: 0.95rem; } .field-help { display: block; margin-top: 7px; color: #64748B; font-size: 0.88rem; }  .main-nav { align-items: center; } .has-dropdown { position: relative; } .dropdown-menu { display: none; position: absolute; top: 100%; left: 0; min-width: 260px; background: #0c1929; border: 1px solid rgba(59, 130, 246, 0.4); border-radius: 12px; box-shadow: 0 16px 36px rgba(10, 37, 64, 0.14); padding: 10px; z-index: 2000; } .has-dropdown:hover .dropdown-menu, .has-dropdown:focus-within .dropdown-menu { display: block; } header nav ul.dropdown-menu { gap: 0; flex-direction: column; } .dropdown-menu li a { display: block; padding: 10px 14px; border-radius: 8px; white-space: nowrap; font-weight: 600; color: #E2E8F0 !important; background: none !important; box-shadow: none !important; } .dropdown-menu li a:hover { background: rgba(37, 99, 235, 0.35) !important; color: #ffffff !important; box-shadow: none !important; } .dropdown-menu li a::after { display: none !important; }  footer { background: #0b1424; color: #CBD5E1; text-align: center; padding: 24px 0; margin-top: 40px; } footer p { margin: 0; font-size: 0.9rem; }  .ai-chat-widget { position: fixed; right: 24px; bottom: 24px; z-index: 9999; font-family: 'Inter', Arial, sans-serif; } .ai-chat-toggle { width: 62px; height: 62px; border-radius: 50%; border: none; background: linear-gradient(135deg, #2563EB, #1E40AF); color: #ffffff; font-size: 1.7rem; box-shadow: 0 10px 28px rgba(37, 99, 235, 0.45); cursor: pointer; transition: transform 0.2s ease, box-shadow 0.2s ease; will-change: transform; } .ai-chat-toggle:hover { transform: scale(1.08); box-shadow: 0 14px 36px rgba(37, 99, 235, 0.55); } .ai-chat-panel { position: absolute; right: 0; bottom: 78px; width: 360px; max-width: calc(100vw - 32px); height: 500px; max-height: calc(100vh - 110px); background: rgba(255, 255, 255, 0.08); border-radius: 16px; box-shadow: 0 20px 50px rgba(10, 37, 64, 0.28); overflow: hidden; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; text-align: left; } .ai-chat-panel.hidden { display: none; } .ai-chat-header { background: linear-gradient(135deg, #0A2540, #2563EB); color: #ffffff; padding: 16px; display: flex; justify-content: space-between; align-items: center; } .ai-chat-header span { display: block; font-size: 0.82rem; opacity: 0.9; margin-top: 2px; } .ai-chat-close { background: transparent; border: none; color: #ffffff; font-size: 1.8rem; cursor: pointer; } .ai-chat-messages { flex: 1; padding: 16px; overflow-y: auto; background: rgba(12, 25, 41, 0.5); } .ai-chat-message { max-width: 88%; margin-bottom: 12px; padding: 11px 13px; border-radius: 14px; line-height: 1.45; font-size: 0.95rem; } .ai-chat-message.bot { background: rgba(255, 255, 255, 0.08); color: #94A3B8; border-bottom-left-radius: 4px; box-shadow: 0 2px 6px rgba(10, 37, 64, 0.08); } .ai-chat-message.user { background: linear-gradient(135deg, #2563EB, #1E40AF); color: #ffffff; margin-left: auto; border-bottom-right-radius: 4px; } .ai-chat-form { display: flex; gap: 8px; padding: 12px; border-top: 1px solid #E2E8F0; background: rgba(255, 255, 255, 0.08); } .ai-chat-form input { flex: 1; border: 1.5px solid #CBD5E1; border-radius: 999px; padding: 10px 14px; outline: none; font-family: inherit; transition: border-color 0.2s ease; } .ai-chat-form input:focus { border-color: #2563EB; } .ai-chat-form button { border: none; border-radius: 999px; padding: 10px 16px; background: linear-gradient(135deg, #2563EB, #1E40AF); color: #ffffff; font-weight: 700; cursor: pointer; transition: opacity 0.2s ease; } .ai-chat-form button:hover { opacity: 0.88; } .ai-chat-suggestions { display: flex; flex-direction: column; gap: 8px; margin: 8px 0 14px; } .ai-chat-suggestions button { border: 1.5px solid #BFDBFE; background: rgba(255, 255, 255, 0.08); color: #1D4ED8; border-radius: 999px; padding: 8px 12px; text-align: left; cursor: pointer; font-size: 0.88rem; transition: background 0.2s ease, color 0.2s ease; } .ai-chat-suggestions button:hover { background: #EFF6FF; color: #1E40AF; }  .honeypot-field { position: absolute !important; left: -9999px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; opacity: 0 !important; }  @media (max-width: 768px) { header .container { flex-direction: column; text-align: center; gap: 14px; } header nav { flex-direction: column; align-items: center; width: 100%; } header nav ul { flex-direction: column; gap: 12px; margin-bottom: 14px; align-items: center; } .auth-buttons { flex-direction: column; gap: 8px; width: 100%; } .auth-buttons .btn { width: 100%; text-align: center; } #hero h1 { font-size: 2.2rem; } #hero p { font-size: 1rem; } .page-hero h1 { font-size: 2.2rem; } section h2 { font-size: 2rem; } .hero-actions { flex-direction: column; align-items: stretch; } .hero-actions .btn { width: 100%; text-align: center; } .two-column-content, .contact-layout, .form-row { grid-template-columns: 1fr; } .dropdown-menu { position: static; box-shadow: none; margin-top: 6px; } } @media (max-width: 900px) { .dropdown-menu { position: static; box-shadow: none; margin-top: 8px; } }  a.demo-link { color: #2563EB !important; font-weight: 700 !important; animation: demo-nav-pulse 2.4s ease-in-out infinite; } @keyframes demo-nav-pulse { 0%, 100% { text-shadow: 0 0 0 rgba(37,99,235,0); } 50% { text-shadow: 0 0 10px rgba(37,99,235,0.55); } }  header .container { display: flex; justify-content: space-between; align-items: center; gap: 36px; } header nav { display: flex; align-items: center; gap: 28px; flex: 1; justify-content: flex-end; } .logo-img { max-height: 54px; width: auto; object-fit: contain; } header nav ul.main-nav { display: flex; align-items: center; gap: 22px; margin: 0; padding: 0; flex-wrap: nowrap; } .auth-buttons { display: flex; align-items: center; gap: 18px; flex-shrink: 0; } header nav ul li a { display: inline-flex; align-items: center; justify-content: center; white-space: nowrap; } @media (max-width: 980px) { header .container { flex-direction: column; gap: 18px; } header nav { flex-direction: column; gap: 16px; width: 100%; } header nav ul.main-nav { flex-wrap: wrap; justify-content: center; } .auth-buttons { justify-content: center; flex-wrap: wrap; } }  .logo-img { max-height: 46px; width: auto; object-fit: contain; } .logo a { display: flex; align-items: center; }  .breadcrumb-nav { display: none !important; }  .fp-demo-chat { background: rgba(255, 255, 255, 0.08); border: 1px solid #dbeafe; border-radius: 18px; overflow: hidden; box-shadow: 0 18px 45px rgba(10,37,64,.16); min-height: 420px; display: flex; flex-direction: column; } .fp-demo-messages { flex: 1; min-height: 330px; max-height: 430px; overflow-y: auto; padding: 20px; background: linear-gradient(180deg,#f8fbff 0%,#fff 100%); } .fp-demo-msg { max-width: 82%; padding: 11px 14px; border-radius: 16px; margin: 9px 0; line-height: 1.45; font-size: 14px; clear: both; animation: fpFadeIn .18s ease-out; } .fp-demo-msg-bot { background: #eef6ff; color: #0A2540; border-bottom-left-radius: 5px; float: left; } .fp-demo-msg-user { background: #2563EB; color: #fff; border-bottom-right-radius: 5px; float: right; } .fp-demo-input-wrapper { display: flex; gap: 10px; padding: 14px; border-top: 1px solid #e2e8f0; background: #fff; } .fp-demo-input { flex: 1; border: 1px solid #cbd5e1; border-radius: 999px; padding: 12px 16px; font-size: 14px; outline: none; } .fp-demo-input:focus { border-color: #2563EB; box-shadow: 0 0 0 3px rgba(37,99,235,.12); } .fp-demo-send-btn { border: 0; border-radius: 999px; padding: 12px 18px; background: #2563EB; color: #fff; font-weight: 700; cursor: pointer; } .fp-demo-send-btn:hover { background: #1d4ed8; } .fp-demo-footer { padding: 9px 14px; font-size: 12px; color: #64748b; background: #f8fafc; border-top: 1px solid #eef2f7; text-align: center; } .fp-demo-typing { display: inline-flex; gap: 4px; background: #eef6ff; padding: 13px 15px; border-radius: 16px; margin: 9px 0; } .fp-demo-typing span { width: 7px; height: 7px; border-radius: 50%; background: #2563EB; animation: fpTyping 1s infinite ease-in-out; } .fp-demo-typing span:nth-child(2) { animation-delay: .15s; } .fp-demo-typing span:nth-child(3) { animation-delay: .3s; } @keyframes fpTyping { 0%,80%,100%{opacity:.3;transform:translateY(0)} 40%{opacity:1;transform:translateY(-3px)} } @keyframes fpFadeIn { from{opacity:0;transform:translateY(4px)} to{opacity:1;transform:translateY(0)} }  .detailed-benefits-section, .industries-detail-section, .roi-section { padding: 4rem 2rem; background: #f8fafc; } .detailed-benefits-section:nth-child(even), .industries-detail-section:nth-child(even) { background: rgba(255, 255, 255, 0.08); } .detailed-benefit, .industry-detail { margin: 2rem 0; padding: 1.5rem; background: white; border-left: 4px solid #3b82f6; border-radius: 8px; box-shadow: 0 1px 3px rgba(0,0,0,0.1); } .detailed-benefit h3, .industry-detail h3 { color: #1e293b; font-size: 1.5rem; margin-bottom: 1rem; font-weight: 600; } .detailed-benefit p, .industry-detail p, .roi-section p { color: #475569; line-height: 1.8; font-size: 1.05rem; margin: 0.75rem 0; } .roi-section { background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: white; } .roi-section .section-heading h2 { color: white; } .roi-section p { color: #f1f5f9; font-size: 1.1rem; max-width: 900px; margin: 1.5rem auto; } @media (max-width: 768px) { .detailed-benefit, .industry-detail { padding: 1rem; } .detailed-benefit h3, .industry-detail h3 { font-size: 1.25rem; } }  .social-share {text-align:center;padding:2rem 1rem;background:#f8fafc;border-top:1px solid #e2e8f0}.social-share p{color:#64748b;font-size:.95rem;margin-bottom:1rem}.social-btn{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;margin:0 8px;border-radius:50%;transition:all .3s ease;text-decoration:none}.social-btn.facebook{background:#1877f2;color:#fff}.social-btn.twitter{background:#1da1f2;color:#fff}.social-btn.linkedin{background:#0a66c2;color:#fff}.social-btn.whatsapp{background:#25d366;color:#fff}.social-btn:hover{transform:translateY(-3px);box-shadow:0 4px 12px rgba(0,0,0,.15)}.social-btn svg{width:20px;height:20px}  #hero { background-image: linear-gradient(135deg, rgba(8,30,55,0.82), rgba(25,55,140,0.70), rgba(30,80,200,0.55)), url('/assets/hero-optimized.webp'); background-size: cover; background-position: center; background-repeat: no-repeat; } @media (max-width: 768px) { header { position: relative; top: auto; z-index: 10; padding: 0.55rem 0; } header .container { width: 94%; padding: 8px 0; gap: 10px; } header nav { width: 100%; gap: 10px; } header nav ul.main-nav, header nav ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; gap: 8px; margin: 0; } header nav ul li, header nav ul li a { width: 100%; } header nav ul li a { padding: 8px 10px; font-size: 0.88rem; min-height: 38px; } .auth-buttons { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; width: 100%; } .auth-buttons .btn { width: 100%; padding: 9px 10px; font-size: 0.9rem; } .dropdown-menu { width: 100%; max-height: 220px; overflow-y: auto; } #hero { min-height: auto; padding: 46px 0 54px; background-position: center top; } #hero .container { padding-left: 18px; padding-right: 18px; } } @media (max-width: 420px) { header nav ul.main-nav, header nav ul, .auth-buttons { grid-template-columns: 1fr; } }  .mobile-menu-toggle { display: none; } @media (max-width: 768px) { header { position: relative !important; top: auto !important; padding: 0.5rem 0 !important; } header .container { width: 94% !important; padding: 6px 0 !important; display: grid !important; grid-template-columns: 46px minmax(0, 1fr) !important; gap: 10px !important; align-items: center !important; text-align: left !important; } .mobile-menu-toggle { display: inline-flex !important; grid-column: 1 !important; grid-row: 1 !important; width: 42px; height: 42px; align-items: center; justify-content: center; flex-direction: column; gap: 5px; background: rgba(255, 255, 255, 0.08); border: 1px solid #dbe3ef; border-radius: 8px; box-shadow: 0 2px 8px rgba(10, 37, 64, 0.08); cursor: pointer; padding: 0; } .mobile-menu-toggle span { width: 20px; height: 2px; background: #e2e8f0; border-radius: 999px; transition: transform 0.2s ease, opacity 0.2s ease; } header.nav-open .mobile-menu-toggle span:nth-child(1) { transform: translateY(7px) rotate(45deg); } header.nav-open .mobile-menu-toggle span:nth-child(2) { opacity: 0; } header.nav-open .mobile-menu-toggle span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); } header .logo { grid-column: 2 !important; grid-row: 1 !important; justify-self: start !important; min-width: 0; } header .logo a { justify-content: flex-start !important; } .logo-img { max-height: 38px !important; } header nav { grid-column: 1 / -1 !important; width: 100% !important; display: none !important; flex-direction: column !important; align-items: stretch !important; gap: 10px !important; padding: 10px 0 4px !important; border-top: 1px solid #e2e8f0; margin-top: 4px; } header.nav-open nav { display: flex !important; } header nav ul.main-nav, header nav ul { display: flex !important; flex-direction: column !important; align-items: stretch !important; gap: 6px !important; width: 100% !important; margin: 0 !important; } header nav ul li, header nav ul li a { width: 100% !important; } header nav ul li a { justify-content: flex-start !important; min-height: 38px !important; padding: 8px 12px !important; font-size: 0.92rem !important; white-space: normal !important; } .auth-buttons { display: grid !important; grid-template-columns: 1fr !important; gap: 8px !important; width: 100% !important; } .auth-buttons .btn { width: 100% !important; padding: 9px 12px !important; text-align: center !important; } .dropdown-menu { position: static !important; width: 100% !important; max-height: 180px !important; overflow-y: auto !important; box-shadow: none !important; margin-top: 4px !important; } #hero { min-height: auto !important; padding-top: 42px !important; } }  .ai-chat-widget .hidden { display: none !important; } .ai-chat-invite { width: 320px; max-width: calc(100vw - 28px); background: #0b1728; color: #ffffff; border-radius: 0 0 18px 18px; box-shadow: 0 18px 44px rgba(2, 6, 23, 0.38); border: 1px solid rgba(191, 219, 254, 0.28); padding: 44px 18px 18px; text-align: center; position: relative; } .ai-chat-invite::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 4px; background: linear-gradient(90deg, #60A5FA, #2563EB, #0EA5E9); } .ai-chat-invite strong { display: block; font-size: 1.34rem; line-height: 1.25; margin-bottom: 10px; } .ai-chat-invite span { display: block; color: #E2E8F0; font-size: 0.96rem; margin-bottom: 22px; } .ai-chat-invite button { font-family: inherit; } .ai-chat-invite-close { position: absolute; top: 10px; right: 12px; width: 28px; height: 28px; border: 0; border-radius: 999px; background: transparent; color: #CBD5E1; font-size: 1.35rem; cursor: pointer; } .ai-chat-now, .ai-chat-no { display: block; width: 100%; min-height: 40px; border-radius: 8px; font-weight: 800; cursor: pointer; margin-top: 10px; } .ai-chat-now { border: 0; background: #BAE6FD; color: #07111f; } .ai-chat-no { border: 2px solid #BAE6FD; background: transparent; color: #ffffff; } .ai-chat-panel { border-radius: 18px 18px 10px 10px; } @media (max-width: 768px) { .ai-chat-widget { right: 8px !important; bottom: 12px !important; z-index: 9999 !important; } .ai-chat-invite { width: 244px; max-width: calc(100vw - 24px); padding: 38px 14px 14px; border-radius: 0 0 16px 16px; } .ai-chat-invite strong { font-size: 1.08rem; } .ai-chat-invite span { font-size: 0.86rem; margin-bottom: 16px; } .ai-chat-now, .ai-chat-no { min-height: 36px; font-size: 0.9rem; } .ai-chat-panel { right: 0 !important; bottom: 58px !important; width: 340px !important; max-width: calc(100vw - 20px) !important; height: 480px !important; max-height: calc(100vh - 96px) !important; } .ai-chat-toggle { width: 54px !important; height: 54px !important; } }  .roi-calculator-section { background: rgba(255, 255, 255, 0.08); padding: 56px 0; border-bottom: 1px solid #e2e8f0; } .roi-calculator-wrap { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(320px, 1.1fr); gap: 34px; align-items: center; } .roi-copy h2 { color: #0A2540; font-size: clamp(2rem, 4vw, 3rem); line-height: 1.1; margin: 10px 0 16px; } .roi-copy p { color: #475569; font-size: 1.08rem; max-width: 560px; } .roi-calculator-card { background: linear-gradient(135deg, #0A2540, #172554); color: #ffffff; border-radius: 22px; padding: 26px; box-shadow: 0 22px 55px rgba(10, 37, 64, 0.22); } .roi-control { margin-bottom: 20px; } .roi-control label { display: flex; justify-content: space-between; gap: 14px; font-weight: 700; margin-bottom: 10px; color: #E2E8F0; } .roi-control label strong { color: #93C5FD; white-space: nowrap; } .roi-control input[type="range"] { width: 100%; accent-color: #60A5FA; } .roi-result-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 22px 0 14px; } .roi-result-grid div { background: rgba(255, 255, 255, 0.15); border: 1px solid rgba(191, 219, 254, 0.22); border-radius: 16px; padding: 16px; } .roi-result-grid span { display: block; color: #CBD5E1; font-size: 0.84rem; margin-bottom: 8px; } .roi-result-grid strong { display: block; color: #ffffff; font-size: clamp(1.45rem, 4vw, 2.15rem); line-height: 1.1; } .roi-note { color: #CBD5E1; font-size: 0.88rem; margin: 0 0 18px; } .roi-cta { width: 100%; text-align: center; } @media (max-width: 768px) { .roi-calculator-section { padding: 38px 0; } .roi-calculator-wrap { grid-template-columns: 1fr; gap: 22px; } .roi-calculator-card { padding: 20px; border-radius: 18px; } .roi-result-grid { grid-template-columns: 1fr; } }  .home-pricing-section { padding: 62px 0; background: linear-gradient(180deg, #F8FAFC 0%, #ffffff 100%); border-bottom: 1px solid #E2E8F0; } .home-pricing-section .section-heading p { max-width: 760px; } .home-pricing-grid { align-items: stretch; margin-top: 8px; } .pricing-badge { display: inline-flex; align-self: flex-start; padding: 6px 11px; margin-bottom: 14px; border-radius: 999px; background: #EFF6FF; color: #1D4ED8; font-size: 0.78rem; font-weight: 800; letter-spacing: 0.02em; } .featured-badge { background: rgba(37, 99, 235, 0.12); color: #1E40AF; } .pricing-footnote { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-top: 24px; padding: 16px 20px; background: #ECFEFF; border: 1px solid #BAE6FD; border-radius: 14px; } .pricing-footnote p { margin: 0; color: #164E63; font-size: 0.95rem; } .pricing-footnote a { color: #1D4ED8; font-weight: 800; white-space: nowrap; text-decoration: none; } .pricing-footnote a:hover { text-decoration: underline; } @media (max-width: 768px) { .home-pricing-section { padding: 42px 0; } .pricing-footnote { flex-direction: column; align-items: flex-start; } }  .fp-section{padding:72px 0;color:#334155;background:#f8fafc}.fp-soft{background:#f8fafc;color:#334155}.fp-soft .eyebrow{background:rgba(37,99,235,.12);border-color:#bfdbfe;color:#1d4ed8}.fp-section h2{font-size:2.1rem;margin:0 0 14px;color:#0A2540}.fp-section-intro{max-width:760px;color:#475569;margin-bottom:28px}.fp-two-col{display:grid;grid-template-columns:1.05fr .95fr;gap:36px;align-items:center}.fp-card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.fp-card-grid article{background:#fff;border:1px solid #e2e8f0;border-radius:20px;padding:28px;box-shadow:0 8px 25px rgba(15,23,42,.04),0 1px 3px rgba(15,23,42,.06)}.fp-card-grid article h3{margin-top:0;color:#0A2540}.fp-card-grid article a{font-weight:700;color:#2563eb;text-decoration:none}.fp-check-list{list-style:none;padding:0;margin:18px 0}.fp-check-list li{padding:10px 0 10px 30px;position:relative;color:#334155}.fp-check-list li:before{content:'✓';position:absolute;left:0;color:#16a34a;font-weight:800}.fp-demo-band{background:linear-gradient(135deg,#eff6ff,#ffffff);color:#1e293b}.fp-demo-band p{color:#334155}.fp-demo-card{background:#0f172a;color:#e2e8f0;border-radius:22px;padding:24px;box-shadow:0 24px 60px rgba(15,23,42,.22)}.fp-chat-row{max-width:86%;padding:12px 14px;border-radius:14px;margin:10px 0;line-height:1.45}.fp-chat-row.visitor{background:#334155;color:#fff;margin-left:auto}.fp-chat-row.agent{background:#1d4ed8;color:#fff}.fp-roi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;align-items:stretch;margin:28px 0}.fp-roi-grid label,.fp-roi-result{background:#fff;border:1px solid #dbeafe;border-radius:18px;padding:20px;box-shadow:0 10px 28px rgba(37,99,235,.08)}.fp-roi-grid input{width:100%;margin:18px 0}.fp-roi-grid strong{display:block;color:#0A2540;font-size:1.4rem}.fp-roi-result{background:#0A2540;color:#fff}.fp-roi-result strong{font-size:2rem;color:#fff}.fp-roi-result small{display:block;color:#bfdbfe}.fp-pill-list{display:flex;flex-wrap:wrap;gap:12px}.fp-pill-list span{background:#fff;border:1px solid #bfdbfe;border-radius:999px;padding:10px 14px;color:#1e3a8a;font-weight:700}.home-hero{min-height:auto}.home-hero .hero-content{max-width:920px}.cta-band .btn{margin-top:12px}@media(max-width:900px){.fp-two-col,.fp-roi-grid{grid-template-columns:1fr}.fp-card-grid{grid-template-columns:1fr 1fr}}@media(max-width:640px){.fp-section{padding:48px 0}.fp-card-grid{grid-template-columns:1fr}.fp-section h2{font-size:1.65rem}.fp-roi-result strong{font-size:1.55rem}}  .pricing-toggle-container { display: inline-flex; align-items: center; background: #e2e8f0; border-radius: 9999px; padding: 6px; margin-bottom: 36px; margin-top: 20px; border: 1px solid #cbd5e1; } .pricing-toggle-option { padding: 10px 20px; border: none; background: none; cursor: pointer; border-radius: 9999px; font-weight: 600; font-size: 0.95rem; color: #475569; transition: background 0.3s ease, color 0.3s ease; } .pricing-toggle-option.active { background: #2563EB; color: #ffffff; box-shadow: 0 4px 12px rgba(37, 99, 235, 0.3); } .pricing-toggle-option:not(.active):hover { color: #0a2540; } .price-hidden { display: none; } .pricing-card .price { transition: transform 0.3s ease; } .pricing-card .price.annual-price { transform: scale(0.85); opacity: 0.7; } .pricing-card.flipped .price.monthly-price { transform: scale(0.85); opacity: 0.7; } .pricing-card.flipped .price.annual-price { transform: scale(1); opacity: 1; } .pricing-card .subtext { font-size: 0.85rem; color: #64748B; margin-top: auto; display: block; } .zero-risk-banner { background: #e2f0ff;  color: #1e3a8a;  border: 1px solid #a0c4ff; padding: 40px 20px; margin-top: 40px; border-radius: 14px; } .zero-risk-banner h2 { color: #0a2540;  margin-bottom: 16px; font-size: 2rem; } .zero-risk-banner p { max-width: 800px; margin: 0 auto 20px; font-size: 1.05rem; line-height: 1.5; } .zero-risk-banner .trust-anchor { font-size: 0.9rem; color: #3b82f6; font-weight: 600; } .zero-risk-banner .trust-anchor a { color: #3b82f6; text-decoration: none; } .zero-risk-banner .trust-anchor a:hover { color: #1d4ed8; }  .pricing-card.featured { border: 2px solid #2563EB; transform: translateY(-8px); box-shadow: 0 14px 36px rgba(37,99,235,0.18); } .pricing-card.featured .subtext { font-weight: 700; color: #1d4ed8; }  .hero-demo-console{margin:34px auto 0;max-width:920px;text-align:left;background:rgba(248,250,252,.98);color:#0A2540;border-radius:24px;padding:24px;box-shadow:0 24px 60px rgba(2,8,23,.22);border:1px solid rgba(203,213,225,.30)} .console-top{display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap}.console-top small{color:#64748b}.live-dot{width:10px;height:10px;background:#22c55e;border-radius:50%;box-shadow:0 0 0 7px rgba(34,197,94,.15)} .console-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:18px 0}.console-grid div,.console-feed,.voice-callout{background:#f8fafc;border:1px solid #e2e8f0;border-radius:16px;padding:14px}.console-grid span{display:block;color:#64748b;font-size:.82rem}.console-grid strong{display:block;color:#0f172a}.console-feed p{margin:6px 0}.voice-callout{margin-top:12px;background:#eff6ff}.voice-callout span{color:#1d4ed8;font-weight:800}.integration-logo-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:24px 0}.integration-logo-grid span{background:#fff;border:1px solid #e2e8f0;border-radius:16px;padding:16px;font-weight:800;color:#0A2540;box-shadow:0 8px 24px rgba(15,23,42,.06)}.integration-microcopy{font-weight:800;color:#1d4ed8}.pricing-toggle-wrap{text-align:center;margin:24px 0}.pricing-toggle-container{display:inline-flex;background:#eaf1ff;border:1px solid #bfdbfe;border-radius:999px;padding:5px;gap:4px}.pricing-toggle-option{border:0;border-radius:999px;padding:10px 18px;background:transparent;font-weight:800;color:#1e3a8a;cursor:pointer}.pricing-toggle-option.active{background:#2563EB;color:#fff;box-shadow:0 8px 20px rgba(37,99,235,.28)}.smb-pricing .pricing-card{position:relative}.pricing-badge{display:inline-block;background:#2563EB;color:#fff;border-radius:999px;padding:6px 12px;font-size:.75rem;font-weight:900;letter-spacing:.05em;margin-bottom:10px}.annual-note,.subtext{color:#64748b;font-size:.92rem}.zero-risk-banner{margin-top:34px;background:linear-gradient(135deg,#0A2540,#1d4ed8);color:#fff;border-radius:24px;padding:34px;text-align:center;box-shadow:0 18px 50px rgba(10,37,64,.22)}.zero-risk-banner p{max-width:850px;margin:10px auto}.zero-risk-banner a{color:#fff;text-decoration:underline;font-weight:800}.vertical-hero{background:linear-gradient(135deg,#eff6ff,#fff)} @media(max-width:800px){.console-grid,.integration-logo-grid{grid-template-columns:1fr}.hero-demo-console{padding:16px}.pricing-toggle-container{width:100%;justify-content:center}.pricing-toggle-option{flex:1;padding:10px 8px}.zero-risk-banner{padding:24px 16px}}  header .logo{ flex:0 0 auto; position:relative; z-index:2; } header .logo a{ display:flex; align-items:center; min-width:58px; padding-right:10px; } header nav{ min-width:0; } header nav ul.main-nav, header nav ul{ min-width:0; } header nav ul li:first-child a{ margin-left:4px; } @media (min-width:769px) and (max-width:1180px){ header .container{gap:18px;width:96%;} header nav{gap:14px;} header nav ul.main-nav,header nav ul{gap:10px;} header nav ul li a{font-size:.86rem;padding:7px 9px;} .auth-buttons{gap:10px;} .auth-buttons .btn{padding:9px 12px;font-size:.86rem;} .logo-img{max-height:40px!important;} } @media (max-width:768px){ header .logo a{min-width:0;padding-right:0;} header nav ul li:first-child a{margin-left:0;} }  html, body { max-width: 100%; overflow-x: hidden; } @media (max-width: 768px) { .ai-chat-widget { right: 8px !important; bottom: 8px !important; max-width: calc(100vw - 16px) !important; } .ai-chat-panel { position: fixed !important; right: 6px !important; bottom: 62px !important; width: min(260px, calc(100vw - 16px)) !important; height: min(340px, 50vh) !important; max-height: 50vh !important; border-radius: 14px !important; } .ai-chat-header { padding: 12px 14px !important; } .ai-chat-header strong { font-size: 0.96rem !important; } .ai-chat-header span { font-size: 0.76rem !important; } .ai-chat-messages { padding: 12px !important; } .ai-chat-message { font-size: 0.9rem !important; padding: 9px 11px !important; } .ai-chat-form { padding: 10px !important; gap: 6px !important; } .ai-chat-form input { min-width: 0 !important; font-size: 16px !important; padding: 9px 12px !important; } .ai-chat-form button { padding: 9px 12px !important; font-size: 0.9rem !important; } } @media (max-width: 380px) { .ai-chat-panel { width: calc(100vw - 18px) !important; right: 9px !important; height: min(390px, 64vh) !important; max-height: 64vh !important; } }  * { box-sizing: border-box; } html, body { width: 100%; max-width: 100%; overflow-x: hidden; } img, svg, video, canvas, iframe { max-width: 100%; height: auto; } .container, section, header, footer, main { max-width: 100%; } @media (max-width: 768px) { body { min-width: 0 !important; } .container { width: min(94%, calc(100vw - 20px)) !important; padding-left: 0 !important; padding-right: 0 !important; } section { overflow-x: clip; } h1 { font-size: clamp(2rem, 11vw, 3rem) !important; line-height: 1.08 !important; overflow-wrap: anywhere; } h2 { font-size: clamp(1.55rem, 7vw, 2.05rem) !important; line-height: 1.15 !important; overflow-wrap: anywhere; } h3, p, a, li, span, strong { overflow-wrap: anywhere; } .btn, button, input, textarea, select { max-width: 100% !important; } .btn { white-space: normal !important; text-align: center; } .hero-buttons, .cta-buttons, .auth-buttons { width: 100% !important; flex-wrap: wrap !important; } .hero-buttons .btn, .cta-buttons .btn { width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; } .pricing-grid, .features-grid, .stats-grid, .cards-grid, .comparison-grid, .fp-card-grid, .fp-roi-grid, .console-grid, .integration-logo-grid, .vertical-grid, .solutions-grid, .trust-grid { grid-template-columns: 1fr !important; width: 100% !important; } .pricing-card, .feature-card, .stat-card, .contact-form-card, .hero-demo-console, .zero-risk-banner, .fp-demo-card, .fp-roi-grid label, .fp-roi-result, .integration-logo-grid span { width: 100% !important; max-width: 100% !important; } .hero-demo-console, .zero-risk-banner { padding-left: 16px !important; padding-right: 16px !important; } .pricing-toggle-container { max-width: 100% !important; overflow: hidden; } .pricing-toggle-option { min-width: 0 !important; white-space: normal !important; } table { display: block; max-width: 100%; overflow-x: auto; } } @media (max-width: 420px) { .container { width: calc(100vw - 18px) !important; } header .container { grid-template-columns: 42px minmax(0, 1fr) !important; } .logo-img { max-width: calc(100vw - 78px) !important; height: auto !important; } .ai-chat-toggle { width: 50px !important; height: 50px !important; } }  .zero-risk-banner h2, .zero-risk-banner .trust-anchor, .zero-risk-banner .trust-anchor a { color: #ffffff !important; } .zero-risk-banner .trust-anchor { opacity: .98; }  .signal-hero{padding:96px 0 64px;background:radial-gradient(circle at 20% 20%,rgba(37,99,235,.18),transparent 32%),radial-gradient(circle at 80% 90%,rgba(245,158,11,.08),transparent 40%),linear-gradient(135deg,#0a1628,#0f1a2e 58%,#111827);color:#fff;overflow:hidden}.signal-hero h1{max-width:820px;font-size:clamp(2.25rem,5vw,4.6rem);line-height:.98;margin:14px 0}.signal-hero p{max-width:850px;color:#cbd5e1;font-size:1.12rem}.signal-agent-card{margin-top:24px;padding:18px 20px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.08);border-radius:20px;display:flex;gap:12px;flex-wrap:wrap}.signal-agent-card span{color:#bae6fd}.signal-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:22px}.signal-article{padding:72px 0;background:transparent;color:#cbd5e1}.container.narrow{max-width:880px}.signal-article h1{font-size:clamp(2rem,4vw,3.6rem);line-height:1.05;margin:12px 0}.signal-article h2{margin-top:34px}.signal-article p,.signal-article li{font-size:1.08rem;line-height:1.75;color:#cbd5e1}.signal-article .signal-back{display:block;text-align:center;margin-bottom:4px;color:#60a5fa;font-weight:800;text-decoration:none;font-size:0.95rem}.signal-visual img{width:100%;border-radius:18px}.signal-section{padding:72px 0}.signal-section h2{color:#e2e8f0}.signal-card{background:rgba(15,23,42,.55);border:1px solid rgba(59,130,246,.15);border-radius:18px;padding:22px;text-align:left;transition:transform .25s ease,box-shadow .25s ease}.signal-card:hover{transform:translateY(-3px);box-shadow:0 12px 30px rgba(0,0,0,.25)}.signal-card span{color:#60a5fa;font-weight:700;font-size:.9rem}.signal-card h2{margin:18px 0 10px}.signal-card h2 a{color:#e2e8f0;text-decoration:none}.signal-card p{color:#94a3b8}.signal-meta{color:#64748b;font-size:.9rem}.signal-links{display:flex;gap:12px;flex-wrap:wrap;margin-top:34px}.signal-links a{padding:12px 16px;border-radius:999px;background:#dbeafe;color:#1d4ed8;font-weight:800;text-decoration:none}
.signal-article h1{color:#f1f5f9;font-size:clamp(2rem,4vw,3.6rem);line-height:1.1;margin:16px auto 8px;font-weight:800;text-align:center;max-width:820px}
.signal-article h2{color:#e2e8f0;font-size:2.4rem;font-weight:800;margin:34px 0 14px}
.signal-article h3{color:#e2e8f0;font-weight:700;font-size:1.2rem;margin:22px 0 8px}
.signal-article p,.signal-article li{color:#cbd5e1;font-size:1.08rem;line-height:1.75}
.signal-article a{color:#60a5fa;text-decoration:underline}
.signal-article a:hover{color:#93c5fd}
.signal-article strong{color:#f1f5f9}
.signal-article ol{padding-left:1.5rem;margin:16px 0}
.signal-article li{margin:8px 0}
.signal-back{color:#60a5fa;font-weight:800;text-decoration:none;display:inline-block;margin-bottom:18px}
.signal-back:hover{color:#93c5fd}
.signal-visual{background:#0f172a;color:#e2e8f0}
.signal-meta{color:#94a3b8;font-size:.9rem}
.signal-links a{background:rgba(37,99,235,.2);color:#93c5fd;padding:12px 16px;border-radius:999px;font-weight:800;text-decoration:none;display:inline-block}
.signal-links a:hover{background:rgba(37,99,235,.35)}
.container.narrow{max-width:880px}
@media(max-width:900px){.signal-grid,.signal-visual{grid-template-columns:1fr}.signal-hero{padding:72px 0 48px}}  .smb-app-hero{padding:90px 0;background:radial-gradient(circle at 20% 20%,rgba(37,99,235,.18),transparent 34%),linear-gradient(135deg,#06111f,#0f172a);color:#fff}.smb-app-hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center}.smb-app-hero h1{font-size:clamp(2.3rem,5vw,4.8rem);line-height:1;margin:12px 0}.smb-app-hero p{color:#cbd5e1;font-size:1.12rem}.smb-phone{background:#fff;color:#0f172a;border-radius:32px;padding:24px;box-shadow:0 30px 80px rgba(0,0,0,.28)}.phone-top{font-weight:900;margin-bottom:16px}.metric-row{display:flex;justify-content:space-between;align-items:center;border:1px solid #e2e8f0;border-radius:16px;padding:12px 14px;margin:10px 0}.metric-row b{font-size:2rem;color:#2563eb}.mini-task{padding:11px 12px;border-radius:14px;background:#f1f5f9;margin-top:10px}.mini-task.done{background:#dcfce7;color:#166534}.smb-feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.smb-feature-grid article{background:#fff;border:1px solid #e2e8f0;border-radius:22px;padding:22px;box-shadow:0 12px 35px rgba(15,23,42,.08)}.smb-demo-flow{padding:70px 0;background:#eff6ff}.smb-demo-flow li{margin:12px 0;font-weight:700}@media(max-width:900px){.smb-app-hero-grid,.smb-feature-grid{grid-template-columns:1fr}.smb-app-hero{padding:64px 0}}  .video-flow-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:24px}.video-flow-grid article{background:#fff;border:1px solid #bfdbfe;border-radius:22px;padding:22px;text-align:left;box-shadow:0 12px 35px rgba(15,23,42,.08)}.video-flow-grid span{display:inline-grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#2563eb;color:#fff;font-weight:900;margin-bottom:10px}.video-flow-grid h3{margin:6px 0 8px;color:#0f172a}.video-flow-grid p{margin:0;color:#334155;line-height:1.6}@media(max-width:900px){.video-flow-grid{grid-template-columns:1fr}}  .smb-demo-flow .container{max-width:1180px;margin-inline:auto}.video-flow-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:24px}.video-flow-grid article{position:relative;background:#fff;border:1px solid #bfdbfe;border-radius:22px;padding:24px 22px 22px 82px;text-align:left;box-shadow:0 12px 35px rgba(15,23,42,.08);overflow:hidden}.video-flow-grid article span{position:absolute;left:22px;top:24px;display:grid;place-items:center;width:44px;height:44px;border-radius:999px;background:#2563eb;color:#fff;font-weight:900;line-height:1}.video-flow-grid h3{margin:0 0 8px;color:#0f172a}.video-flow-grid p{margin:0;color:#334155;line-height:1.6}@media(max-width:900px){.video-flow-grid{grid-template-columns:1fr}.video-flow-grid article{padding-left:76px}} 

/* Dropdown menu contrast fixes - visible on dark background */
.dropdown-menu a,
.dropdown-menu a:link,
.dropdown-menu a:visited {
  color: #e2e8f0 !important;
  font-weight: 500 !important;
}

.dropdown-menu a:hover,
.dropdown-menu a:focus {
  color: #ffffff !important;
  background: rgba(59, 130, 246, 0.15) !important;
  border-radius: 6px !important;
}

/* Non-hero sections text contrast */
.fp-section p,
.fp-section li,
.fp-section span {
  color: #334155;
}

/* Section headings on dark backgrounds */
.section-heading h2,
.service-section h2,
.intel-section h2,
.feature-section h2,
.pricing-section h2 {
  color: #e2e8f0 !important;
}

/* Border contrast - make borders visible on dark bg */
.pricing-card,
.feature-card,
.testimonial-card,
.vertical-card {
  border-color: rgba(59, 130, 246, 0.3) !important;
}

/* Home page pricing cards - solid background on light fp-section */
.fp-section .pricing-card { background: #ffffff; }

/* Override dark bg section text — ROI result card */
#roi-calculator .fp-roi-result span { color: #ffffff; }
#roi-calculator .fp-roi-result small { color: #bfdbfe; }

/* Override dark bg section text — cta-band */
section.cta-band span { color: #ffffff; }
section.cta-band p { color: #f1f5f9; }
/* ═══ Chat Widget ═══ */
.ai-chat-widget { font-family: 'Inter', Arial, sans-serif; font-size: 0.95rem; }
.ai-chat-panel { background: #ffffff !important; color: #0f172a !important; border: 1px solid #e2e8f0 !important; box-shadow: 0 20px 60px rgba(0,0,0,0.25) !important; border-radius: 18px !important; overflow: hidden !important; display: flex !important; flex-direction: column !important; }
.ai-chat-header { background: #0f172a !important; color: #ffffff !important; padding: 16px 20px !important; display: flex !important; justify-content: space-between !important; align-items: center !important; }
.ai-chat-header strong { color: #ffffff !important; font-size: 1rem !important; }
.ai-chat-header span { color: #94a3b8 !important; font-size: 0.8rem !important; display: block !important; }
.ai-chat-close { background: none !important; border: none !important; color: #94a3b8 !important; font-size: 1.5rem !important; cursor: pointer !important; padding: 0 4px !important; }
.ai-chat-messages { background: #ffffff !important; padding: 16px 20px !important; max-height: 320px !important; overflow-y: auto !important; flex: 1 !important; }
.ai-chat-message { padding: 10px 14px !important; border-radius: 12px !important; margin: 8px 0 !important; max-width: 85% !important; line-height: 1.45 !important; font-size: 0.92rem !important; }
.ai-chat-message.bot { background: #f1f5f9 !important; color: #0f172a !important; margin-right: auto !important; }
.ai-chat-message.user { background: #2563eb !important; color: #ffffff !important; margin-left: auto !important; }
.ai-chat-form { display: flex !important; gap: 8px !important; padding: 12px 16px !important; border-top: 1px solid #e2e8f0 !important; background: #ffffff !important; }
.ai-chat-form input { flex: 1 !important; background: #ffffff !important; color: #0f172a !important; border: 1.5px solid #cbd5e1 !important; border-radius: 8px !important; padding: 10px 14px !important; font-size: 0.92rem !important; font-family: inherit !important; }
.ai-chat-form button[type="submit"] { background: #2563eb !important; color: #ffffff !important; border: none !important; border-radius: 8px !important; padding: 10px 20px !important; font-weight: 700 !important; font-size: 0.9rem !important; cursor: pointer !important; }
.ai-chat-invite { background: #0f172a !important; color: #ffffff !important; border: 1px solid #334155 !important; border-radius: 18px !important; padding: 20px !important; box-shadow: 0 20px 60px rgba(0,0,0,0.3) !important; text-align: center !important; }
.ai-chat-invite strong { display: block !important; color: #ffffff !important; font-size: 1.05rem !important; margin-bottom: 4px !important; }
.ai-chat-invite span { color: #cbd5e1 !important; font-size: 0.88rem !important; display: block !important; margin-bottom: 14px !important; }
.ai-chat-now { background: #2563eb !important; color: #ffffff !important; border: none !important; border-radius: 8px !important; padding: 10px 24px !important; font-weight: 700 !important; cursor: pointer !important; font-size: 0.9rem !important; }
.ai-chat-no { background: transparent !important; color: #94a3b8 !important; border: 1px solid #475569 !important; border-radius: 8px !important; padding: 10px 18px !important; font-weight: 600 !important; cursor: pointer !important; font-size: 0.9rem !important; }
.ai-chat-toggle { background: #2563eb !important; color: #ffffff !important; border: none !important; border-radius: 50% !important; width: 56px !important; height: 56px !important; font-size: 1.5rem !important; box-shadow: 0 4px 20px rgba(37,99,235,0.4) !important; cursor: pointer !important; line-height: 1 !important; }

/* ═══ Dark bg sections — text readability ═══ */
.signal-hero p,
.signal-hero li,
.signal-hero span { color: #cbd5e1; }
.signal-hero .eyebrow { color: #ffffff; background: rgba(255,255,255,0.2); border-color: rgba(255,255,255,0.28); }
.smb-app-hero p,
.smb-app-hero li,
.smb-app-hero span { color: #cbd5e1; }
.smb-app-hero .eyebrow { color: #fff; }
.contact-page-section h2,
.content-page-section h2 { color: #f1f5f9; }
.contact-page-section p,
.contact-page-section li,
.content-page-section p,
.content-page-section li { color: #cbd5e1; }
.contact-page-section h2,
.content-page-section h2 { color: #f1f5f9; }
.contact-page-section strong,
.content-page-section strong { color: #e2e8f0; }
.contact-page-section a,
.content-page-section a { color: #60a5fa; font-weight: 600; }
.contact-page-section .service-detail-list li,
.content-page-section .service-detail-list li { color: #cbd5e1; }
/* ═══ Gap reduction — consecutive sections ═══ */
.fp-section + .fp-section { padding-top: 36px; }
.signal-hero + .fp-section { padding-top: 52px; }
.smb-app-hero + .fp-section { padding-top: 52px; }


/* ═══ Service cards — matching backgrounds & bright headers ═══ */
.service-detail-card { background: linear-gradient(180deg, #0f1f3a 0%, #0a2540 100%) !important; border: 1px solid rgba(148, 163, 184, 0.15) !important; }
.featured-service-card { border: 2px solid rgba(37, 99, 235, 0.5) !important; }
.shiny-service-card { border: 1px solid rgba(37, 99, 235, 0.5) !important; }
.service-detail-card h2 { color: #ffffff !important; font-weight: 800 !important; letter-spacing: -0.02em !important; }
.service-detail-card .service-detail-list li { color: #cbd5e1 !important; }
.service-label { background: rgba(37, 99, 235, 0.35) !important; color: #93C5FD !important; border: 1px solid rgba(147, 197, 253, 0.3) !important; }

.terms-checkbox-wrap{margin:16px 0}.terms-checkbox-wrap .terms-label{display:flex;align-items:center;gap:8px;font-size:.85rem;color:#94a3b8;cursor:pointer}.terms-checkbox-wrap .terms-label input[type=checkbox]{width:16px;height:16px;accent-color:#3b82f6;cursor:pointer}.terms-checkbox-wrap .terms-label a{color:#60a5fa;text-decoration:underline}

.ai-chat-avatar{width:32px;height:32px;border-radius:50%;margin-right:8px;flex-shrink:0;object-fit:cover}

@media (max-width: 768px) { .services-detail-grid { grid-template-columns: 1fr !important; } }
.signal-article .eyebrow{display:block;text-align:center;color:#60a5fa;font-weight:700;font-size:0.8rem;text-transform:uppercase;letter-spacing:1.5px;margin-bottom:0}
.signal-article .signal-meta{text-align:center;color:#94a3b8;font-size:.9rem}
.signal-article .container.narrow{max-width:820px;padding:20px}

/* ===== Article page override fix (May 24) ===== */
.signal-article {
  padding: 56px 0;
}
.signal-article .container.narrow {
  max-width: 820px;
  padding: 20px;
  text-align: left;
}
/* Breadcrumb area - back link + eyebrow tag grouped together */
.signal-article .signal-back {
  display: inline-block;
  text-align: left;
  margin-bottom: 0;
  color: #60a5fa;
  font-weight: 700;
  text-decoration: none;
  font-size: 0.95rem;
  vertical-align: middle;
}
.signal-article .signal-back:hover {
  color: #93c5fd;
  text-decoration: underline;
}
.signal-article .eyebrow {
  display: inline-block;
  text-align: center;
  color: #bae6fd;
  font-weight: 700;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin: 0 0 0 10px;
  padding: 4px 12px;
  border-radius: 999px;
  background: rgba(37,99,235,.2);
  border: 1px solid rgba(37,99,235,.3);
  vertical-align: middle;
}
.signal-article h1 {
  color: #f1f5f9;
  font-size: clamp(2rem,4vw,3.6rem);
  line-height: 1.1;
  margin: 24px auto 8px;
  font-weight: 800;
  text-align: left;
  max-width: 820px;
}
.signal-article .signal-meta {
  text-align: left;
  color: #94a3b8;
  font-size: .9rem;
  margin-bottom: 32px;
}
/* Visual suggestion block */
.signal-visual {
  background: #0f172a;
  color: #e2e8f0;
  margin: 28px 0;
  padding: 18px;
  border-radius: 26px;
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 20px;
  align-items: center;
}
.signal-visual img {
  width: 100%;
  border-radius: 18px;
}
.signal-visual div {
  font-size: 1rem;
  line-height: 1.6;
  color: #cbd5e1;
}
.signal-visual strong {
  color: #f1f5f9;
}
/* Fix h2 color - was getting blue override from section h2 */
.signal-article h2 {
  color: #e2e8f0;
}

/* ===== Hero section centering fix ===== */
.signal-hero {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  min-height: calc(100vh - 60px);
}
.signal-hero .container {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  width: min(94%, 820px) !important;
  margin: 0 auto !important;
  padding: 20px !important;
  gap: 14px !important;
  grid-template-columns: none !important;
}
.signal-hero h1 {
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
.signal-hero p {
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
.signal-hero .signal-agent-card {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 8px !important;
  text-align: center !important;
}
.signal-hero .signal-agent-card strong,
.signal-hero .signal-agent-card span {
  display: inline;
  text-align: center;
}

/* ===== Service cards equal height fix ===== */
.services-detail-grid {
  align-items: stretch !important;
}
.services-detail-grid > .service-detail-card {
  display: flex;
  flex-direction: column;
}
.services-detail-grid > .service-detail-card > .service-detail-list {
  flex: 1 1 auto;
}
.services-detail-grid > .service-detail-card > div:last-child {
  margin-top: auto;
}
.services-detail-grid > .service-detail-card > div:last-child .btn {
  display: block;
  width: 100%;
  text-align: center;
}