:root{color-scheme:dark;--bg:#07111f;--bg2:#0a1728;--panel:#111f32;--panel2:#16263b;--line:#304761;--text:#f5f8ff;--muted:#aab9cd;--blue:#438cf8;--blue2:#77adff;--green:#25cf85;--orange:#ffad22;--red:#e44c57;--radius:18px;--shadow:0 28px 80px #0008}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;background:var(--bg);color:var(--text);font:16px/1.6 "Segoe UI Variable","Segoe UI",Arial,sans-serif;overflow-x:hidden}a{color:inherit}button,input{font:inherit}.ambient{position:fixed;inset:0;z-index:-2;background:radial-gradient(circle at 12% 8%,#163c6a 0,transparent 34%),radial-gradient(circle at 90% 72%,#0b4660 0,transparent 30%),linear-gradient(145deg,#06101d,#091728 58%,#06111e)}.ambient:after{content:"";position:absolute;inset:0;opacity:.17;background-image:linear-gradient(#2b5788 1px,transparent 1px),linear-gradient(90deg,#2b5788 1px,transparent 1px);background-size:54px 54px;mask-image:linear-gradient(to bottom,black,transparent 92%)}#network{position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.55}.container{width:min(1220px,calc(100% - 48px));margin:auto}.site-header{position:sticky;top:0;z-index:50;background:#07111fd9;border-bottom:1px solid #29415b;backdrop-filter:blur(18px);transition:.2s}.site-header.scrolled{box-shadow:0 10px 35px #0007}.nav{height:78px;display:flex;align-items:center;gap:26px}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;font-size:22px;font-weight:750;white-space:nowrap}.brand img{width:48px;height:48px;object-fit:contain;filter:drop-shadow(0 0 16px #3e8fff55)}.nav-links{display:flex;align-items:center;gap:6px;margin-left:auto}.nav-links a{padding:10px 12px;border-radius:9px;color:#bdc9d9;text-decoration:none;font-weight:600;font-size:14px;transition:.18s}.nav-links a:hover,.nav-links a.active{background:#172a42;color:#fff}.nav-actions{display:flex;align-items:center;gap:10px}.menu-button{display:none;border:1px solid var(--line);background:var(--panel);color:#fff;border-radius:10px;width:44px;height:44px}.button{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 22px;border:1px solid #536d8c;border-radius:11px;color:#fff;text-decoration:none;font-weight:750;cursor:pointer;transition:transform .18s,border-color .18s,box-shadow .18s,background .18s}.button:hover{transform:translateY(-2px);border-color:#7caeff}.button.primary{background:linear-gradient(135deg,#4b96ff,#246ce5);border-color:#62a6ff;box-shadow:0 12px 36px #2078ef45}.button.primary:hover{box-shadow:0 16px 48px #2078ef75}.button.small{min-height:42px;padding:0 16px;font-size:14px}.button.ghost{background:#122136cc}.eyebrow{color:var(--blue2);font-weight:800;letter-spacing:.14em;text-transform:uppercase;font-size:12px}.hero{min-height:690px;display:grid;grid-template-columns:1.08fr .92fr;align-items:center;gap:62px;padding:78px 0 70px}.hero.compact{min-height:460px;grid-template-columns:1fr;padding:70px 0 50px;max-width:900px}.hero h1{font-size:clamp(44px,5.5vw,76px);line-height:1.04;letter-spacing:-.04em;margin:20px 0 24px}.hero.compact h1{font-size:clamp(42px,5vw,66px)}.lead{color:var(--muted);font-size:clamp(18px,2vw,22px);max-width:760px}.hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px}.trust{display:flex;flex-wrap:wrap;gap:18px;margin-top:28px;color:#aebed1;font-size:14px}.trust span:before{content:"✓";color:var(--green);font-weight:900;margin-right:8px}.product-window{background:linear-gradient(145deg,#17283d,#0d192a);border:1px solid #3a5470;border-radius:24px;padding:22px;box-shadow:var(--shadow);transform:perspective(1100px) rotateY(-5deg) rotateX(2deg);transition:.3s}.product-window:hover{transform:perspective(1100px) rotateY(-2deg) rotateX(0) translateY(-6px)}.window-bar{display:flex;gap:7px;margin-bottom:18px}.window-bar i{width:9px;height:9px;border-radius:50%;background:#4e6580}.screen{display:grid;grid-template-columns:82px 1fr;min-height:370px;background:#081524;border:1px solid #28415c;border-radius:14px;overflow:hidden}.mock-side{padding:18px 11px;background:#07111e;border-right:1px solid #28415c}.mock-side b,.mock-side i{display:block;border-radius:5px}.mock-side b{height:8px;background:#438cf8;margin:12px 0}.mock-side i{height:7px;background:#344a64;margin:21px 0}.mock-main{padding:22px}.mock-main h3{margin:0 0 18px}.mock-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.mock-card{height:68px;border:1px solid #2e4763;border-radius:10px;background:#15263a}.mock-map{height:215px;margin-top:14px;border:1px solid #2e4763;border-radius:12px;position:relative;overflow:hidden;background:radial-gradient(circle at 64% 44%,#327cf5 0 4px,transparent 5px),radial-gradient(circle at 38% 62%,#28c97d 0 4px,transparent 5px),linear-gradient(135deg,#142840,#0b192a)}.mock-map:after{content:"";position:absolute;inset:0;background-image:linear-gradient(#32608a33 1px,transparent 1px),linear-gradient(90deg,#32608a33 1px,transparent 1px);background-size:28px 28px}.section{padding:88px 0}.section.alt{border-block:1px solid #263d58;background:#0a1728b8}.section-head{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:36px}.section h2{font-size:clamp(32px,4vw,52px);line-height:1.12;letter-spacing:-.03em;margin:10px 0}.section-head p{color:var(--muted);max-width:590px}.grid{display:grid;gap:18px}.grid.three{grid-template-columns:repeat(3,1fr)}.grid.four{grid-template-columns:repeat(4,1fr)}.card{position:relative;background:linear-gradient(145deg,#122238e8,#0d1a2be8);border:1px solid #2d4661;border-radius:var(--radius);padding:26px;overflow:hidden;transition:.22s}.card:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at var(--x,80%) var(--y,0%),#438cf824,transparent 38%);opacity:0;transition:.2s}.card:hover{transform:translateY(-7px);border-color:#5680aa;box-shadow:0 18px 55px #0005}.card:hover:before{opacity:1}.card>*{position:relative}.icon{width:48px;height:48px;border-radius:13px;background:#1d3c63;border:1px solid #3d6898;display:grid;place-items:center;color:#81b4ff;font-size:22px;font-weight:800;margin-bottom:20px}.card h3{font-size:21px;margin:0 0 10px}.card p{color:var(--muted);margin:0}.card ul{padding-left:20px;color:var(--muted)}.card li+li{margin-top:7px}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.stat{border:1px solid #2d4661;background:#0e1d30;border-radius:15px;padding:24px}.stat strong{display:block;font-size:38px;line-height:1;color:#fff;margin-bottom:10px}.stat span{color:var(--muted)}.steps{counter-reset:steps;display:grid;gap:14px}.step{counter-increment:steps;display:grid;grid-template-columns:64px 1fr;gap:20px;align-items:start;background:#0e1d30;border:1px solid #2d4661;border-radius:16px;padding:23px}.step:before{content:counter(steps,decimal-leading-zero);display:grid;place-items:center;width:54px;height:54px;border-radius:14px;color:#83b6ff;background:#183b65;border:1px solid #3d6ea5;font-size:17px;font-weight:800}.step h3{margin:2px 0 5px}.step p{margin:0;color:var(--muted)}.timeline{position:relative;display:grid;gap:20px}.timeline:before{content:"";position:absolute;left:23px;top:20px;bottom:20px;width:2px;background:linear-gradient(var(--green),var(--blue),#586c83)}.milestone{position:relative;padding:23px 24px 23px 72px;border:1px solid #2d4661;background:#0e1d30;border-radius:16px}.milestone:before{content:"";position:absolute;left:16px;top:28px;width:16px;height:16px;border:5px solid #0e1d30;border-radius:50%;background:var(--blue);box-shadow:0 0 0 2px #438cf8}.milestone.done:before{background:var(--green);box-shadow:0 0 0 2px #25cf85}.milestone h3{margin:0 0 6px}.milestone p{color:var(--muted);margin:0}.badge{display:inline-flex;border:1px solid #365779;background:#152a43;color:#8dbeff;border-radius:999px;padding:5px 10px;font-size:12px;font-weight:800;margin-bottom:10px}.callout{display:grid;grid-template-columns:1fr auto;align-items:center;gap:30px;padding:42px;border:1px solid #426289;border-radius:22px;background:radial-gradient(circle at 85% 15%,#438cf833,transparent 34%),linear-gradient(135deg,#132844,#101e31);box-shadow:var(--shadow)}.callout h2{margin:0 0 10px}.callout p{color:var(--muted);margin:0}.page-nav{border-top:1px solid #283f59;padding:18px 0}.page-nav .container{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}.page-nav a{color:#aebdd0;text-decoration:none;padding:8px 12px;border-radius:8px}.page-nav a:hover{color:#fff;background:#14263b}.site-footer{border-top:1px solid #283f59;background:#06101b;padding:44px 0 28px}.footer-grid{display:grid;grid-template-columns:1.3fr repeat(3,1fr);gap:34px}.site-footer h4{margin:0 0 14px}.site-footer a{display:block;color:#92a5bc;text-decoration:none;margin:7px 0}.site-footer a:hover{color:#fff}.footer-brand p{color:#8498b1;max-width:340px}.copyright{display:flex;justify-content:space-between;gap:20px;color:#71869f;border-top:1px solid #1e334a;margin-top:32px;padding-top:22px}.reveal{opacity:0;transform:translateY(24px);transition:opacity .65s,transform .65s}.reveal.visible{opacity:1;transform:none}.status-dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--green);box-shadow:0 0 14px var(--green);margin-right:8px}
.logo-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}.logo-card{border:1px solid #2d4661;background:#0e1d30;border-radius:18px;overflow:hidden;transition:.22s}.logo-card:hover{transform:translateY(-6px);border-color:#5a80aa;box-shadow:0 20px 55px #0006}.logo-card.proposed{grid-column:1/-1;border-color:#3d75b5;background:linear-gradient(145deg,#112b4b,#0e1d30)}.logo-visual{min-height:260px;display:flex;align-items:center;justify-content:center;padding:28px;background:#f5f6f8}.logo-card.proposed .logo-visual{min-height:420px;background:linear-gradient(135deg,#eff3f7,#fff)}.logo-visual img{display:block;max-width:100%;max-height:360px;object-fit:contain}.logo-copy{padding:24px}.logo-copy h3{font-size:23px;margin:4px 0 9px}.logo-copy p{margin:0;color:var(--muted)}.badge.archive{color:#b8c4d4;background:#253448;border-color:#3f536b}.badge.proposal{color:#b9dcff;background:#173a61;border-color:#438cf8}.comparison-table{width:100%;border-collapse:separate;border-spacing:0;overflow:hidden;border:1px solid #304761;border-radius:16px;background:#0e1d30}.comparison-table th,.comparison-table td{padding:16px 18px;text-align:left;border-bottom:1px solid #293f58}.comparison-table th{background:#14263c}.comparison-table tr:last-child td{border-bottom:0}.comparison-table td{color:#b5c4d6}.quote{font-size:clamp(24px,3vw,36px);line-height:1.35;padding:36px;border-left:4px solid var(--blue);background:#0e1d30;border-radius:0 16px 16px 0}.note{border:1px solid #3b5c7d;background:#10243a;border-radius:14px;padding:20px;color:#bdcad9}
@media(max-width:980px){.nav-links{position:fixed;left:24px;right:24px;top:86px;display:none;flex-direction:column;align-items:stretch;background:#0d1b2c;border:1px solid #314b68;border-radius:14px;padding:12px;box-shadow:var(--shadow)}.nav-links.open{display:flex}.menu-button{display:block}.nav-actions .button{display:none}.hero{grid-template-columns:1fr;gap:38px}.product-window{transform:none;max-width:680px}.grid.four{grid-template-columns:repeat(2,1fr)}.grid.three,.footer-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:650px){.container{width:min(100% - 30px,1220px)}.nav{height:68px}.brand img{width:42px;height:42px}.hero{min-height:auto;padding:58px 0}.hero h1{font-size:42px}.section{padding:64px 0}.section-head{display:block}.grid.three,.grid.four,.stats,.footer-grid,.logo-grid{grid-template-columns:1fr}.logo-card.proposed{grid-column:auto}.logo-card.proposed .logo-visual{min-height:280px}.screen{grid-template-columns:58px 1fr}.mock-cards{grid-template-columns:1fr}.mock-card:nth-child(n+2){display:none}.callout{grid-template-columns:1fr;padding:28px}.callout .button{width:100%}.copyright{display:block}.copyright span{display:block;margin:6px 0}.comparison-table{display:block;overflow-x:auto}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none}.card,.button,.product-window{transition:none}}

/* Page transitions and the shared interactive city skyline. */
html{background:var(--bg)}
body{opacity:1;transform:none;transition:opacity .24s ease,transform .24s cubic-bezier(.22,.8,.28,1);will-change:opacity,transform}
html.js body{opacity:0;transform:translateY(8px)}
html.js body.page-ready{opacity:1;transform:none}
html.js body.page-leaving{opacity:0;transform:translateY(-7px);pointer-events:none}
.hero{--city-x:0px;--city-y:0px;--glow-x:72%;--glow-y:44%;position:relative;isolation:isolate}
.hero>*:not(.city-backdrop){position:relative;z-index:3}
.hero.compact{max-width:1220px}
.hero.compact>div:not(.city-backdrop){max-width:810px}
.hero h1{text-shadow:0 4px 30px #03101dbd}
.city-backdrop{--city-scale:1.035;--city-opacity:.8;position:absolute!important;z-index:0!important;right:-8vw;bottom:0;width:min(820px,64vw);height:100%;pointer-events:none;overflow:hidden;opacity:var(--city-opacity);transform:translate3d(var(--city-x),var(--city-y),0) scale(var(--city-scale));transform-origin:70% 100%;transition:transform .8s cubic-bezier(.2,.75,.2,1),opacity .5s}
.city-backdrop:before{content:"";position:absolute;inset:-3%;background:url("city-hero.png") center bottom/contain no-repeat;filter:saturate(1.13) contrast(1.05) drop-shadow(0 0 30px #0868c545);-webkit-mask-image:linear-gradient(to right,transparent 0,#000 20%,#000 92%,transparent 100%);mask-image:linear-gradient(to right,transparent 0,#000 20%,#000 92%,transparent 100%)}
.hero:not(.compact) .city-backdrop{right:-7vw;width:min(980px,72vw)}
.hero:not(.compact) .city-backdrop:before{background-size:cover;background-position:center 58%;-webkit-mask-image:linear-gradient(to right,transparent 0,#000 16%,#000 94%,transparent 100%);mask-image:linear-gradient(to right,transparent 0,#000 16%,#000 94%,transparent 100%)}
.city-backdrop:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at var(--glow-x) var(--glow-y),#51adff30 0,transparent 22%),linear-gradient(to right,var(--bg) 0,transparent 28%),linear-gradient(to top,#07111f 0,transparent 20%);mix-blend-mode:screen}
.hero.compact .city-backdrop{left:calc(50% - 50vw);right:auto;width:100vw;opacity:.48;transform-origin:72% 100%}
.hero.compact .city-backdrop:before{background-image:url("city-hero.png"),url("city-hero.png"),url("city-hero.png");background-repeat:no-repeat;background-size:auto 168%,auto 186%,auto 158%;background-position:left -2vw bottom,center bottom,right -2vw bottom;filter:saturate(1.12) contrast(1.06) drop-shadow(0 0 28px #0868c540);-webkit-mask-image:linear-gradient(to right,transparent 0,#000 5%,#000 97%,transparent 100%);mask-image:linear-gradient(to right,transparent 0,#000 5%,#000 97%,transparent 100%)}
.next-kicker{display:inline-block;margin-bottom:10px;color:var(--blue);font-size:.78rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase}.page-next{position:relative;overflow:hidden}.page-next:before{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 15%,#3b88ff0c 50%,transparent 82%);transform:translateX(-70%);transition:transform .75s ease}.page-next:hover:before{transform:translateX(70%)}.page-next>*{position:relative;z-index:1}.page-next .button span{display:inline-block;margin-left:8px;transition:transform .24s ease}.page-next .button:hover span{transform:translateX(5px)}.final-download{border-color:#3787ff66;background:linear-gradient(135deg,#122744,#0d1c31)}.final-download .button span{transform:none}.final-download .button:hover span{transform:translateY(3px)}
.city-windows{position:absolute;inset:0;z-index:2}
.city-window{position:absolute;width:4px;height:7px;border-radius:1px;background:#ffe4a3;box-shadow:0 0 6px #ffcf5e,0 0 15px #3fa6ff;opacity:0}
.page-ready .city-window.on{animation:windowSwitchOn .7s var(--switch-delay) cubic-bezier(.18,.8,.25,1) both,windowBreathe 4.8s var(--pulse-delay) ease-in-out infinite}
html.js .city-backdrop{opacity:0;transform:translate3d(var(--city-x),calc(var(--city-y) + 14px),0) scale(calc(var(--city-scale) - .025))}
html.js .page-ready .city-backdrop{opacity:var(--city-opacity);transform:translate3d(var(--city-x),var(--city-y),0) scale(var(--city-scale));transition:opacity .9s .28s ease,transform 1s .28s cubic-bezier(.18,.78,.2,1)}
@keyframes windowSwitchOn{0%{opacity:0;transform:scale(.45)}55%{opacity:1;transform:scale(1.35)}100%{opacity:.88;transform:scale(1)}}
@keyframes windowBreathe{0%,100%{opacity:.62}50%{opacity:1}}
@media(max-width:980px){.city-backdrop{right:-18vw;width:min(760px,78vw);opacity:.47}.hero.compact .city-backdrop{left:calc(50% - 50vw);right:auto;width:100vw;opacity:.34}}
@media(max-width:650px){.city-backdrop{right:-42vw;width:118vw;opacity:.25}.hero.compact .city-backdrop{left:calc(50% - 50vw);right:auto;width:100vw;opacity:.22}.city-window{display:none}}
@media(prefers-reduced-motion:reduce){body,html.js body,html.js body.page-ready,html.js body.page-leaving{opacity:1;transform:none;transition:none}.city-backdrop{transform:none;transition:none}.city-window{animation:none}}

/* Logo history uses the same Graphite Blue visual language as the site. */
.logo-visual{position:relative;padding:34px;overflow:hidden;background:radial-gradient(circle at 50% 45%,#1b4774 0,transparent 52%),linear-gradient(145deg,#0b192b,#07111f)}
.logo-visual:before{content:"";position:absolute;inset:0;background-image:linear-gradient(#4489d117 1px,transparent 1px),linear-gradient(90deg,#4489d117 1px,transparent 1px);background-size:32px 32px;-webkit-mask-image:radial-gradient(circle,#000,transparent 76%);mask-image:radial-gradient(circle,#000,transparent 76%)}
.logo-card.proposed .logo-visual{background:radial-gradient(circle at 50% 45%,#16579a 0,transparent 55%),linear-gradient(145deg,#07172d,#09264c)}
.logo-visual img{position:relative;z-index:1;transition:transform .45s cubic-bezier(.18,.8,.22,1),filter .35s}
.logo-card.legacy .logo-visual img{filter:invert(1) hue-rotate(180deg) brightness(1.12) contrast(1.04);mix-blend-mode:screen}
.logo-card.proposed .logo-visual img{width:min(470px,88%);border-radius:0;filter:saturate(1.15) brightness(1.12) contrast(1.05) drop-shadow(0 24px 45px #0008) drop-shadow(0 0 30px #338fff66);mix-blend-mode:screen;-webkit-mask-image:radial-gradient(ellipse 64% 68% at center,#000 38%,transparent 82%);mask-image:radial-gradient(ellipse 64% 68% at center,#000 38%,transparent 82%)}
.logo-card:hover .logo-visual img{transform:scale(1.035)}

/* Keep the complete skyline readable on inner pages and reveal it on the home hero. */
.hero.compact .city-backdrop:before{background-size:auto 108%,auto 122%,auto 110%;background-position:left -3vw bottom,center bottom,right -3vw bottom}
.city-window{width:5px;height:8px;border-radius:2px;box-shadow:0 0 7px #ffcf5e,0 0 18px #3fa6ff}
@media(min-width:1500px){.hero:not(.compact) .product-window{transform:translateX(-105px) perspective(1100px) rotateY(-5deg) rotateX(2deg)}.hero:not(.compact) .product-window:hover{transform:translateX(-105px) perspective(1100px) rotateY(-2deg) rotateX(0) translateY(-6px)}}