:root {
  --ink: #07111f;
  --ink-soft: #142238;
  --blue: #4a73ff;
  --cyan: #73e7e1;
  --paper: #f3f5f4;
  --muted: #7c8797;
  --line: rgba(7, 17, 31, .12);
  --white: #fff;
  --sans: "DM Sans", "Noto Sans SC", sans-serif;
  --radius-large: 30px;
  --radius-card: 24px;
  --radius-control: 14px;
}

* { box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: var(--sans); -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
a:focus:not(:focus-visible),button:focus:not(:focus-visible),summary:focus:not(:focus-visible) { outline:none; }
a:focus-visible,button:focus-visible,summary:focus-visible { outline:2px solid var(--blue); outline-offset:3px; }
.container { width: min(1320px, calc(100% - 48px)); margin-inline: auto; }
.page-noise { position: fixed; inset: 0; opacity: .025; pointer-events: none; z-index: 20; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.9'/%3E%3C/svg%3E"); }

.site-header { position:fixed; inset:8px 0 auto; z-index:10; height:84px; color:#fff; transition:.35s ease; }
.site-header.scrolled { height:84px; color:var(--ink); background:transparent; border-bottom:0; }
.nav-wrap { height:100%; padding:0 32px; display:flex; align-items:center; justify-content:space-between; transition:width .48s cubic-bezier(.22,.8,.25,1),height .35s ease,margin .35s ease,padding .35s ease,background .35s ease,border-radius .35s ease,box-shadow .35s ease; will-change:width; }
.site-header.scrolled .nav-wrap { height:64px; margin-top:20px; padding:0 32px; border:1px solid rgba(7,17,31,.09); border-radius:20px; background:rgba(243,245,244,.86); box-shadow:0 12px 38px rgba(7,17,31,.08); backdrop-filter:blur(18px) saturate(140%); -webkit-backdrop-filter:blur(18px) saturate(140%); }
.brand { display: flex; align-items: center; gap: 24px; font-size: 18px; font-weight: 700; letter-spacing: .18em; }
.brand small { display: block; margin-top: 2px; color: #8c98a7; font-size: 7px; letter-spacing: .35em; }
.brand-mark { width:101px; height:30px; display:flex; align-items:flex-end; gap:3px; transform:none; }
.brand-mark i { display:block; width:5px; height:17px; flex:0 0 5px; margin:0; border-radius:1px; background:linear-gradient(180deg,var(--cyan),var(--blue)); transform:skewX(-24deg); transform-origin:center bottom; }
/* Long strokes: l, the first stroke of h, and tt. */
.brand-mark i.long { height:30px; }
.main-nav { position:relative; display:flex; gap:36px; margin-left:auto; margin-right:0; }
.main-nav a { position: relative; font-size: 13px; color: inherit; opacity: .65; transition: .2s; }
.main-nav a:hover, .main-nav a.active { opacity: 1; }
.main-nav a.active:after { display:none; }
.nav-indicator { position:absolute; left:0; bottom:-10px; width:0; height:2px; border-radius:99px; opacity:0; pointer-events:none; background:linear-gradient(90deg,#142238,#315a9d,#142238); background-size:200% 100%; box-shadow:0 0 9px rgba(49,90,157,.38); transform:translateX(0); transition:transform .42s cubic-bezier(.22,.8,.25,1),width .42s cubic-bezier(.22,.8,.25,1),opacity .2s ease; animation:nav-active-flow 2.2s linear infinite; }
.nav-indicator.ready { opacity:1; }
@keyframes nav-active-flow { from { background-position:200% 0; } to { background-position:0 0; } }
.nav-action { padding:12px 17px; border:1px solid rgba(255,255,255,.35); border-radius:var(--radius-control); font-size:12px; }
.scrolled .nav-action { border-color: var(--line); }
.nav-action span { margin-left: 12px; color: var(--cyan); }
.menu-toggle { display: none; padding: 5px; border: 0; background: none; color: inherit; }
.menu-toggle span { display: block; width: 24px; height: 1px; margin: 6px; background: currentColor; }
.menu-toggle span { transition:transform .28s ease,opacity .2s ease; }
.menu-toggle[aria-expanded="true"] span:first-child { transform:translateY(3.5px) rotate(45deg); }
.menu-toggle[aria-expanded="true"] span:last-child { transform:translateY(-3.5px) rotate(-45deg); }

.hero { min-height: 820px; position: relative; overflow: hidden; color: #fff; background: radial-gradient(circle at 78% 35%, #17335a 0, #0c1c31 30%, var(--ink) 67%); }
.hero:before { content: ""; position: absolute; inset: 0; background:linear-gradient(90deg,transparent 48%,rgba(115,231,225,.025)); }
.hero-grid { min-height: 820px; display: grid; grid-template-columns: 1.3fr .7fr; align-items: center; position: relative; z-index: 1; }
.hero-copy { padding-top: 70px; }
.eyebrow, .overline { font-size: 10px; font-weight: 600; letter-spacing: .3em; }
.eyebrow { display: flex; align-items: center; gap: 12px; color: #a5b2c2; }
.eyebrow span { width: 26px; height: 1px; background: var(--cyan); }
.hero h1 { margin: 27px 0 25px; font-size: clamp(56px, 6vw, 86px); line-height: 1.04; letter-spacing: -.055em; font-weight: 500; }
.hero h1 em { color: var(--cyan); font-style: normal; font-weight: 400; }
.hero-copy > p { max-width: 510px; color: #96a4b6; font-size: 15px; line-height: 1.9; }
.hero-actions { display: flex; gap: 14px; margin-top: 38px; }
.button { display:inline-flex; min-height:52px; padding:0 22px; align-items:center; justify-content:center; gap:24px; border:1px solid transparent; border-radius:var(--radius-control); font-size:13px; transition:transform .25s,background .25s,box-shadow .25s; }
.button:hover { transform: translateY(-2px); }
.button-primary { color:var(--ink); background:var(--cyan); box-shadow:0 10px 28px rgba(115,231,225,.12); }
.button-ghost { color: #fff; border-color: rgba(255,255,255,.2); }
.play-icon,.action-icon { display:grid; width:28px; height:28px; flex:0 0 28px; place-items:center; border:1px solid rgba(255,255,255,.25); border-radius:50%; font-size:16px; line-height:1; }
.button-primary .action-icon { border-color:rgba(7,17,31,.24); }
.hero-meta { display: flex; gap: 36px; margin-top: 58px; padding-top: 24px; border-top: 1px solid rgba(255,255,255,.1); max-width: 520px; }
.hero-meta div { display: flex; gap: 11px; }.hero-meta strong { color: var(--cyan); font-size: 11px; }.hero-meta span { color: #76869a; font-size: 9px; line-height: 1.6; letter-spacing: .12em; }

.hero-visual { height: 560px; position: relative; margin-top: 55px; perspective: 1000px; }
.visual-glow { position: absolute; width: 420px; height: 420px; top: 55px; left: 85px; background: rgba(67,117,255,.18); border-radius: 50%; filter: blur(55px); }
.glass-card { position: absolute; border: 1px solid rgba(255,255,255,.14); background: linear-gradient(145deg, rgba(27,51,83,.85), rgba(8,20,36,.7)); box-shadow: 0 45px 100px rgba(0,0,0,.35); backdrop-filter: blur(10px); }
.card-main { width:360px; height:440px; left:42px; top:45px; padding:28px; border-radius:var(--radius-large); transform:none; overflow:hidden; }
.card-main:after { content: ""; position: absolute; inset: -30%; background: linear-gradient(110deg, transparent 38%, rgba(125,239,231,.12) 50%, transparent 62%); transform: rotate(20deg); }
.card-back { width: 300px; height: 390px; left: 225px; top: 93px; transform: rotateY(-9deg) rotateZ(9deg); opacity: .5; }
.card-index { position: absolute; right: 25px; top: 23px; font-size: 10px; color: var(--cyan); }.mini-lines { position: absolute; left: 28px; bottom: 28px; }.mini-lines i { display:block; width: 90px; height: 1px; margin: 10px 0; background: rgba(255,255,255,.25); }
.card-top { display: flex; justify-content: space-between; color: #8595a8; font-size: 8px; letter-spacing: .15em; }.status-dot { width: 5px; height: 5px; margin-right: auto; background: var(--cyan); border-radius: 50%; box-shadow: 0 0 12px var(--cyan); }
.card-symbol { position: absolute; inset: 75px 25px 130px; display: flex; align-items: center; justify-content: center; }.card-symbol span { position:absolute; width: 145px; height: 145px; border: 1px solid rgba(115,231,225,.45); transform: rotate(45deg); }.card-symbol span:nth-child(2) { width: 105px; height: 105px; border-color: rgba(74,115,255,.7); }.card-symbol span:nth-child(3) { width: 55px; height: 55px; background: linear-gradient(135deg, rgba(115,231,225,.6), rgba(74,115,255,.1)); }
.card-content { position: absolute; bottom: 28px; left: 28px; }.card-content small { color: var(--cyan); font-size: 8px; letter-spacing: .22em; }.card-content h3 { margin: 11px 0; font-weight: 500; line-height: 1.4; }.card-content p { margin: 0; color: #7f8fa2; font-size: 9px; }
.tech-art { position:absolute; inset:0; overflow:hidden; background:radial-gradient(circle at 50% 48%,rgba(77,128,255,.28),transparent 34%),linear-gradient(145deg,#0d1b2e,#18324f); }
.tech-grid { position:absolute; inset:0; opacity:.42; background-image:linear-gradient(rgba(115,231,225,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(115,231,225,.08) 1px,transparent 1px); background-size:38px 38px; transform:perspective(480px) rotateX(58deg) scale(1.45); transform-origin:center 72%; }
.tech-ring { position:absolute; left:50%; top:48%; border:1px solid rgba(115,231,225,.52); border-radius:50%; transform:translate(-50%,-50%); box-shadow:0 0 28px rgba(115,231,225,.08),inset 0 0 28px rgba(74,115,255,.08); }
.ring-outer { width:250px; height:250px; }
.ring-middle { width:174px; height:174px; border-color:rgba(74,115,255,.75); }
.tech-core { position:absolute; left:50%; top:48%; width:92px; height:92px; transform:translate(-50%,-50%) rotate(45deg); border:1px solid rgba(115,231,225,.65); background:linear-gradient(135deg,rgba(115,231,225,.34),rgba(74,115,255,.12)); box-shadow:0 0 50px rgba(74,115,255,.25); }
.tech-core i { position:absolute; display:block; background:#d9ffff; box-shadow:0 0 15px var(--cyan); }
.tech-core i:nth-child(1) { width:28px; height:2px; left:31px; top:44px; }
.tech-core i:nth-child(2) { width:2px; height:28px; left:44px; top:31px; }
.tech-core i:nth-child(3) { width:8px; height:8px; left:41px; top:41px; border-radius:50%; }
.tech-line { position:absolute; height:1px; background:linear-gradient(90deg,transparent,var(--cyan),transparent); opacity:.7; }
.line-one { width:290px; left:32px; top:132px; transform:rotate(-24deg); }
.line-two { width:260px; left:52px; bottom:112px; transform:rotate(19deg); }
.tech-dot { position:absolute; width:7px; height:7px; border-radius:50%; background:var(--cyan); box-shadow:0 0 14px var(--cyan); }
.dot-one { left:54px; top:92px; }.dot-two { right:57px; bottom:78px; }
.frosted-half { position:absolute; z-index:3; inset:0 0 0 50%; overflow:hidden; border-left:1px solid rgba(255,255,255,.24); border-radius:0 var(--radius-large) var(--radius-large) 0; background:rgba(207,231,245,.12); backdrop-filter:blur(17px) saturate(145%); -webkit-backdrop-filter:blur(17px) saturate(145%); box-shadow:inset 1px 0 rgba(255,255,255,.12); }
.frosted-half:before { content:""; position:absolute; inset:0; background:linear-gradient(135deg,rgba(255,255,255,.16),rgba(255,255,255,.015) 55%,rgba(115,231,225,.08)); }
.frosted-half span { position:absolute; width:72px; height:1px; right:22px; top:24px; background:rgba(255,255,255,.45); box-shadow:0 7px rgba(255,255,255,.18); }
.float-label { position: absolute; padding: 13px 16px; border: 1px solid rgba(255,255,255,.12); color: #9babbc; background: rgba(7,17,31,.72); font-size: 8px; letter-spacing: .16em; backdrop-filter: blur(10px); }.label-one { left: 53px; top: 160px; }.label-one b { color: var(--cyan); margin-left: 16px; }.label-two { right: -3px; bottom: 107px; }.label-two span { display:inline-block; width: 5px; height: 5px; margin-right: 8px; background: var(--cyan); border-radius:50%; }
.hero-orbit { position: absolute; border: 1px solid rgba(255,255,255,.04); border-radius: 50%; }.orbit-one { width: 680px; height: 680px; right: -180px; top: 30px; }.orbit-two { width: 430px; height: 430px; right: -60px; top: 150px; }
.scroll-cue { position: absolute; z-index: 2; bottom: 36px; left: 50%; display:flex; align-items:center; gap:12px; transform: translateX(-50%); color:#697b91; font-size:8px; letter-spacing:.22em; }.scroll-cue span { display:block; width:1px; height:28px; background:linear-gradient(var(--cyan),transparent); }

.section { padding:120px 0; }.vision { position:relative; color:#fff; background:linear-gradient(125deg,#0a1627,#102b44); overflow:hidden; }.vision:after { content:""; position:absolute; width:520px; height:520px; right:-8%; top:-25%; border:1px solid rgba(115,231,225,.12); border-radius:50%; box-shadow:0 0 0 70px rgba(74,115,255,.035),0 0 0 140px rgba(115,231,225,.02); }.vision-layout { position:relative; z-index:1; display:grid; grid-template-columns:.65fr 1.8fr; gap:80px; align-items:start; }.vision-label { display:flex; align-items:center; justify-content:space-between; padding-top:11px; }.vision .overline { color:var(--cyan); }.vision-index { display:grid; width:42px; height:42px; place-items:center; border:1px solid rgba(255,255,255,.16); border-radius:50%; color:#8e9eb1; font-size:10px; }.vision-statement { max-width:920px; }.vision-statement h2 { font-size:clamp(44px,4.5vw,68px); }.vision-statement p { max-width:720px; margin:34px 0 0; padding-left:26px; border-left:1px solid var(--cyan); color:#9aaabd; font-size:17px; line-height:1.9; }.vision-principles { grid-column:1/-1; display:grid; grid-template-columns:repeat(3,1fr); gap:0; margin-top:35px; border-top:1px solid rgba(255,255,255,.12); border-bottom:1px solid rgba(255,255,255,.12); }.vision-principles article { min-height:230px; padding:34px 40px 38px 0; }.vision-principles article + article { padding-left:40px; border-left:1px solid rgba(255,255,255,.12); }.vision-principles span { color:var(--cyan); font-size:10px; letter-spacing:.16em; }.vision-principles h3 { margin:28px 0 14px; font-size:23px; font-weight:500; }.vision-principles p { max-width:330px; margin:0; color:#8798aa; font-size:14px; line-height:1.85; }.intro { position:relative; overflow:hidden; background:linear-gradient(145deg,#eef2f2,#e6ecec); }.intro:before,.intro:after { content:""; position:absolute; border-radius:50%; pointer-events:none; filter:blur(12px); }.intro:before { width:420px; height:420px; right:4%; top:15%; background:radial-gradient(circle,rgba(74,115,255,.18),rgba(74,115,255,0) 68%); }.intro:after { width:360px; height:360px; left:8%; bottom:-18%; background:radial-gradient(circle,rgba(115,231,225,.24),rgba(115,231,225,0) 68%); }.intro .container { position:relative; z-index:1; }.section-heading { display:grid; grid-template-columns:.7fr 1.25fr .8fr; gap:50px; align-items:start; margin-bottom:58px; }.section-number { display:inline-grid; width:35px; height:35px; margin-right:18px; place-items:center; border:1px solid var(--line); border-radius:50%; color:var(--blue); font-size:9px; }.overline { color:#6f7a87; }.section h2 { margin:0; font-size:clamp(38px,4vw,58px); line-height:1.12; letter-spacing:-.045em; font-weight:500; }.section-heading p, .showcase-copy > p { margin:4px 0 0; color:var(--muted); font-size:14px; line-height:1.85; }
.feature-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }.feature-card { min-height:320px; position:relative; display:flex; flex-direction:column; justify-content:space-between; padding:30px; border:1px solid rgba(255,255,255,.62); border-radius:var(--radius-card); background:rgba(255,255,255,.42); box-shadow:inset 0 1px rgba(255,255,255,.72),0 22px 55px rgba(24,48,72,.07); backdrop-filter:blur(24px) saturate(145%); -webkit-backdrop-filter:blur(24px) saturate(145%); transition:.3s; overflow:hidden; }.feature-card:before { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(135deg,rgba(255,255,255,.24),transparent 48%); }.feature-card > * { position:relative; z-index:1; }.feature-card:hover { transform:translateY(-7px); background:rgba(255,255,255,.6); box-shadow:inset 0 1px rgba(255,255,255,.8),0 28px 68px rgba(11,28,51,.12); }.feature-card.featured { color:#fff; border-color:rgba(255,255,255,.14); background:rgba(10,27,47,.8); box-shadow:inset 0 1px rgba(255,255,255,.1),0 28px 65px rgba(7,17,31,.18); }.feature-number { position:absolute; right:25px; top:24px; color:#9ca6b2; font-size:9px; }.feature-icon { width:54px; height:54px; display:grid; place-items:center; border:1px solid currentColor; border-radius:14px; color:var(--blue); font-size:12px; font-weight:700; letter-spacing:.08em; }.featured .feature-icon { color:var(--cyan); }.tech-tag { display:block; margin-bottom:10px; color:var(--blue); font-size:9px; font-weight:700; letter-spacing:.18em; }.featured .tech-tag { color:var(--cyan); }.feature-card h3 { margin:0 0 12px; font-size:20px; font-weight:500; }.feature-card p { margin:0; color:#697786; font-size:12px; line-height:1.8; }.featured p { color:#9aaabd; }.card-arrow { position:absolute; right:28px; bottom:28px; color:var(--blue); }.featured .card-arrow { color:var(--cyan); }
.showcase { background:#e9edec; }.showcase-grid { display:grid; grid-template-columns:1.2fr .8fr; gap:85px; align-items:center; }.showcase-stage { min-height:520px; position:relative; overflow:hidden; background:linear-gradient(140deg,#101d31,#193653); }.stage-grid { position:absolute; inset:0; opacity:.4; background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px); background-size:54px 54px; }.stage-label { position:absolute; left:25px; top:23px; color:var(--cyan); font-size:8px; letter-spacing:.2em; }.stage-center { position:absolute; inset:50%; width:240px; height:240px; transform:translate(-50%,-50%) rotate(45deg); }.stage-center i { position:absolute; inset:0; border:1px solid rgba(115,231,225,.35); }.stage-center i:nth-child(2){ inset:30px; border-color:rgba(74,115,255,.7); }.stage-center i:nth-child(3){ inset:65px; background:linear-gradient(135deg,rgba(115,231,225,.52),rgba(74,115,255,.05)); }.stage-center b { position:absolute; inset:105px; background:#fff; box-shadow:0 0 30px var(--cyan); }.stage-caption { position:absolute; display:flex; justify-content:space-between; align-items:end; inset:auto 25px 23px; color:#fff; }.stage-caption strong { font-size:13px; }.stage-caption span { color:#8293a8; font-size:8px; letter-spacing:.1em; }.showcase-copy h2 { margin:33px 0 28px; font-size:44px; }.showcase-copy ul { padding:0; margin:32px 0; list-style:none; border-top:1px solid var(--line); }.showcase-copy li { padding:18px 0; border-bottom:1px solid var(--line); font-size:12px; }.showcase-copy li span { margin-right:22px; color:var(--blue); font-size:9px; }.text-link { display:inline-flex; gap:38px; padding-bottom:7px; border-bottom:1px solid var(--ink); font-size:12px; }.text-link span { color:var(--blue); }
.download { color:#fff; background:var(--ink); }.download-panel { position:relative; overflow:hidden; padding:65px; border:1px solid rgba(255,255,255,.1); border-radius:var(--radius-large); background:linear-gradient(115deg,rgba(24,50,82,.9),rgba(9,22,38,.92)); box-shadow:0 28px 80px rgba(4,12,22,.22); }.download-copy { position:relative; z-index:1; max-width:600px; }.download-copy .overline { color:var(--cyan); }.download-copy h2 { margin:20px 0; }.download-copy p { color:#8e9cae; font-size:13px; line-height:1.8; }.download-file { position:relative; z-index:1; display:grid; grid-template-columns:auto 1fr auto; gap:18px; align-items:center; margin-top:45px; padding:20px; border:1px solid rgba(255,255,255,.08); border-radius:18px; background:rgba(255,255,255,.055); }.file-icon { display:grid; width:48px; height:48px; place-items:center; border:1px solid rgba(115,231,225,.3); border-radius:14px; color:var(--cyan); }.download-file strong { display:block; font-size:13px; }.download-file span { display:block; margin-top:5px; color:#738399; font-size:8px; letter-spacing:.16em; }.button-light { color:var(--ink); background:#fff; }.download-decoration { position:absolute; width:400px; height:400px; right:-40px; top:-130px; transform:rotate(45deg); }.download-decoration i { position:absolute; inset:0; border:1px solid rgba(115,231,225,.12); }.download-decoration i:nth-child(2){inset:55px;border-color:rgba(74,115,255,.25)}.download-decoration i:nth-child(3){inset:110px;background:rgba(115,231,225,.04)}
.contact { background:var(--cyan); }.contact-row { display:flex; align-items:center; justify-content:space-between; }.contact .overline { color:#326a70; }.contact h2 { margin-top:17px; }.round-link { display:grid; width:100px; height:100px; place-items:center; border:1px solid rgba(7,17,31,.35); border-radius:50%; font-size:30px; transition:.25s; }.round-link:hover { color:#fff; background:var(--ink); transform:rotate(45deg); }
.site-footer { padding:42px 0; color:#9aa4b2; background:#050c16; }.footer-grid { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; }.footer-brand { color:#fff; }.site-footer p { font-size:8px; letter-spacing:.12em; }.footer-links { display:flex; justify-content:flex-end; gap:25px; font-size:9px; }
/* Enlarged visual scale: keeps the original design language while improving presence and readability. */
.brand { gap:28px; font-size:21px; }
.brand small { margin-top:3px; font-size:9px; }
.brand-mark { width:101px; height:30px; gap:3px; }
.main-nav a { font-size:15px; }
.nav-action { padding:14px 20px; font-size:14px; }
.eyebrow, .overline { font-size:12px; letter-spacing:.27em; }
.hero h1 { margin:30px 0 28px; font-size:clamp(64px,6.6vw,96px); }
.hero-copy > p { max-width:550px; font-size:18px; }
.button { min-height:58px; padding:0 27px; font-size:15px; }
.play-icon { width:32px; height:32px; font-size:17px; }
.hero-meta strong { font-size:14px; }
.hero-meta span { font-size:11px; color:#8594a6; }
.card-top, .card-content small { font-size:10px; }
.card-content h3 { font-size:22px; }
.card-content p { font-size:11px; }
.card-symbol span { width:175px; height:175px; }
.card-symbol span:nth-child(2) { width:125px; height:125px; }
.card-symbol span:nth-child(3) { width:68px; height:68px; }
.float-label { padding:16px 19px; font-size:10px; }
.float-label b { font-size:15px; }
.section-number { width:43px; height:43px; font-size:12px; }
.section h2 { font-size:clamp(44px,4.4vw,66px); }
.section-heading p, .showcase-copy > p { font-size:17px; }
.feature-card { min-height:350px; padding:34px; }
.feature-number { font-size:12px; }
.feature-icon { width:70px; height:70px; font-size:29px; }
.feature-card h3 { font-size:24px; }
.feature-card p { max-width:290px; font-size:15px; }
.card-arrow { font-size:22px; }
.stage-label { font-size:10px; }
.stage-center { width:280px; height:280px; }
.stage-center i:nth-child(2) { inset:36px; }
.stage-center i:nth-child(3) { inset:76px; }
.stage-center b { inset:122px; }
.stage-caption strong { font-size:16px; }
.stage-caption span { font-size:10px; }
.showcase-copy h2 { font-size:50px; }
.showcase-copy li { font-size:15px; }
.showcase-copy li span { font-size:12px; }
.text-link { font-size:15px; }
.download-copy p { font-size:16px; }
.download-file { gap:22px; padding:24px; }
.file-icon { width:64px; height:64px; font-size:24px; }
.download-file strong { font-size:16px; }
.download-file span { font-size:10px; }
.download-decoration { width:460px; height:460px; }
.round-link { width:120px; height:120px; font-size:40px; }
.site-footer p { font-size:10px; }
.footer-links { font-size:12px; }

.feature-card { --mouse-x:50%; --mouse-y:50%; }
.feature-card,.feature-card.featured { color:#fff; border-color:rgba(255,255,255,.14); background:rgba(10,27,47,.84); box-shadow:inset 0 1px rgba(255,255,255,.1),0 24px 60px rgba(7,17,31,.15); }
.feature-card:hover,.feature-card.featured:hover { background:rgba(10,27,47,.84); box-shadow:inset 0 1px rgba(255,255,255,.14),0 30px 72px rgba(7,17,31,.22); }
.feature-card .feature-icon,.feature-card .tech-tag,.feature-card .card-arrow { color:var(--cyan); }
.feature-card p,.feature-card.featured p { color:#9aaabd; }
.feature-card:before { z-index:2; inset:0; padding:1px; border-radius:inherit; opacity:0; background:radial-gradient(190px circle at var(--mouse-x) var(--mouse-y),rgba(255,255,255,.98),rgba(255,255,255,.38) 40%,transparent 72%); -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask-composite:exclude; transition:opacity .25s ease; }
.feature-card:after { content:""; position:absolute; z-index:0; inset:0; pointer-events:none; border-radius:inherit; opacity:0; background:radial-gradient(260px circle at var(--mouse-x) var(--mouse-y),rgba(255,255,255,.2),rgba(255,255,255,.07) 40%,transparent 72%); transition:opacity .28s ease; }
.feature-card:hover:before,.feature-card:hover:after { opacity:1; }
.feature-card.featured:after { background:radial-gradient(270px circle at var(--mouse-x) var(--mouse-y),rgba(255,255,255,.2),rgba(255,255,255,.07) 42%,transparent 73%); }
.download-file .button > span { display:inline-block; margin:0; color:inherit; font-size:22px; line-height:1; letter-spacing:0; transform:translateY(-1px); }
.file-icon.app-icon { padding:0; border-color:rgba(255,255,255,.18); background:#050505; overflow:hidden; box-shadow:0 8px 22px rgba(0,0,0,.2); }
.file-icon.app-icon img { display:block; width:100%; height:100%; object-fit:cover; }
.download-file + .download-file { margin-top:12px; }
.file-icon.package-icon { border-color:rgba(115,231,225,.24); background:linear-gradient(145deg,rgba(115,231,225,.12),rgba(74,115,255,.13)); color:var(--cyan); font-size:13px; font-weight:700; letter-spacing:.04em; }
.technology-details { display:grid; grid-template-columns:.72fr 1.8fr; gap:70px; margin-top:72px; padding-top:42px; border-top:1px solid rgba(7,17,31,.12); }
.technology-details-title .overline { color:var(--blue); }
.technology-details-title h3 { max-width:320px; margin:20px 0 0; font-size:28px; line-height:1.28; font-weight:500; letter-spacing:-.035em; }
.technology-detail-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:0 48px; }
.technology-detail-grid article { min-height:170px; padding:0 0 28px; }
.technology-detail-grid article:nth-child(n+3) { padding-top:28px; border-top:1px solid rgba(7,17,31,.1); }
.technology-detail-grid span { color:var(--blue); font-size:9px; font-weight:700; letter-spacing:.16em; }
.technology-detail-grid h4 { margin:14px 0 10px; font-size:18px; font-weight:600; }
.technology-detail-grid p { margin:0; color:#72808e; font-size:13px; line-height:1.8; }

.vision-index { display:none; }
.vision-label { justify-content:flex-start; }
.site-header:not(.scrolled) .nav-wrap { width:100%; max-width:none; }

/* Interactive development roadmap */
.roadmap { padding:96px 0; color:var(--ink); background:#fff; }
.roadmap-heading { display:grid; grid-template-columns:1.4fr .6fr; gap:70px; align-items:end; margin-bottom:40px; }
.roadmap-heading .overline { display:block; margin-bottom:24px; color:var(--blue); }
.roadmap-heading h2 { font-size:clamp(44px,4.4vw,66px); }
.roadmap-heading > p { max-width:440px; margin:0 0 6px; color:var(--muted); font-size:16px; line-height:1.85; }
.project-switcher { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:12px; }
.project-tab { min-width:0; position:relative; display:grid; grid-template-columns:auto 1fr auto; gap:16px; align-items:center; padding:18px 22px; color:var(--ink); text-align:left; border:1px solid var(--line); border-radius:18px; background:#f0f3f3; cursor:pointer; transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease; overflow:hidden; isolation:isolate; }
.project-tab:before { content:""; position:absolute; z-index:-1; inset:0 auto 0 0; width:0; background:linear-gradient(180deg,rgba(255,255,255,.11) 0,rgba(255,255,255,.025) 42%,rgba(0,0,0,.12) 100%),linear-gradient(100deg,#101f34,#173653); box-shadow:inset 0 1px rgba(255,255,255,.1),inset 0 -1px rgba(0,0,0,.16); }
.project-tab:after { content:""; position:absolute; z-index:0; top:0; bottom:0; left:0; width:2px; opacity:0; background:var(--cyan); box-shadow:0 0 18px 5px rgba(115,231,225,.42); }
.project-tab > * { position:relative; z-index:1; }
#tab-timetable { --project-progress:92%; }
#tab-futurechat { --project-progress:28%; }
#tab-portal { --project-progress:86%; }
.project-tab.active:before { animation:project-fill 1.05s cubic-bezier(.22,.8,.25,1) forwards; }
.project-tab.active:after { animation:project-edge 1.05s cubic-bezier(.22,.8,.25,1) forwards,project-edge-glow 2.4s 1.05s ease-in-out infinite; }
@keyframes project-fill { from { width:0; } to { width:var(--project-progress); } }
@keyframes project-edge { 0% { left:0; opacity:0; } 12% { opacity:1; } 100% { left:var(--project-progress); opacity:1; } }
@keyframes project-edge-glow { 0%,100% { opacity:.72; box-shadow:0 0 14px 4px rgba(115,231,225,.32); } 50% { opacity:1; box-shadow:0 0 22px 7px rgba(115,231,225,.56); } }
.project-tab:hover { transform:translateY(-2px); border-color:rgba(74,115,255,.3); }
.project-tab.active { color:#fff; border-color:rgba(16,31,52,.4); background:#edf1f1; box-shadow:0 14px 34px rgba(7,17,31,.1); }
.project-tab.active strong,.project-tab.active small,.project-tab.active .project-tab-index { text-shadow:0 1px 5px rgba(7,17,31,.85); }
.project-tab-index { color:var(--blue); font-size:11px; }
.project-tab.active .project-tab-index { color:var(--cyan); }
.project-tab strong { display:block; font-size:19px; font-weight:600; letter-spacing:.02em; }
.project-tab small { display:block; margin-top:5px; color:#7e8a98; font-size:11px; }
.project-tab.active small { color:#93a2b4; }
.project-tab b { padding:7px 11px; color:#27595e; border:1px solid rgba(255,255,255,.62); border-radius:99px; background:rgba(255,255,255,.38); box-shadow:inset 0 1px rgba(255,255,255,.52),0 5px 16px rgba(20,43,65,.08); backdrop-filter:blur(12px) saturate(150%); -webkit-backdrop-filter:blur(12px) saturate(150%); font-size:9px; font-weight:600; font-style:normal; white-space:nowrap; }
.project-tab b em { margin-right:4px; color:var(--blue); font-size:11px; font-style:normal; }
.project-tab.active b { color:#fff; border-color:rgba(255,255,255,.3); background:rgba(255,255,255,.16); box-shadow:inset 0 1px rgba(255,255,255,.3),0 6px 18px rgba(5,16,29,.16); text-shadow:0 1px 4px rgba(7,17,31,.72); }
.project-tab.active b em { color:var(--cyan); }
.project-panel { border:1px solid var(--line); border-radius:var(--radius-large); background:#f8f9f9; overflow:hidden; }
.project-panel[hidden] { display:none; }
.project-overview { display:grid; grid-template-columns:1fr auto; gap:32px; align-items:end; padding:30px 32px; border-bottom:1px solid var(--line); background:linear-gradient(135deg,#fff,#f2f5f5); }
.project-kicker { color:var(--blue); font-size:9px; font-weight:700; letter-spacing:.2em; }
.project-overview h3 { margin:8px 0 8px; font-size:32px; font-weight:600; letter-spacing:-.035em; }
.project-overview p { max-width:610px; margin:0; color:var(--muted); font-size:14px; line-height:1.8; }
.overview-actions { min-width:180px; display:flex; flex-direction:column; align-items:stretch; gap:12px; }
.overview-progress { display:grid; grid-template-columns:1fr auto; gap:6px 16px; align-items:end; }
.overview-progress > span { color:#7a8795; font-size:10px; letter-spacing:.08em; }
.overview-progress > strong { color:var(--ink); font-size:18px; font-weight:600; }
.overview-progress > div { grid-column:1/-1; height:4px; border-radius:99px; background:#dce2e3; overflow:hidden; }
.overview-progress > div i { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--blue),var(--cyan)); transform:scaleX(0); transform-origin:left center; }
.project-panel.active .overview-progress > div i { animation:overview-progress-fill 1s .12s cubic-bezier(.22,.8,.25,1) forwards; }
@keyframes overview-progress-fill { from { transform:scaleX(0); } to { transform:scaleX(1); } }
.expand-all { width:100%; min-height:45px; display:inline-flex; align-items:center; justify-content:space-between; gap:18px; padding:0 14px 0 16px; color:var(--ink); border:1px solid var(--line); border-radius:12px; background:#fff; cursor:pointer; font-size:11px; white-space:nowrap; }
.expand-all span { color:var(--blue); font-size:17px; }
.roadmap-list { padding:0 32px 18px; }
.roadmap-stage { position:relative; border-bottom:1px solid var(--line); }
.roadmap-stage summary { min-height:76px; display:grid; grid-template-columns:44px 1fr auto 22px; gap:15px; align-items:center; list-style:none; cursor:pointer; }
.roadmap-stage summary::-webkit-details-marker { display:none; }
.roadmap-stage summary > i { color:#8894a1; font-size:19px; font-style:normal; transition:transform .25s; }
.roadmap-stage[open] summary > i { transform:rotate(45deg); }
.stage-marker { display:grid; width:38px; height:38px; place-items:center; border:1px solid var(--line); border-radius:50%; color:#8995a2; font-size:10px; }
.completed .stage-marker { color:#25565a; border-color:rgba(115,231,225,.55); background:rgba(115,231,225,.2); }
.current .stage-marker { color:#fff; border-color:var(--blue); background:var(--blue); box-shadow:0 0 0 6px rgba(74,115,255,.09); }
.stage-copy b { display:block; font-size:17px; font-weight:600; }
.stage-copy small { display:block; margin-top:5px; color:#8b96a2; font-size:11px; }
.stage-status { min-width:58px; padding:7px 9px; text-align:center; border-radius:99px; color:#7c8792; background:#e8ecec; font-size:9px; }
.completed .stage-status { color:#32686c; background:rgba(115,231,225,.18); }
.current .stage-status { color:#fff; background:var(--blue); }
.roadmap-stage ul { margin:0; padding:0 70px 22px 59px; list-style:none; columns:2; column-gap:48px; }
.roadmap-stage li { position:relative; break-inside:avoid; margin:0 0 10px; padding-left:16px; color:#677482; font-size:13px; line-height:1.75; }
.roadmap-stage li:before { content:""; position:absolute; left:0; top:.72em; width:4px; height:4px; border-radius:50%; background:var(--blue); }

.reveal { opacity:0; transform:translateY(28px); transition:opacity .8s ease,transform .8s ease; }.reveal.visible { opacity:1; transform:none; }.delay-1 { transition-delay:.12s; }.delay-2 { transition-delay:.24s; }

@media (max-width: 900px) {
  .nav-wrap,.site-header.scrolled .nav-wrap { padding-inline:18px; }
  .main-nav { position:fixed; inset:100px 15px auto; display:none; flex-direction:column; gap:0; padding:12px 24px 24px; color:var(--ink); background:rgba(243,245,244,.98); border:1px solid var(--line); border-radius:18px; box-shadow:0 18px 45px rgba(7,17,31,.1); }.main-nav.open { display:flex; }.main-nav a { padding:15px 0; border-bottom:1px solid var(--line); }.main-nav a.active:after,.nav-indicator { display:none; }.menu-toggle { display:block; }.nav-action { display:none; }.site-header:not(.scrolled) .menu-toggle { color:#fff; }
  .hero-grid { grid-template-columns:1fr; padding-top:120px; }.hero-copy { padding-top:40px; }.hero { min-height:auto; }.hero-visual { margin:0 auto; width:min(100%,580px); }.hero-grid { min-height:auto; }.scroll-cue { display:none; }
  .vision-layout { grid-template-columns:1fr; gap:42px; }.vision-label { max-width:320px; }.vision-principles { grid-template-columns:1fr; margin-top:10px; }.vision-principles article,.vision-principles article + article { min-height:auto; padding:30px 0; border-left:0; }.vision-principles article + article { border-top:1px solid rgba(255,255,255,.12); }.vision-principles p { max-width:620px; }.section-heading { grid-template-columns:1fr; gap:24px; }.feature-grid { grid-template-columns:1fr; }.feature-card { min-height:240px; }.showcase-grid { grid-template-columns:1fr; gap:50px; }.showcase-copy { order:-1; }.footer-grid { grid-template-columns:1fr; gap:25px; text-align:center; }.footer-brand { justify-content:center; }.footer-links { justify-content:center; }
}
@media (min-width: 901px) {
  .hero h1 { white-space:nowrap; }
}
@media (max-width: 600px) {
  .container { width:min(100% - 30px,1180px); }.brand { font-size:17px; gap:18px; }.brand-mark { width:101px; transform:scale(.76); transform-origin:left bottom; margin-right:-24px; }.brand small { font-size:7px; }.hero h1 { font-size:56px; }.hero-copy > p { font-size:17px; }.hero-meta { gap:12px; justify-content:space-between; }.hero-meta div { display:block; }.hero-meta strong { display:block; margin-bottom:6px; }.hero-visual { height:460px; transform:scale(.82); transform-origin:top left; width:121%; }.section { padding:84px 0; }.section h2,.showcase-copy h2 { font-size:42px; }.showcase-stage { min-height:400px; }.download-panel { padding:38px 24px; }.download-file { grid-template-columns:auto 1fr; }.download-file .button { grid-column:1/-1; width:100%; }.contact-row { align-items:flex-end; }.round-link { width:78px; height:78px; flex:0 0 auto; font-size:30px; }.contact h2 { font-size:36px; }.footer-links { flex-wrap:wrap; }
}
@media (max-width:900px) {
  .site-header.scrolled .nav-wrap { border-color:rgba(255,255,255,.58); background:rgba(239,243,243,.72); box-shadow:0 16px 42px rgba(7,17,31,.14),inset 0 1px rgba(255,255,255,.7); backdrop-filter:blur(24px) saturate(150%); -webkit-backdrop-filter:blur(24px) saturate(150%); }
  .main-nav { display:flex; opacity:0; visibility:hidden; pointer-events:none; transform:translateY(-12px) scale(.985); transform-origin:top center; color:var(--ink); background:rgba(239,243,243,.76); border-color:rgba(255,255,255,.58); box-shadow:0 22px 55px rgba(7,17,31,.16),inset 0 1px rgba(255,255,255,.72); backdrop-filter:blur(24px) saturate(145%); -webkit-backdrop-filter:blur(24px) saturate(145%); transition:opacity .25s ease,transform .32s cubic-bezier(.22,.8,.25,1),visibility .32s; }
  .main-nav.open { display:flex; opacity:1; visibility:visible; pointer-events:auto; transform:none; }
  .main-nav a { opacity:0; transform:translateX(-8px); transition:opacity .24s ease,transform .3s ease,color .2s ease; }
  .main-nav.open a { opacity:1; transform:none; }
  .main-nav.open a:nth-child(2) { transition-delay:.025s; }
  .main-nav.open a:nth-child(3) { transition-delay:.05s; }
  .main-nav.open a:nth-child(4) { transition-delay:.075s; }
  .main-nav.open a:nth-child(5) { transition-delay:.1s; }
  .main-nav a:last-of-type { border-bottom:0; }
  .technology-details { grid-template-columns:1fr; gap:36px; }
  .technology-details-title h3 { max-width:520px; }
  .roadmap-heading { grid-template-columns:1fr; gap:24px; }
  .roadmap-heading > p { max-width:650px; }
  .project-overview { grid-template-columns:1fr auto; }
}
@media (max-width:600px) {
  .hero-grid { padding-top:112px; }
  .hero-copy { padding-top:26px; }
  .hero h1 { font-size:clamp(36px,10.5vw,44px); line-height:1.08; }
  .hero-copy > p { font-size:16px; line-height:1.75; }
  .hero-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-top:30px; }
  .hero-actions .button { width:100%; min-width:0; min-height:56px; padding:0 12px; gap:9px; white-space:nowrap; font-size:14px; }
  .hero-actions .action-icon { width:26px; height:26px; flex-basis:26px; font-size:15px; }
  .hero-visual { width:100%; height:420px; margin:26px auto 0; transform:none; }
  .card-main { width:100%; max-width:360px; height:400px; left:50%; top:12px; transform:translateX(-50%); }
  .technology-details { margin-top:52px; padding-top:34px; }
  .technology-detail-grid { grid-template-columns:1fr; }
  .technology-detail-grid article,.technology-detail-grid article:nth-child(n+3) { min-height:auto; padding:24px 0; border-top:1px solid rgba(7,17,31,.1); }
  .technology-detail-grid article:first-child { padding-top:0; border-top:0; }
  .roadmap-heading h2 { font-size:40px; }
  .project-switcher { grid-template-columns:1fr; }
  .project-tab { padding:18px; }
  .project-overview { grid-template-columns:1fr; gap:20px; padding:24px 22px; }
  .project-overview > div:first-child { grid-column:auto; }
  .project-overview h3 { font-size:30px; }
  .overview-actions { width:100%; align-items:stretch; }
  .expand-all { justify-self:start; }
  .roadmap-list { padding:0 22px 18px; }
  .roadmap-stage summary { min-height:86px; grid-template-columns:38px 1fr 20px; gap:12px; }
  .roadmap-stage summary > i { grid-column:3; grid-row:1; }
  .stage-status { display:none; }
  .stage-marker { width:32px; height:32px; }
  .stage-copy b { font-size:15px; }
  .roadmap-stage ul { padding:0 10px 24px 50px; columns:1; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior:auto; } *,*:before,*:after { animation:none!important; transition:none!important; } .reveal { opacity:1; transform:none; } }