:root { --ink:#0d1216; --ink-2:#11191e; --panel:#172127; --line:#2d3b44; --paper:#f3f0e8; --muted:#a7b1b6; --blue:#9eb9c7; --copper:#d9aa86; --serif:Georgia, "Times New Roman", serif; --sans:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color-scheme:dark; font-family:var(--sans); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; background:var(--ink); }
body { min-width:320px; margin:0; overflow-x:hidden; color:var(--paper); background:var(--ink); }
a { color:inherit; text-underline-offset:.3rem; }
.skip-link { position:fixed; top:-5rem; left:1rem; z-index:100; padding:.8rem 1rem; color:var(--ink); background:var(--paper); }
.skip-link:focus { top:1rem; }
.nav-wrap { position:fixed; z-index:50; top:0; width:100%; border-bottom:1px solid color-mix(in srgb, var(--line) 78%, transparent); background:color-mix(in srgb, var(--ink) 82%, transparent); backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px); }
nav { display:flex; width:min(1420px, calc(100% - 3rem)); min-height:78px; align-items:center; justify-content:space-between; margin:auto; }
.brand { display:flex; align-items:center; gap:.8rem; text-decoration:none; }
.brand span { display:grid; width:40px; height:40px; place-items:center; border:1px solid var(--blue); color:var(--blue); font-size:.68rem; letter-spacing:.08em; }
.nav-links { display:flex; gap:2rem; color:var(--muted); font-size:.83rem; }
.nav-links a, footer a { text-decoration:none; }
.nav-links a:hover, footer a:hover { color:var(--paper); }
.nav-cta, .primary, .secondary { display:inline-flex; min-height:48px; align-items:center; justify-content:center; gap:2rem; border:1px solid var(--line); padding:.8rem 1.1rem; font-size:.79rem; font-weight:750; letter-spacing:.04em; text-decoration:none; text-transform:uppercase; transition:background .2s, color .2s, border .2s, transform .2s; }
.nav-cta:hover, .secondary:hover { border-color:var(--paper); transform:translateY(-2px); }
.primary { border-color:var(--copper); color:var(--ink); background:var(--copper); }
.primary:hover { color:var(--ink); background:var(--paper); transform:translateY(-2px); }
main { overflow:hidden; }
.hero { position:relative; display:grid; min-height:900px; grid-template-columns:1.03fr .97fr; align-items:center; border-bottom:1px solid var(--line); padding:150px max(6vw, 2rem) 80px; background:radial-gradient(circle at 75% 25%, #273943 0, transparent 31rem), linear-gradient(135deg, var(--ink), #10171b 62%, #111c22); }
.hero:before { position:absolute; inset:0; content:""; opacity:.24; background-image:linear-gradient(var(--line) 1px, transparent 1px), linear-gradient(90deg, var(--line) 1px, transparent 1px); background-size:72px 72px; mask-image:linear-gradient(to bottom, black, transparent 80%); }
.hero-copy, .memory-system { position:relative; z-index:1; }
.eyebrow { margin:0 0 1rem; color:var(--blue); font-size:.7rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase; }
.eyebrow span { color:var(--copper); }
h1 { max-width:850px; margin:0; font-size:clamp(4.3rem, 8.2vw, 9rem); font-weight:620; line-height:.81; letter-spacing:-.075em; }
h1 em, .closing em { color:var(--copper); font-family:var(--serif); font-weight:400; }
.hero-deck { max-width:670px; margin:2.2rem 0; color:var(--muted); font-size:clamp(1.05rem, 1.6vw, 1.35rem); line-height:1.65; }
.hero-actions { display:flex; flex-wrap:wrap; gap:.8rem; }
.proof-strip { display:flex; flex-wrap:wrap; gap:.75rem 1.5rem; margin:2.8rem 0 0; padding:0; color:var(--muted); font-size:.72rem; letter-spacing:.08em; list-style:none; text-transform:uppercase; }
.proof-strip li:before { margin-right:.55rem; color:var(--blue); content:"●"; font-size:.55rem; }
.memory-system { width:min(48vw, 680px); aspect-ratio:1; justify-self:end; }
.system-orbit { position:absolute; border:1px solid color-mix(in srgb, var(--blue) 30%, transparent); border-radius:50%; inset:7%; animation:turn 70s linear infinite; }
.system-orbit:before, .system-orbit:after { position:absolute; width:6px; height:6px; border-radius:50%; content:""; background:var(--blue); box-shadow:0 0 25px var(--blue); }
.system-orbit:before { top:19%; left:8%; }.system-orbit:after { right:3%; bottom:29%; }
.system-orbit--inner { inset:24%; animation-direction:reverse; animation-duration:42s; }
.memory-core { position:absolute; display:grid; width:37%; aspect-ratio:1; place-items:center; top:31.5%; left:31.5%; border:1px solid var(--blue); border-radius:21%; background:linear-gradient(145deg, #25333c, #121a1f); box-shadow:0 0 0 16px #10171ccc, 0 0 0 17px var(--line), 0 35px 70px #000b; }
.memory-core:after { position:absolute; width:62%; height:3px; bottom:22%; content:""; background:linear-gradient(90deg, transparent, var(--copper), transparent); box-shadow:0 0 16px var(--copper); }
.memory-core strong { font-size:clamp(2.5rem, 5vw, 5.4rem); letter-spacing:-.08em; }
.core-label, .memory-core small { color:var(--muted); font-size:.65rem; letter-spacing:.15em; }
.client-node { position:absolute; display:grid; min-width:110px; gap:.22rem; border:1px solid var(--line); padding:.85rem; background:#11191ee8; box-shadow:0 18px 35px #0008; }
.client-node span { color:var(--copper); font-size:.65rem; }.client-node strong { font-size:.75rem; }
.client-node--one { top:4%; left:41%; }.client-node--two { top:47%; right:0; }.client-node--three { bottom:5%; left:42%; }.client-node--four { top:47%; left:0; }
.manifesto { display:grid; min-height:480px; place-content:center; border-bottom:1px solid var(--line); padding:6rem 2rem; text-align:center; background:var(--paper); color:var(--ink); }
.manifesto p { margin:0 0 1rem; color:#526068; font-size:.8rem; letter-spacing:.14em; text-transform:uppercase; }
.manifesto h2 { max-width:1000px; margin:0; font:400 clamp(2.5rem, 5.5vw, 6rem)/1.02 var(--serif); letter-spacing:-.04em; }
.product, .architecture, .start, .faq { padding:clamp(6rem, 12vw, 11rem) max(6vw, 2rem); }
.section-heading { display:grid; grid-template-columns:1fr 2fr 1.2fr; gap:2rem; align-items:start; margin-bottom:clamp(3rem, 7vw, 7rem); }
.section-heading h2 { margin:0; font-size:clamp(3rem, 6vw, 6.5rem); line-height:.9; letter-spacing:-.065em; }
.section-heading>p:last-child { margin:0; color:var(--muted); line-height:1.7; }
.feature-grid { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line); border:1px solid var(--line); }
.feature { min-height:480px; padding:clamp(1.6rem, 4vw, 3.8rem); background:var(--ink-2); }
.feature--wide { display:grid; grid-column:1/-1; grid-template-columns:1fr 1.15fr; gap:5rem; align-items:center; }
.number { color:var(--copper); font-size:.68rem; letter-spacing:.14em; }
.feature h3 { max-width:680px; margin:1.2rem 0; font-size:clamp(2rem, 4vw, 4.2rem); line-height:.95; letter-spacing:-.05em; }
.feature p:not(.number) { max-width:650px; color:var(--muted); line-height:1.7; }
.memory-list { display:grid; gap:.65rem; }
.memory-list span { display:grid; grid-template-columns:110px 1fr auto; gap:1rem; border:1px solid var(--line); padding:1.2rem; background:#0c1215; }
.memory-list i { color:var(--blue); font-size:.65rem; font-style:normal; letter-spacing:.1em; }.memory-list b { font-size:.84rem; }.memory-list em { color:var(--muted); font-size:.7rem; font-style:normal; }
.mini-board { display:grid; gap:.55rem; margin-top:3rem; }.mini-board span { display:flex; justify-content:space-between; border-bottom:1px solid var(--line); padding:.9rem 0; color:var(--muted); font-size:.68rem; letter-spacing:.1em; }.mini-board b { color:var(--paper); }
.horizon { display:grid; grid-template-columns:repeat(3,1fr); gap:0; margin-top:5rem; }.horizon i { height:6px; background:var(--line); }.horizon i:first-child { background:var(--copper); }.horizon i:nth-child(2) { background:var(--blue); }.horizon strong { margin-top:.8rem; color:var(--muted); font-size:.7rem; letter-spacing:.12em; }
.portability-list { margin:0; padding:0; list-style:none; }.portability-list li { display:flex; align-items:center; justify-content:space-between; border-top:1px solid var(--line); padding:1.3rem 0; }.portability-list span { color:var(--blue); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; }
.architecture { border-top:1px solid var(--line); background:#10171b; }
.architecture-map { display:grid; width:min(900px,100%); gap:1rem; margin:auto; text-align:center; }.layer { display:grid; gap:.6rem; border:1px solid var(--line); padding:1.8rem; background:var(--ink); }.layer span { color:var(--blue); font-size:.65rem; letter-spacing:.14em; }.layer strong { font-size:clamp(.9rem,2vw,1.2rem); }.layer--primary { border-color:var(--copper); box-shadow:0 0 45px #d9aa8612; }.architecture-map>i { color:var(--muted); font-size:.72rem; font-style:normal; }.layer-grid { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.principles { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; max-width:1100px; margin:5rem auto 0; background:var(--line); }.principles article { padding:2rem; background:#11191e; }.principles strong { font-size:1.1rem; }.principles p { color:var(--muted); line-height:1.6; }
.start { display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(3rem,9vw,10rem); border-top:1px solid var(--line); background:var(--paper); color:var(--ink); }.start .eyebrow { color:#536b78; }.start h2 { margin:0 0 1.5rem; font-size:clamp(3rem,6vw,6rem); line-height:.91; letter-spacing:-.06em; }.start-copy>p:not(.eyebrow) { max-width:570px; margin-bottom:2rem; color:#526068; line-height:1.7; }.start .primary { color:var(--paper); background:var(--ink); border-color:var(--ink); }.start-steps { margin:0; padding:0; list-style:none; }.start-steps li { display:grid; grid-template-columns:auto 1fr; gap:1.4rem; border-top:1px solid #c4c8c5; padding:1.3rem 0; }.start-steps li>span { color:#805f47; font:400 1.2rem var(--serif); }.start-steps strong { font-size:1.2rem; }.start-steps p { margin:.4rem 0 0; color:#5e696e; }
.faq { border-top:1px solid var(--line); }.faq .section-heading { grid-template-columns:1fr 2fr 1.2fr; }.faq-list { max-width:1000px; margin-left:auto; }.faq details { border-top:1px solid var(--line); }.faq details:last-child { border-bottom:1px solid var(--line); }.faq summary { display:flex; min-height:88px; align-items:center; justify-content:space-between; cursor:pointer; font-size:clamp(1.1rem,2vw,1.6rem); list-style:none; }.faq summary:after { color:var(--copper); content:"+"; }.faq details[open] summary:after { content:"−"; }.faq details p { max-width:760px; margin:0 0 2rem; color:var(--muted); line-height:1.7; }
.closing { display:grid; min-height:650px; place-content:center; border-top:1px solid var(--line); padding:6rem 2rem; text-align:center; background:radial-gradient(circle at 50% 100%, #263c47, transparent 50%); }.closing h2 { margin:0 0 2.5rem; font-size:clamp(3.3rem,7vw,7.5rem); line-height:.9; letter-spacing:-.07em; }.closing>div { display:flex; justify-content:center; gap:.8rem; }
footer { display:grid; grid-template-columns:1fr 1fr 1fr; align-items:end; border-top:1px solid var(--line); padding:4rem max(6vw,2rem) max(4rem,env(safe-area-inset-bottom)); color:var(--muted); font-size:.78rem; line-height:1.6; }footer>div { display:flex; justify-content:flex-end; gap:1.4rem; }
.reveal { opacity:0; transform:translateY(24px); transition:opacity .7s ease, transform .7s ease; }.reveal.is-visible { opacity:1; transform:none; }
@keyframes turn { to { transform:rotate(360deg); } }
@media (max-width:980px) { .nav-links { display:none; }.hero { min-height:auto; grid-template-columns:1fr; gap:5rem; }.memory-system { width:min(84vw,650px); justify-self:center; }.section-heading { grid-template-columns:1fr; }.section-heading .eyebrow { margin-bottom:0; }.feature--wide, .start { grid-template-columns:1fr; }.feature--wide { gap:2rem; }.memory-list span { grid-template-columns:90px 1fr; }.memory-list em { grid-column:2; }.faq .section-heading { grid-template-columns:1fr; } }
@media (max-width:680px) { nav { width:calc(100% - 1.5rem); min-height:68px; }.brand strong { font-size:.84rem; }.nav-cta { min-height:42px; padding:.6rem .8rem; }.nav-cta span { display:none; }.hero { padding:120px 1rem 4rem; }.hero-actions>a { width:100%; }.memory-system { width:94vw; margin-left:-2vw; }.client-node { min-width:83px; padding:.65rem; }.client-node strong { font-size:.65rem; }.core-label,.memory-core small { font-size:.65rem; letter-spacing:.08em; }.product,.architecture,.start,.faq { padding:5rem 1rem; }.feature-grid { grid-template-columns:1fr; }.feature--wide { grid-column:auto; }.feature { min-height:auto; padding:2rem 1.2rem; }.memory-list span { grid-template-columns:1fr; }.memory-list em { grid-column:auto; }.layer-grid,.principles { grid-template-columns:1fr; }.closing>div { flex-direction:column; }.closing>div a { width:100%; }footer { grid-template-columns:1fr; gap:2rem; }footer>div { justify-content:flex-start; flex-wrap:wrap; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; }.system-orbit { animation:none; }.reveal { opacity:1; transform:none; transition:none; } }