@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600&family=Manrope:wght@400;500;600&display=swap');
:root{--bg:#050f18;--panel:#081a27;--panel2:#0b2231;--text:#eaf4f7;--muted:#819ba7;--line:rgba(105,202,224,.17);--cyan:#54d8f4}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 75% 5%,rgba(34,133,160,.13),transparent 25%),var(--bg);color:var(--text);font-family:"DM Sans",sans-serif;line-height:1.5}
a{color:inherit;text-decoration:none}header{height:78px;padding:0 6vw;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:11px;font:500 21px Manrope}.drop{width:29px;height:36px;border:1px solid var(--cyan);border-radius:55% 55% 60% 60%;display:grid;place-items:center;color:var(--cyan);font-size:12px}.status{font-size:10px;letter-spacing:2px;color:#88a6b1}.status i{display:inline-block;width:6px;height:6px;border-radius:50%;background:#54d8f4;margin-right:7px}
main{max-width:1280px;margin:auto}.hero{padding:95px 6vw 70px}.eyebrow,.section-label{font-size:10px;letter-spacing:3px;color:#7faeba}.hero h1{font:500 clamp(48px,6vw,82px)/.98 Manrope;letter-spacing:-3px;margin:18px 0 24px}.hero em{color:var(--cyan);font-style:normal}.hero p{max-width:620px;color:#9eb3bc;font-size:18px}
.core{margin:0 6vw;padding:32px;border:1px solid var(--line);background:linear-gradient(145deg,rgba(12,37,51,.9),rgba(6,21,31,.9));box-shadow:0 30px 80px rgba(0,0,0,.22)}.core-head{display:flex;justify-content:space-between;align-items:flex-end;border-bottom:1px solid var(--line);padding-bottom:24px}.core h2{font:500 27px Manrope;margin:9px 0 0}.live{font-size:9px;letter-spacing:2px;color:var(--cyan)}
.folders{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;padding-top:18px}.folder{position:relative;min-height:145px;padding:22px;background:rgba(4,17,27,.68);border:1px solid rgba(100,198,219,.12);transition:.25s;display:flex;flex-direction:column}.folder:hover{border-color:rgba(84,216,244,.55);transform:translateY(-2px);background:rgba(8,30,43,.9)}.folder .icon{font-size:22px;color:#72b9c8;margin-bottom:18px}.folder strong{font:500 16px Manrope}.folder small{color:var(--muted);font-size:11px;margin-top:5px}.folder b{position:absolute;right:16px;top:14px;font-size:9px;color:#4c7886;font-weight:400}.folder.ai .icon,.folder.ai strong,.folder.chain .icon,.folder.chain strong{color:var(--cyan)}
.flow{padding:95px 6vw 65px}.flowline{margin-top:25px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:grid;grid-template-columns:1fr auto 1fr auto 1fr auto 1fr auto 1fr;align-items:center;padding:28px 0}.flowline div{display:flex;flex-direction:column;gap:3px}.flowline small{color:#4e7886;font-size:9px;letter-spacing:2px}.flowline strong{font:500 15px Manrope}.flowline span{font-size:10px;color:var(--muted)}.flowline i{font-style:normal;color:#397c8e;text-align:center}
.stats{margin:0 6vw 80px;display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.stats div{padding:25px 20px 25px 0;border-right:1px solid var(--line)}.stats div+div{padding-left:20px}.stats div:last-child{border-right:0}.stats span{display:block;font-size:9px;letter-spacing:2px;color:#658b97}.stats strong{font:500 13px Manrope;display:block;margin-top:7px;color:#c6e0e7}
footer{border-top:1px solid var(--line);padding:30px 6vw;display:grid;grid-template-columns:1fr 1fr auto;align-items:center;background:#030b12;color:#718892;font-size:11px}footer strong{font:500 16px Manrope;color:#dcecf0;display:block}footer span{font-size:9px;letter-spacing:1.5px}footer div:nth-child(2){display:flex;gap:22px}footer a:hover{color:var(--cyan)}
@media(max-width:900px){.folders{grid-template-columns:repeat(2,1fr)}.flowline{grid-template-columns:1fr;gap:14px}.flowline i{transform:rotate(90deg)}.stats{grid-template-columns:repeat(2,1fr)}.stats div:nth-child(2){border-right:0}.stats div:nth-child(3){padding-left:0}.stats div:nth-child(3),.stats div:nth-child(4){border-top:1px solid var(--line)}footer{grid-template-columns:1fr;gap:18px}}
@media(max-width:560px){header{padding:0 6vw}.hero{padding:70px 6vw 55px}.core{margin:0 5vw;padding:20px}.folders{grid-template-columns:1fr}.stats{margin:0 5vw 60px;grid-template-columns:1fr}.stats div,.stats div+div{padding:20px 0;border-right:0;border-bottom:1px solid var(--line)}.stats div:last-child{border-bottom:0}.flow{padding-left:5vw;padding-right:5vw}footer{padding:27px 6vw}}
