:root{ --navy:#0b1d33; --navy2:#122a47; --blue:#2d7ff9; --cyan:#22d3ee; --ink:#1a2b42; --muted:#5b6b81; --bg:#f7fafd; --card:#ffffff; --line:#e3ebf4; } *{margin:0;padding:0;box-sizing:border-box} /* Early-access prompts toggle: remove .ea-off from to re-enable */ .ea-off .ea{display:none !important} html{scroll-behavior:smooth} body{font-family:'Inter',system-ui,sans-serif;color:var(--ink);background:var(--bg);line-height:1.6;overflow-x:hidden} .wrap{max-width:1120px;margin:0 auto;padding:0 24px} h1,h2,h3,.logo-word{font-family:'Sora','Inter',sans-serif} /* NAV */ nav{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:50} .nav-inner{display:flex;align-items:center;justify-content:space-between;height:68px} .logo{display:flex;align-items:center;gap:10px;text-decoration:none} .logo-word{font-size:22px;font-weight:700;color:var(--navy);letter-spacing:-.02em} .logo-word span{background:linear-gradient(90deg,var(--blue),var(--cyan));-webkit-background-clip:text;background-clip:text;color:transparent} .logo-word .tm{font-size:.42em;font-weight:600;vertical-align:.85em;margin-left:1px;color:var(--muted);-webkit-text-fill-color:currentColor;letter-spacing:0} .btn{display:inline-block;padding:12px 22px;border-radius:10px;font-weight:600;font-size:15px;text-decoration:none;transition:all .15s} .btn-primary{background:linear-gradient(90deg,var(--blue),#1e6ae0);color:#fff;box-shadow:0 4px 14px rgba(45,127,249,.35)} .btn-primary:hover{transform:translateY(-1px);box-shadow:0 6px 20px rgba(45,127,249,.45)} .btn-ghost{color:var(--navy);border:1.5px solid var(--line);background:#fff} .btn-ghost:hover{border-color:var(--blue);color:var(--blue)} .btn-lg{padding:15px 30px;font-size:16px} /* HERO */ .hero{background:radial-gradient(1200px 600px at 70% -10%,#16375e 0%,var(--navy) 55%);color:#fff;padding:84px 0 96px;overflow:hidden} .hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center} .kicker{vertical-align:middle;display:inline-flex;align-items:center;gap:8px;background:rgba(34,211,238,.12);border:1px solid rgba(34,211,238,.35);color:var(--cyan);font-size:13px;font-weight:600;padding:6px 14px;border-radius:100px;margin-bottom:22px;letter-spacing:.02em} .hero h1{font-size:46px;line-height:1.12;font-weight:800;letter-spacing:-.02em;margin-bottom:20px} .hero h1 em{font-style:normal;background:linear-gradient(90deg,var(--cyan),#7dd3fc);-webkit-background-clip:text;background-clip:text;color:transparent} .hero p.sub{font-size:18px;color:#b9c8dc;max-width:520px;margin-bottom:32px} .hero-ctas{display:flex;gap:14px;flex-wrap:wrap} .hero .btn-ghost{background:transparent;color:#dce8f7;border-color:rgba(255,255,255,.25)} .hero .btn-ghost:hover{border-color:var(--cyan);color:var(--cyan)} .hero-note{margin-top:18px;font-size:13.5px;color:#8aa0bc} /* Dashboard mock */ .mock{background:#0e2440;border:1px solid #1d3a5f;border-radius:16px;padding:20px;box-shadow:0 30px 80px rgba(0,0,0,.45)} .mock-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px} .mock-title{font-size:13px;font-weight:600;color:#9fb4cf} .mock-dots{display:flex;gap:6px} .mock-dots i{width:9px;height:9px;border-radius:50%;background:#28486f;display:block} .mock-row{display:flex;align-items:center;gap:12px;background:#122c4e;border:1px solid #1e3d63;border-radius:10px;padding:12px 14px;margin-bottom:10px} .mock-row:last-child{margin-bottom:0} .dev{flex:1;min-width:0} .dev b{display:block;font-size:13px;color:#e6eefa;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .dev small{font-size:11px;color:#7e94b3} .toners{display:flex;gap:5px;align-items:flex-end} .toner{width:14px;border-radius:3px 3px 2px 2px;position:relative;background:#1b3a60;height:34px;overflow:hidden} .toner i{position:absolute;bottom:0;left:0;right:0;display:block;border-radius:0 0 2px 2px} .tK i{background:#93a6bf}.tC i{background:#38bdf8}.tM i{background:#f472b6}.tY i{background:#facc15} .pill{font-size:10.5px;font-weight:700;padding:4px 9px;border-radius:100px;white-space:nowrap} .pill-ok{background:rgba(52,211,153,.15);color:#34d399} .pill-warn{background:rgba(250,204,21,.14);color:#facc15} .pill-urgent{background:rgba(248,113,113,.15);color:#f87171} .mock-foot{display:flex;justify-content:space-between;align-items:center;margin-top:14px;padding-top:14px;border-top:1px solid #1d3a5f;font-size:11.5px;color:#7e94b3} .mock-foot b{color:#22d3ee;font-weight:600} /* TRUST BAR */ .trust{background:#fff;border-bottom:1px solid var(--line);padding:26px 0} .trust-inner{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;text-align:center} .trust p svg{vertical-align:-3px;margin-right:6px;color:var(--blue)} .trust p{font-size:15px;color:var(--muted)} .trust b{color:var(--navy)} /* SECTIONS */ section.block{padding:84px 0} .sec-kicker{color:var(--blue);font-weight:700;font-size:13.5px;text-transform:uppercase;letter-spacing:.08em;margin-bottom:10px} h2{font-size:34px;font-weight:800;color:var(--navy);letter-spacing:-.02em;margin-bottom:14px} .sec-sub{font-size:17px;color:var(--muted);max-width:640px;margin-bottom:48px} /* FEATURES */ .grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px} .card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:28px;transition:all .15s} .card:hover{box-shadow:0 12px 32px rgba(11,29,51,.08);transform:translateY(-2px)} .card .ico{color:var(--blue);width:44px;height:44px;border-radius:10px;background:linear-gradient(135deg,rgba(45,127,249,.12),rgba(34,211,238,.12));display:flex;align-items:center;justify-content:center;margin-bottom:18px;font-size:20px} .card h3{font-size:17.5px;font-weight:700;color:var(--navy);margin-bottom:8px} .card p{font-size:14.5px;color:var(--muted)} /* HOW */ .how{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line)} .steps{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;counter-reset:step} .step{position:relative;padding:28px;border:1px solid var(--line);border-radius:14px;background:var(--bg)} .step .num{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,var(--blue),var(--cyan));color:#fff;font-weight:800;font-size:16px;display:flex;align-items:center;justify-content:center;margin-bottom:16px;font-family:'Sora',sans-serif} .step h3{font-size:17px;font-weight:700;color:var(--navy);margin-bottom:8px} .step p{font-size:14.5px;color:var(--muted)} /* CTA */ .cta{background:radial-gradient(900px 500px at 30% 120%,#16375e 0%,var(--navy) 60%);color:#fff;text-align:center;padding:90px 0} .cta h2{color:#fff;margin-bottom:14px} .cta p{color:#b9c8dc;font-size:17px;max-width:560px;margin:0 auto 34px} .cta .btn-primary{background:linear-gradient(90deg,var(--cyan),var(--blue));box-shadow:0 4px 20px rgba(34,211,238,.35)} .cta-note{margin-top:16px;font-size:13.5px;color:#8aa0bc} .cta .btn-lg+.cta-note{margin-top:30px} .cta p.cta-note{margin-bottom:8px} /* FOOTER */ footer{background:var(--navy);color:#8aa0bc;padding:34px 0;border-top:1px solid #16324f} .foot-inner{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:13.5px} .foot-inner .logo-word{font-size:17px;color:#dce8f7} footer a{color:#b9c8dc;text-decoration:none} @media(max-width:900px){ .hero-grid{grid-template-columns:1fr} .grid3,.steps{grid-template-columns:1fr} .hero h1{font-size:34px} h2{font-size:28px} } @media(max-width:640px){ .nav-inner .btn-primary{display:none} .logo-word{font-size:19px} .hero{padding:56px 0 64px} .hero p.sub{font-size:16.5px;max-width:100%} .hero-grid{gap:36px} .hero .btn-lg{width:100%;text-align:center} .mock{padding:14px} .mock-row{flex-wrap:wrap} } /* FAQ */ .faq-sec{padding:80px 0;background:#fff} .faq-sec h2{text-align:center;margin-bottom:34px} .faq-list{max-width:760px;margin:0 auto} .faq-list details{border:1px solid var(--line);border-radius:12px;margin-bottom:12px;background:var(--bg)} .faq-list summary{cursor:pointer;font-weight:600;padding:18px 22px;font-size:16.5px;color:var(--navy);list-style:none;display:flex;justify-content:space-between;align-items:center} .faq-list summary::after{content:'+';font-size:22px;color:var(--blue);font-weight:400} .faq-list details[open] summary::after{content:'\2212'} .faq-list details p{padding:0 22px 18px;color:var(--muted);font-size:15.5px;line-height:1.7} /* nav links + dropdown */ .nav-links{display:flex;align-items:center;gap:26px;margin-left:auto;margin-right:26px} .nav-links a{color:var(--ink);text-decoration:none;font-size:15px;font-weight:600;transition:color .15s} .nav-links a:hover{color:var(--blue)} .nav-drop{position:relative} .nav-drop>button{color:var(--ink);font-size:15px;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:5px} .nav-drop>button::after{content:'\25be';font-size:11px;opacity:.7} .nav-drop:hover>button{color:var(--blue)} .nav-menu{position:absolute;top:100%;left:50%;transform:translateX(-50%);margin-top:12px;background:#0e2440;border:1px solid #24436e;border-radius:12px;padding:8px;min-width:280px;box-shadow:0 20px 50px rgba(3,12,24,.5);opacity:0;visibility:hidden;transition:opacity .15s,margin-top .15s;z-index:50} .nav-menu a{display:block;padding:10px 14px;border-radius:8px;color:#cfe0f2;font-size:14.5px;font-weight:500;white-space:nowrap} .nav-menu a:hover{background:#16375e;color:#fff} .nav-menu .grp{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:#6f88ab;padding:10px 14px 4px;font-weight:600} /* homepage resources section */ .res-sec{padding:80px 0;background:var(--bg)} .res-sec h2{text-align:center;margin-bottom:8px} .res-sec .sec-sub{text-align:center;max-width:560px;margin:0 auto 40px} .res-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;max-width:1000px;margin:0 auto} .res-card{display:block;background:#fff;border:1px solid var(--line);border-radius:14px;padding:24px;text-decoration:none;transition:all .15s} .res-card:hover{box-shadow:0 12px 32px rgba(11,29,51,.08);transform:translateY(-2px);border-color:#c9d9ec} .res-card .tag{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--blue);font-weight:700;margin-bottom:10px} .res-card h3{font-size:17px;color:var(--navy);margin-bottom:6px;line-height:1.3} .res-card p{font-size:14px;color:var(--muted);margin:0} .nav-burger{display:none;background:none;border:0;cursor:pointer;padding:8px;margin-left:12px} .nav-burger span{display:block;width:22px;height:2px;background:var(--navy);margin:5px 0;border-radius:2px;transition:all .2s} .menu-open .nav-burger span:nth-child(1){transform:translateY(7px) rotate(45deg)} .menu-open .nav-burger span:nth-child(2){opacity:0} .menu-open .nav-burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)} @media(max-width:900px){ .nav-burger{display:block} .nav-cta{display:none} .nav-links{display:none;position:absolute;top:68px;left:0;right:0;background:#fff;border-bottom:1px solid var(--line);flex-direction:column;align-items:stretch;gap:0;margin:0;padding:8px 16px 16px;box-shadow:0 20px 40px rgba(11,29,51,.12)} .menu-open .nav-links{display:flex} .nav-links>a,.nav-drop>button{display:block;padding:12px 8px;border-bottom:1px solid var(--line)} .nav-drop>button{color:var(--muted);font-size:12px;letter-spacing:.08em;text-transform:uppercase;font-weight:700} .nav-menu{position:static;transform:none;opacity:1;visibility:visible;background:transparent;border:0;box-shadow:none;padding:0;margin:0;min-width:0} .nav-menu a{color:var(--ink);padding:10px 16px} .nav-menu .grp{color:var(--muted)} .res-grid{grid-template-columns:1fr} } /* AI section */ .ai-sec{background:radial-gradient(1000px 600px at 75% -20%,#16375e 0%,var(--navy) 55%);color:#fff;padding:90px 0} .ai-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center;max-width:1100px;margin:0 auto;padding:0 22px} .ai-sec h2{color:#fff;margin-bottom:14px} .ai-sec .sec-kicker{color:var(--cyan)} .ai-sub{color:#b9c8dc;font-size:17px;margin-bottom:26px} .ai-points{list-style:none;padding:0} .ai-points li{display:flex;gap:12px;margin-bottom:16px;font-size:15.5px;color:#dbe6f3;line-height:1.6} .ai-points .pt-ico{color:#7dd3fc;flex:0 0 auto;width:34px;height:34px;border-radius:9px;background:linear-gradient(135deg,rgba(45,127,249,.25),rgba(34,211,238,.25));display:flex;align-items:center;justify-content:center;font-size:16px} .ai-points b{color:#fff} .chat{background:#0e2440;border:1px solid #24436e;border-radius:16px;padding:22px;box-shadow:0 24px 60px rgba(3,12,24,.5)} .chat-head{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#7d93b5;margin-bottom:16px} .bubble{border-radius:12px;padding:13px 16px;font-size:14.5px;line-height:1.6;margin-bottom:12px;max-width:92%} .bubble.q{background:linear-gradient(90deg,var(--blue),#3b8bff);color:#fff;margin-left:auto} .bubble.a{background:#122a47;border:1px solid #24436e;color:#cfe0f2} .bubble.a b{color:#fff} .bubble.a .hl{color:var(--cyan)} @media(max-width:900px){.ai-grid{grid-template-columns:1fr;gap:36px}} .nav-drop>button{background:none;border:0;font:inherit;font-size:15px;font-weight:600;padding:0;cursor:pointer} .nav-drop.is-open .nav-menu{opacity:1;visibility:visible;margin-top:8px} .nav-drop>button:focus-visible,.nav-burger:focus-visible{outline:3px solid var(--blue);outline-offset:4px} @media(max-width:900px){.nav-drop>button{padding:12px 8px}.nav-drop .nav-menu{display:none}.nav-drop.is-open .nav-menu{display:block;opacity:1;visibility:visible}}