@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{--bg:#04101f;--panel:#081a2c;--cyan:#22e8f3;--muted:#8fa5b9;--white:#f1f8ff}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--white);font-family:'DM Sans',Arial,sans-serif}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}::selection{background:var(--cyan);color:var(--bg)}
.topbar{position:absolute;top:0;left:0;right:0;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:26px 6.5%;gap:24px}.brand{font:700 26px 'Space Grotesk',sans-serif;letter-spacing:-2px}.brand-dot,.period{color:var(--cyan)}nav{display:flex;gap:clamp(15px,3vw,50px)}nav a,.actions button{font-size:10px;letter-spacing:1.7px;color:#c0d4e6;transition:color .2s}nav a:hover,.actions button:hover{color:var(--cyan)}.actions{display:flex;gap:15px}.actions button{border:0;background:none}#menu{display:none}
.hero{min-height:100svh;position:relative;overflow:hidden;background:radial-gradient(ellipse at 76% 49%,#07518b 0%,#063258 22%,#051d38 45%,#030e1c 77%);display:flex;align-items:center}
.glow{position:absolute;width:65vw;height:60vh;right:-12%;top:10%;background:radial-gradient(ellipse,#068de345,transparent 67%);filter:blur(35px);pointer-events:none}
.grid-plane{position:absolute;inset:30% -25% -40% 24%;opacity:.4;background-image:linear-gradient(#0cc5f65c 1px,transparent 1px),linear-gradient(90deg,#0cc5f65c 1px,transparent 1px);background-size:58px 58px;transform:perspective(440px) rotateX(64deg) rotateZ(-12deg);transform-origin:bottom center;mask-image:linear-gradient(transparent 5%,black 80%)}
.blueprint{position:absolute;right:9%;top:27%;width:28vw;height:28vw;max-width:400px;max-height:400px;border:1px solid #1ecdf51c;transform:skewY(-14deg) rotate(-4deg);box-shadow:35px 35px 0 -1px #0de1ff09,35px 35px 0 0 #0de1ff24,75px 75px 0 -1px #0de1ff07,75px 75px 0 0 #0de1ff15;opacity:.6;pointer-events:none}
.hero-copy{position:relative;z-index:2;margin:7vh 0 0 18%;max-width:650px}.eyebrow{font-size:11px;letter-spacing:3px;color:#67c8e3;margin-bottom:25px}h1,h2,h3{font-family:'Space Grotesk',sans-serif}h1{font-size:clamp(52px,6.6vw,105px);line-height:1.02;letter-spacing:-4px;margin:0;color:var(--cyan);font-weight:600}h1 .period{color:#f5ffff}.hero-copy p{max-width:360px;color:#a6c2d8;font-size:14px;line-height:1.8;margin:28px 0 38px}.pill{display:inline-flex;align-items:center;justify-content:center;gap:20px;background:var(--cyan);color:#021321;padding:16px 34px;border-radius:100px;font-size:11px;letter-spacing:1.1px;font-weight:700;transition:transform .25s,box-shadow .25s}.pill:hover{transform:translateY(-3px);box-shadow:0 8px 32px #00eaff35}.pill.outline{border:1px solid var(--cyan);background:transparent;color:var(--cyan)}.index{position:absolute;z-index:2;left:6.5%;top:48%;display:flex;flex-direction:column;gap:8px;font-size:10px;color:#6085a3}.index span:first-child{color:#fff;font-weight:700}.hero-bottom{position:absolute;z-index:2;bottom:30px;left:6.5%;right:6.5%;display:flex;justify-content:space-between;align-items:center;font-size:9px;letter-spacing:1.4px;color:#6d9db7}.dots{display:flex;gap:8px}.dots>*{width:6px;height:6px;background:#33617b;border-radius:50%}.dots b{background:var(--cyan)}
.section{padding:130px 10%;border-top:1px solid #18334a}.section-no{color:var(--cyan);font-size:11px;letter-spacing:2.5px;margin-bottom:36px}.section h2{font-size:clamp(40px,5.2vw,80px);letter-spacing:-3px;line-height:1.12;margin:0 0 35px;font-weight:500}.section h2 em{font-style:normal;color:var(--cyan)}.section p{font-size:16px;line-height:1.9;color:#bfd0df;max-width:580px}.section p.muted{color:#7995ac}.split{display:grid;grid-template-columns:1.2fr 1fr;gap:8vw;align-items:center}.service-list{margin-top:70px}.service-list article{display:grid;grid-template-columns:60px 1.1fr 1fr 20px;gap:25px;align-items:center;border-top:1px solid #254158;padding:35px 0}.service-list article:last-child{border-bottom:1px solid #254158}.service-list article>span:first-child{color:var(--cyan);font-size:12px}.service-list h3{font-size:clamp(21px,2.5vw,34px);font-weight:500;margin:0}.service-list p{font-size:13px;margin:0}.arrow{color:var(--cyan)}.showcase{background:radial-gradient(ellipse at 90% 80%,#073e65,#04101f 60%)}.showcase .pill{margin-top:24px}.contact{min-height:65vh;background:linear-gradient(130deg,#06172b,#082c49)}.contact .small-note{font-size:11px;color:#7996ad;margin-top:25px}footer{display:flex;justify-content:space-between;gap:20px;padding:30px 6.5%;font-size:10px;letter-spacing:1px;color:#7b99b0}
@media(max-width:760px){.topbar{padding:22px 6%}#menu{display:block;font-size:22px}nav{display:none;position:absolute;top:75px;left:5%;right:5%;background:#071c31;border:1px solid #23506b;padding:25px;flex-direction:column;gap:23px}nav.open{display:flex}.hero-copy{margin:6vh 7% 0 15%}h1{font-size:clamp(44px,11vw,72px);letter-spacing:-2px}.hero-copy p{font-size:13px}.blueprint{right:-25%;top:35%;width:60vw;height:60vw}.index{left:5%;font-size:9px}.hero-bottom{left:6%;right:6%}.hero-bottom>span:first-child{display:none}.section{padding:90px 7%}.split{grid-template-columns:1fr;gap:20px}.service-list article{grid-template-columns:30px 1fr 20px;gap:12px}.service-list p{grid-column:2;grid-row:2}.service-list .arrow{grid-column:3;grid-row:1}footer{flex-direction:column}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}
