style.css

*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#050b17;color:#eaf3ff;font-family:Inter,Segoe UI,Roboto,Arial,sans-serif;line-height:1.6}.nav{position:sticky;top:0;z-index:10;display:flex;justify-content:space-between;align-items:center;padding:18px 6%;background:rgba(5,11,23,.86);backdrop-filter:blur(16px);border-bottom:1px solid rgba(105,180,255,.14)}.brand{font-weight:800;letter-spacing:.18em;color:#8bdcff;text-decoration:none}.nav nav{display:flex;gap:24px;align-items:center}.nav a{color:#b9cce0;text-decoration:none;font-size:.92rem}.nav a:hover{color:#56d7ff}.nav .github{padding:8px 15px;border:1px solid #2376a8;border-radius:999px;color:#8ee5ff}.hero{min-height:calc(100vh - 70px);display:grid;grid-template-columns:1fr 1.15fr;gap:30px;align-items:center;padding:7vh 6%;background:radial-gradient(circle at 80% 35%,rgba(23,105,210,.22),transparent 34%),radial-gradient(circle at 15% 80%,rgba(90,40,180,.16),transparent 30%)}.hero-copy{max-width:700px}.eyebrow{color:#58d9ff;letter-spacing:.28em;font-size:.76rem;font-weight:700;margin:0 0 15px}.hero h1{font-size:clamp(3.3rem,6vw,6.8rem);line-height:.94;margin:0;letter-spacing:-.055em}.hero h1 span{color:#39cfff}.lead{font-size:1.18rem;color:#a9bdd3;max-width:650px;margin:28px 0}.actions{display:flex;gap:14px;flex-wrap:wrap}.btn{display:inline-block;padding:13px 21px;border-radius:10px;text-decoration:none;font-weight:700}.primary{background:linear-gradient(90deg,#17b8f0,#735cff);color:white}.secondary{border:1px solid #315574;color:#c9e7ff}.principles{display:flex;gap:14px;flex-wrap:wrap;margin-top:28px;color:#668ba8;font-size:.7rem;letter-spacing:.14em}.hero-art img{width:100%;display:block;border-radius:18px;box-shadow:0 25px 80px rgba(0,0,0,.55);border:1px solid rgba(104,204,255,.2)}.statement{text-align:center;padding:110px 8%;background:linear-gradient(180deg,#071225,#09162a)}.statement h2,.section h2,.vision h2{font-size:clamp(2.2rem,4vw,4.2rem);line-height:1.05;margin:0 0 22px}.statement h2 span{color:#42d4ff}.statement p:last-child{max-width:760px;margin:auto;color:#98aec5;font-size:1.1rem}.section{padding:100px 6%}.section-head{margin-bottom:42px}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.grid article{padding:28px;background:linear-gradient(145deg,#0c1a2d,#071120);border:1px solid #17324c;border-radius:16px;transition:.25s}.grid article:hover{transform:translateY(-4px);border-color:#2d9bd0}.icon{font-size:2rem;margin-bottom:10px}.grid h3{margin:0 0 8px;font-size:1.15rem}.grid p{color:#8fa6bc;margin:0}.dark{background:#07101f;border-top:1px solid #10273d;border-bottom:1px solid #10273d}.flow{display:flex;align-items:center;justify-content:center;gap:15px;flex-wrap:wrap}.flow div{padding:18px 24px;border-radius:12px;background:#0d2035;border:1px solid #20577c;color:#aee8ff;font-weight:700}.flow span{color:#37d3ff;font-size:1.5rem}.section-note{max-width:800px;margin:35px auto 0;text-align:center;color:#879eb5}.stack{display:flex;gap:12px;flex-wrap:wrap}.stack span{padding:11px 17px;border-radius:999px;background:#0c1a2d;border:1px solid #1a3b59;color:#9de5ff}.vision{padding:110px 8%;display:grid;grid-template-columns:1.1fr .9fr;gap:70px;background:radial-gradient(circle at 85% 50%,rgba(42,116,255,.2),transparent 35%)}.vision p:not(.eyebrow){color:#9db2c8;font-size:1.1rem;max-width:700px}.quote{align-self:center;padding:30px;border-left:3px solid #36d3ff;color:#b9d3e8;font-size:1.1rem}.quote strong{color:#6de0ff}footer{padding:28px 6%;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;border-top:1px solid #14283b;color:#6f879e;font-size:.9rem}footer a{color:#64d9ff;text-decoration:none}@media(max-width:900px){.nav nav a:not(.github){display:none}.hero,.vision{grid-template-columns:1fr}.hero{padding-top:50px}.grid{grid-template-columns:1fr 1fr}}@media(max-width:600px){.grid{grid-template-columns:1fr}.flow span{display:none}.nav{padding:15px 5%}.hero,.section{padding-left:5%;padding-right:5%}}