/* === Cleva.Bot Shared CSS ============================================= */ /* Tokens */ :root{ --navy:#0a192f; --aqua:#00d4d8; --light:#f8f9fa; --muted:#6c757d; /* dark theme tokens used by pricing section */ --bg:#0b0f1a; --panel:#101829; --text:#e8eefc; --altmuted:#9fb2d4; --line:#1f2a44; --brand:#8ee3ff; --brand-strong:#66d1ff; --brand-glow: 0 0 40px rgba(102,209,255,.25); --ok:#b6f09c; --warn:#ffd789; --shadow: 0 10px 30px rgba(0,0,0,.35); --radius: 18px; --radius-xl: 26px; --maxw: 1200px; } /* ===== Landing styles (UNCHANGED behaviour) =========================== */ html,body,p{ font-family:'Rubik',system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,'Helvetica Neue',Arial,'Noto Sans','Apple Color Emoji','Segoe UI Emoji','Segoe UI Symbol',sans-serif; color:#0b1728; } .navbar{padding:1rem 0;background:#120a2fcc} .navbar .navbar-brand{font-weight:800;letter-spacing:.4px;color:#fff} .navbar .navbar-brand span{color:var(--aqua)} .navbar-nav .nav-link{color:#e6f1ff;opacity:.85} .navbar-nav .nav-link:hover{opacity:1;color:#fff} .btn-aqua{background:#1a77f4;color:#FFF;border:none;font-weight:600} .btn-aqua:hover{filter:brightness(0.95);color:#071221} .btn-outline-lightbtn{border-width:2px;border-color:#ddd;} .link-aqua{color:var(--aqua);} p { font-weight: 300; line-height: 1.6; font-size: 1.12em; } p.lead { font-weight: 300; line-height: 1.8; font-size: 1.32em; } .hero{ position:relative; background:radial-gradient(1200px 600px at 70% 10%,#00d4d840,transparent 60%), linear-gradient(160deg,#0a192f 0%,#0a192f 60%,#0e2544 100%); color:#e6f1ff; background:url(/brand/spacebg.jpg); } .hero .lead{color:#b3c5ff;line-height:1.75;font-weight:400} .hero-img{max-width:520px;width:100%;border-radius:16px;box-shadow:0 20px 40px #0006;background:#0f203a;border:1px solid #ffffff0f} .badge-soft{background:#00d4d826;color:var(--aqua);border:1px solid #00d4d859;font-weight:600;font-size:85%;} .pillar{border-radius:14px;padding:24px;background:#120a2f;color:#fff;outline:1px solid #ccc;box-shadow:0 6px 18px #1018280f;height:100%} .pillar .icon{width:44px;height:44px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;background:#00d4d826;color:var(--aqua);font-weight:800} blockquote{font-family:"Tinos", Times New Roman, Times, Georgia, serif;font-size:22px;color:#555;} .logo-strip img{height:38px;opacity:.85;filter:grayscale(100%)} .logo-strip img:hover{opacity:1;filter:grayscale(0%)} .how-step{border-radius:14px;background:#d4e5f5;border:1px solid #00d4d859} .case-card{border-radius:14px;box-shadow:0 8px 24px #10182826;border:1px solid #eef1f5} .features{background:#120a2f;color:#e6f1ff} .feature-item{background:#ffffff08;border:1px solid #ffffff14;border-radius:14px;padding:18px;height:100%} .pricing-card{border-radius:16px;box-shadow:0 16px 40px #1018281f} .card-header{background:#fff} .faq .btn-link{color:#0a192f;font-weight:600} .faq .collapse{background:aliceblue;} .final-cta{background:var(--aqua)} .client-logos .item{display:flex;align-items:center;justify-content:center;padding:0 10px;} .client-logos img{width:auto;max-height:60px;opacity:.9;filter:grayscale(100%);transition:opacity .2s ease} .client-logos img:hover{opacity:1;filter:none} #owl-testimonial .item{display:block;width:100%;height:auto;} #owl-testimonial .item img{width:240px;margin:0 auto;} .divider{height:1px;background:linear-gradient(90deg,transparent,#00000014,transparent)} .smallcaps{letter-spacing:.08em;text-transform:uppercase;font-weight:700;font-size:.78rem;color:#6b7e99} .shadow-soft{box-shadow:0 12px 36px rgba(16,24,40,.15);} /* ===== Pricing styles (SCOPED – won’t affect landing) ================= */ /* Use on /pricing */ .cb-pricing{ background: radial-gradient(1200px 800px at 80% -100px, rgba(102,209,255,.08), transparent 60%), radial-gradient(900px 900px at -10% 0%, rgba(142,227,255,.10), transparent 60%), var(--bg); color:var(--text); -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; } /* dark hero variant for pricing (optional) */ .cb-pricing .hero .lead{color:var(--altmuted);} .cb-pricing .hero h1{letter-spacing:-.02em;} /* wrapper (you can still use .container; this is just a cap helper) */ .cb-wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px;} /* Plans grid */ .cb-plans{padding:24px 0 10px;} .cb-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;} @media (max-width:992px){.cb-grid{grid-template-columns:1fr;}} /* Plan cards (avoid Bootstrap .card collisions) */ .cb-card{ background:linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,0)); border:1px solid rgba(255,255,255,.06); border-radius:var(--radius-xl); box-shadow:var(--shadow); position:relative; } .cb-card .cb-inner{padding:26px;} .cb-card h3{font-size:1.25rem;color:#fff;margin-bottom:.25rem;} .cb-price{display:flex;align-items:flex-end;gap:8px;margin:.5rem 0 1.1rem;} .cb-price .currency{opacity:.75} .cb-price .amt{font-size:2.4rem;font-weight:800;letter-spacing:-.02em} .cb-price .per{opacity:.6;font-weight:600} .cb-setup{font-size:.95rem;color:var(--altmuted);padding-top:8px;border-top:1px dashed var(--line);margin-top:12px} /* features */ .cb-features{list-style:none;padding:0;margin:18px 0;} .cb-features li{display:flex;gap:10px;align-items:flex-start;padding:8px 0;border-bottom:1px dashed rgba(255,255,255,.06);} .cb-features li:last-child{border-bottom:none;} .cb-tick{width:18px;height:18px;border-radius:50%;background:rgba(182,240,156,.18);display:inline-flex;align-items:center;justify-content:center;font-size:12px;color:var(--ok);flex:0 0 18px} /* buttons on dark */ .cb-btn{display:inline-block;margin-top:14px;padding:11px 16px;border-radius:12px;font-weight:800;background:#0f2030;color:var(--text);border:1px solid rgba(255,255,255,.10);text-decoration:none;} .cb-btn-primary{background:linear-gradient(135deg,var(--brand),var(--brand-strong));color:#00131d;box-shadow:var(--brand-glow);} a.link-aqua {color:aqua;} a.link-aqua:hover{color:magenta;} /* popular badge */ .cb-badge{position:absolute;top:14px;right:14px;font-size:.75rem;font-weight:800;letter-spacing:.4px;color:#00131d;background:linear-gradient(135deg,#ffe28a,#ffd35a);padding:6px 10px;border-radius:999px;box-shadow:0 8px 16px rgba(255,211,90,.25);} /* Add-ons */ .cb-addons{padding:8px 0 32px;} .cb-addons-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;} @media (max-width:992px){.cb-addons-grid{grid-template-columns:1fr;}} .cb-addon{background:linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,0));border:1px solid rgba(255,255,255,.06);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow);} .cb-addon h4{margin:.2rem 0 .2rem;color:#fff;} .cb-addon .cb-addon-price{font-weight:800;margin:.25rem 0 .75rem;color:#fff;} /* Fine print on dark */ .cb-muted{color:var(--altmuted)} /* Let links inside dark sections use brand aqua/blue */ .cb-pricing a{color:var(--brand-strong);text-decoration:none;} .grecaptcha-badge {visibility: hidden;} .recapv3 {color:#555; display: inline;} .recapv3 label {font-size: 0.9em; padding-left: 10px; font-weight: normal;} .recapv3 label a {color:#221199} .recapv3 label a:hover {text-decoration:underline} .recapv3 img {width:28px;}