
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');
:root{--bg:#0A0E1A;--s1:#111827;--s2:#161F33;--s3:#1C2740;--bd:rgba(148,163,184,.14);--bd2:rgba(148,163,184,.26);
--tx:#E7EAF3;--mu:#97A2BA;--fa:#5E6A82;--ac:#7C83FF;--ac2:#38D6F5;--acs:rgba(124,131,255,.14);--good:#34D399;
--grad:linear-gradient(135deg,#7C83FF 0%,#38D6F5 100%)}
html,body,.stApp,[class*="css"]{font-family:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif!important}
.stApp{background:radial-gradient(1100px 600px at 85% -5%,rgba(56,214,245,.08),transparent 60%),
 radial-gradient(1000px 600px at 5% -10%,rgba(124,131,255,.13),transparent 60%),var(--bg)}
[data-testid="stHeader"],[data-testid="stToolbar"],[data-testid="stDecoration"],[data-testid="stSidebar"],
[data-testid="stSidebarCollapsedControl"],[data-testid="collapsedControl"],footer,[class*="viewerBadge"],
[data-testid="stAppDeployButton"],[data-testid="stStatusWidget"],[data-testid="stHeaderActionElements"],.cs h3 a{display:none!important}
.block-container{max-width:1200px!important;padding:0 28px 0!important}
[data-testid="stMarkdownContainer"] a{text-decoration:none}
.cs a{color:inherit;text-decoration:none!important}
.cs{color:var(--tx)}
.cs *{box-sizing:border-box}
.cs h1,.cs h2,.cs h3,.cs p,.cs span,.cs a,.cs div,.cs li{font-family:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif!important}
.cs h1,.cs h2,.cs h3{color:var(--tx)!important;padding:0!important;scroll-margin-top:90px}
.cs h1 span,.cs h2 span{color:transparent!important}
.cs-cta h2{color:#fff!important}
/* nav */
.cs-nav{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:16px 0;
 background:linear-gradient(180deg,rgba(10,14,26,.96),rgba(10,14,26,.82));backdrop-filter:blur(10px);border-bottom:1px solid var(--bd);margin-bottom:8px}
.cs-logo{display:flex;align-items:center;gap:12px}
.cs-logo img{height:40px;background:#fff;border-radius:10px;padding:4px 8px}
.cs-logo b{font-size:1.05rem;font-weight:800;letter-spacing:-.02em}
.cs-logo span{display:block;font-size:.72rem;color:var(--mu);font-weight:500}
.cs-links{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.cs-links a{padding:8px 13px;border-radius:9px;font-size:.88rem;font-weight:600;color:var(--mu)!important;transition:all .15s}
.cs-links a:hover{color:var(--tx)!important;background:var(--s2)}
.cs-lk svg{width:14px;height:14px;vertical-align:-2px;margin-right:6px}
.cs-btn{display:inline-flex;align-items:center;gap:8px;padding:12px 20px;border-radius:11px;font-weight:700;font-size:.94rem;
 transition:transform .15s,box-shadow .15s,border-color .15s;border:1px solid var(--bd2);background:var(--s2);color:var(--tx)!important;cursor:pointer}
.cs-btn svg{width:18px;height:18px}
.cs-btn:hover{transform:translateY(-2px);border-color:var(--ac)}
.cs-btn.pri{background:var(--grad);border:none;color:#0A0E1A!important;box-shadow:0 10px 30px -12px rgba(124,131,255,.9)}
.cs-btn.pri:hover{box-shadow:0 14px 34px -10px rgba(56,214,245,.8)}
.cs-btn.sm{padding:9px 15px;font-size:.86rem}
/* hero */
.cs-hero{display:grid;grid-template-columns:1.05fr 1fr;gap:48px;align-items:center;padding:56px 0 48px}
.cs-eye{display:inline-flex;align-items:center;gap:9px;font-size:.74rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--ac2);margin-bottom:16px}
.cs-eye:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--good);box-shadow:0 0 0 4px rgba(52,211,153,.16)}
.cs-h1{font-size:3.3rem;line-height:1.04;font-weight:800;letter-spacing:-.045em;margin:0}
.cs-h1 span,.cs-h2 span{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.cs-lead{font-size:1.12rem;line-height:1.6;color:var(--mu)!important;margin:20px 0 28px!important;max-width:560px}
.cs-ctas{display:flex;gap:12px;flex-wrap:wrap}
.cs-shot{position:relative;border-radius:18px;overflow:hidden;border:1px solid var(--bd2);
 box-shadow:0 40px 80px -30px rgba(0,0,0,.8),0 0 0 1px rgba(124,131,255,.12),0 30px 120px -40px rgba(124,131,255,.55)}
.cs-shot img{display:block;width:100%}
.cs-trust{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:30px;font-size:.8rem;color:var(--fa)}
.cs-trust span{padding:5px 11px;border:1px solid var(--bd);border-radius:999px;color:var(--mu);font-weight:600}
/* sections */
.cs-sec{padding:64px 0 8px}
.cs-sh{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:26px;flex-wrap:wrap}
.cs-kick{font-size:.74rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--ac2);margin-bottom:10px}
.cs-h2{font-size:2.2rem;font-weight:800;letter-spacing:-.035em;line-height:1.1;margin:0}
.cs-sub{color:var(--mu);font-size:1rem;line-height:1.6;max-width:620px;margin-top:12px!important}
.cs-grid{display:grid;gap:18px}
.g3{grid-template-columns:repeat(3,1fr)}.g2{grid-template-columns:repeat(2,1fr)}.g4{grid-template-columns:repeat(4,1fr)}
/* cards */
.cs-card{position:relative;display:flex;flex-direction:column;background:linear-gradient(180deg,rgba(28,39,64,.75),rgba(17,24,39,.85));
 border:1px solid var(--bd);border-radius:18px;padding:26px;transition:transform .2s ease,border-color .2s,box-shadow .2s;overflow:hidden;min-height:100%}
.cs-card:before{content:"";position:absolute;inset:0;background:radial-gradient(400px 200px at 0% 0%,rgba(124,131,255,.18),transparent 70%);
 opacity:0;transition:opacity .25s}
a.cs-card:hover{transform:translateY(-5px);border-color:rgba(56,214,245,.55);box-shadow:0 24px 50px -24px rgba(56,214,245,.45)}
a.cs-card:hover:before{opacity:1}
a.cs-card:active{transform:translateY(-1px) scale(.99)}
a.cs-card:focus-visible{outline:2px solid var(--ac2);outline-offset:3px}
.cs-ic{width:46px;height:46px;border-radius:13px;display:grid;place-items:center;background:var(--acs);color:var(--ac);
 border:1px solid rgba(124,131,255,.32);margin-bottom:18px;position:relative;transition:all .2s}
.cs-ic svg{width:23px;height:23px}
a.cs-card:hover .cs-ic{background:var(--grad);color:#0A0E1A;border-color:transparent}
.cs-card h3{font-size:1.14rem;font-weight:800;letter-spacing:-.02em;margin:0 0 8px;position:relative;color:var(--tx)}
.cs-card p{color:var(--mu);font-size:.92rem;line-height:1.55;margin:0;position:relative}
.cs-more{margin-top:auto;padding-top:18px;display:inline-flex;align-items:center;gap:7px;font-size:.86rem;font-weight:700;color:var(--ac2);position:relative}
.cs-more svg{width:16px;height:16px;transition:transform .2s}
a.cs-card:hover .cs-more svg{transform:translateX(5px)}
/* how it works */
.cs-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;counter-reset:st}
.cs-step{counter-increment:st;background:var(--s1);border:1px solid var(--bd);border-radius:18px;padding:26px;position:relative}
.cs-step:before{content:counter(st,decimal-leading-zero);font-size:.8rem;font-weight:800;color:var(--ac2);letter-spacing:.1em}
.cs-step h3{font-size:1.15rem;font-weight:800;margin:10px 0 8px}
.cs-step p{color:var(--mu);font-size:.92rem;line-height:1.55;margin:0}
.cs-flow{display:grid;grid-template-columns:1fr 50px 1.2fr 50px 1fr;align-items:center;margin-top:22px}
.cs-node{border:1px solid var(--bd2);border-radius:16px;padding:20px;text-align:center;background:var(--s1)}
.cs-node b{display:block;font-size:1rem}.cs-node span{display:block;color:var(--mu);font-size:.82rem;margin-top:4px}
.cs-node.core{background:var(--grad);border:none}.cs-node.core b,.cs-node.core span{color:#0A0E1A}
.cs-arr{text-align:center;color:var(--ac2);font-size:1.6rem;font-weight:800}
/* capabilities */
.cs-cap{background:var(--s1);border:1px solid var(--bd);border-radius:18px;padding:24px}
.cs-cap h3{font-size:1.05rem;font-weight:800;margin:0 0 14px}
.cs-tags{display:flex;flex-wrap:wrap;gap:8px}
.cs-tags span{font-size:.8rem;font-weight:600;padding:6px 11px;border-radius:999px;background:var(--s3);border:1px solid var(--bd);color:var(--tx)}
/* split feature */
.cs-split{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:center}
.cs-list{list-style:none;padding:0;margin:18px 0 0}
.cs-list li{display:flex;gap:12px;align-items:flex-start;padding:9px 0;color:var(--tx);font-size:.98rem;line-height:1.5}
.cs-list li i{flex:none;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:rgba(52,211,153,.14);color:var(--good)}
.cs-list li i svg{width:14px;height:14px}
/* why */
.cs-why{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.cs-why div{display:flex;gap:12px;align-items:center;padding:16px 18px;border:1px solid var(--bd);border-radius:14px;background:rgba(17,24,39,.6);font-weight:600;font-size:.93rem}
.cs-why i{flex:none;width:28px;height:28px;border-radius:9px;display:grid;place-items:center;background:var(--acs);color:var(--ac)}
.cs-why i svg{width:15px;height:15px}
/* cta band */
.cs-cta{margin:72px 0 0;border-radius:24px;padding:46px 48px;display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap;
 background:radial-gradient(600px 300px at 90% 0%,rgba(56,214,245,.25),transparent 70%),linear-gradient(135deg,#1B2350,#121A38);border:1px solid rgba(124,131,255,.35)}
.cs-cta h2{font-size:2rem;font-weight:800;letter-spacing:-.03em;margin:0}
.cs-cta p{color:#B7BEDA;margin:8px 0 0;font-size:1rem}
/* footer */
.cs-foot{margin-top:56px;padding:30px 0 36px;border-top:1px solid var(--bd);display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;color:var(--mu);font-size:.86rem}
.cs-foot b{color:var(--tx)}
.cs-foot a{color:var(--mu)!important}.cs-foot a:hover{color:var(--tx)!important}
.cs-foot .cols{display:flex;gap:40px;flex-wrap:wrap}
.cs-foot .cols div{display:flex;flex-direction:column;gap:7px}
/* detail pages */
.cs-crumb{display:inline-flex;align-items:center;gap:8px;font-size:.86rem;font-weight:600;color:var(--mu)!important;margin:26px 0 0;padding:7px 12px;border-radius:9px;border:1px solid var(--bd)}
.cs-crumb svg{width:15px;height:15px}.cs-crumb:hover{color:var(--tx)!important;border-color:var(--ac)}
.cs-dhero{display:grid;grid-template-columns:1.05fr 1fr;gap:44px;align-items:center;padding:28px 0 20px}
.cs-dhero .cs-ic{width:56px;height:56px;border-radius:16px;background:var(--grad);color:#0A0E1A;border:none}
.cs-dhero .cs-ic svg{width:28px;height:28px}
.cs-h1.d{font-size:2.8rem}
.cs-feat{background:var(--s1);border:1px solid var(--bd);border-radius:16px;padding:22px;transition:border-color .2s,transform .2s}
.cs-feat:hover{border-color:rgba(124,131,255,.45);transform:translateY(-2px)}
.cs-feat h3{font-size:1rem;font-weight:800;margin:0 0 6px;display:flex;align-items:center;gap:10px}
.cs-feat h3 i{width:8px;height:8px;border-radius:50%;background:var(--grad);flex:none}
.cs-feat p{color:var(--mu);font-size:.9rem;line-height:1.55;margin:0}
.cs-panel{background:linear-gradient(180deg,rgba(28,39,64,.6),rgba(17,24,39,.7));border:1px solid var(--bd);border-radius:20px;padding:30px}
@media (max-width:980px){
 .cs-hero,.cs-dhero,.cs-split{grid-template-columns:1fr;gap:30px}.g3,.g4,.cs-why{grid-template-columns:1fr 1fr}.cs-steps{grid-template-columns:1fr}
 .cs-h1{font-size:2.5rem}.cs-links a.hide-m{display:none}}
@media (max-width:640px){
 .block-container{padding:0 16px!important}.g3,.g4,.g2,.cs-why{grid-template-columns:1fr}.cs-h1,.cs-h1.d{font-size:2.05rem}.cs-h2{font-size:1.7rem}
 .cs-flow{grid-template-columns:1fr}.cs-arr{transform:rotate(90deg)}.cs-cta{padding:30px 24px}.cs-links a:not(.cs-btn){display:none}}

/* Standalone layout overrides; preserve original marketing classes */
html{background:#0A0E1A}body{margin:0;min-height:100vh;background:radial-gradient(1100px 600px at 85% -5%,rgba(56,214,245,.08),transparent 60%),radial-gradient(1000px 600px at 5% -10%,rgba(124,131,255,.13),transparent 60%),#0A0E1A;color:var(--tx)}
.block-container{margin:auto;max-width:1200px!important;padding:0 28px!important}.cs-nav{top:0}.cs h1,.cs h2,.cs h3{line-height:1.2} .cs-h1{line-height:1.04!important}.cs-h2{line-height:1.1!important}
@media(max-width:640px){.block-container{padding:0 16px!important}}
