:root { --bg:#0b0b10; --panel:#111119; --text:#f7f4f8; --muted:#a5a1ad; --line:rgba(255,255,255,.11); --purple:#9501d8; --mint:#75f16c; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; background:var(--bg); }
body { margin:0; color:var(--text); font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; background:radial-gradient(circle at 78% 8%,rgba(149,1,216,.15),transparent 28rem),var(--bg); }
a { color:inherit; } button { font:inherit; cursor:pointer; } :focus-visible { outline:3px solid #cf6bff; outline-offset:3px; }
.topbar { position:sticky; top:0; z-index:3; height:68px; padding:0 clamp(20px,5vw,68px); display:flex; align-items:center; gap:18px; border-bottom:1px solid var(--line); background:rgba(11,11,16,.88); backdrop-filter:blur(16px); }
.brand { display:inline-flex; align-items:center; gap:7px; font-weight:850; text-decoration:none; }.brand span { display:grid; place-items:center; width:27px; height:27px; border-radius:7px; background:#aaf05c; color:#281038; }
.project-badge { color:var(--muted); font-size:.84rem; text-decoration:none; }.project-badge i { display:inline-block; width:7px; height:7px; margin-right:7px; border-radius:50%; background:var(--mint); box-shadow:0 0 11px var(--mint); }.share-button { margin-left:auto; min-height:36px; padding:0 13px; border:1px solid var(--line); border-radius:8px; color:var(--text); background:transparent; font-size:.82rem; font-weight:700; }.share-button:hover { border-color:#d6c8dc; }
.page-layout { width:min(1280px,100%); margin:0 auto; display:grid; grid-template-columns:235px minmax(0,760px); justify-content:center; min-height:calc(100vh - 68px); }
.doc-nav { padding:53px 30px 40px 0; border-right:1px solid var(--line); }.nav-kicker,.section-label,.document-meta { color:#ca78ef; font-size:.68rem; font-weight:850; letter-spacing:.12em; }.doc-nav h1 { margin:11px 0 2px; font-size:1.25rem; letter-spacing:-.04em; }.doc-nav h1 a { color:inherit; text-decoration:none; }.nav-subtitle { margin:0; color:var(--muted); font-size:.82rem; }.doc-nav nav { display:grid; gap:4px; margin-top:34px; }.doc-nav nav a { padding:9px 10px; border-radius:7px; color:var(--muted); text-decoration:none; font-size:.86rem; }.doc-nav nav a:hover,.doc-nav nav a.active { color:var(--text); background:rgba(149,1,216,.13); }.publication-state { margin-top:47px; padding:14px; border:1px solid var(--line); border-radius:10px; color:#d4d0d8; font-size:.78rem; line-height:1.7; }.publication-state span { color:var(--mint); }.publication-state small { color:var(--muted); }
.document { padding:62px clamp(28px,6vw,82px) 90px; }.document-meta { display:flex; justify-content:space-between; gap:20px; color:var(--muted); font-size:.59rem; }.cover { position:relative; min-height:350px; display:flex; align-items:end; overflow:hidden; margin:25px 0 82px; padding:42px; border:1px solid rgba(201,117,241,.34); border-radius:18px; background:linear-gradient(125deg,#230636,#0c1425 59%,#081918); }.cover-art { position:absolute; inset:0; overflow:hidden; }.cover-art i { position:absolute; display:block; border:1px solid rgba(216,132,255,.37); border-radius:50%; }.cover-art i:nth-child(1){ width:430px;height:430px;right:-104px;top:-170px; }.cover-art i:nth-child(2){ width:270px;height:270px;left:-95px;bottom:-166px; }.cover-art i:nth-child(3){ width:18px;height:18px;left:50%;top:25%;background:#b9ff6c;border:0;box-shadow:0 0 28px #b9ff6c; }.cover-art b { position:absolute; right:41px; bottom:-77px; color:rgba(226,169,255,.19); font-family:Georgia,serif; font-size:28rem; line-height:1; }.cover-copy { position:relative; max-width:470px; }.eyebrow { margin:0 0 15px; color:#cdf991; font-size:.7rem; font-weight:800; letter-spacing:.13em; }.cover h2 { margin:0; font-family:Georgia,serif; font-size:clamp(4rem,10vw,7.5rem); line-height:.76; letter-spacing:-.09em; }.cover-copy > p:last-child { margin:22px 0 0; color:#ddd5e4; font-family:Georgia,serif; font-size:1.08rem; font-style:italic; }
.document section:not(.cover) { margin-top:68px; }.section-label { margin:0 0 14px; }.document h2 { max-width:610px; margin:0 0 19px; font-size:clamp(1.8rem,4.2vw,3rem); line-height:1; letter-spacing:-.065em; }.document p:not(.section-label) { color:#c3bfca; font-size:1rem; line-height:1.75; }.document .lead { color:#ede8f0; font-size:1.18rem; line-height:1.62; }.quote { padding:31px 34px; border-left:3px solid var(--purple); background:rgba(149,1,216,.08); }.quote p { margin:0; color:#f3edf6!important; font-family:Georgia,serif; font-size:1.55rem!important; font-style:italic; line-height:1.42!important; }.quote span { display:block; margin-top:15px; color:var(--muted); font-size:.77rem; }.fact-grid { display:grid; grid-template-columns:1fr 1fr; overflow:hidden; border:1px solid var(--line); border-radius:12px; }.fact-grid div { min-height:104px; padding:20px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); }.fact-grid div:nth-child(2n) { border-right:0; }.fact-grid div:nth-last-child(-n+2) { border-bottom:0; }.fact-grid span { display:block; margin-bottom:9px; color:var(--muted); font-size:.65rem; font-weight:800; letter-spacing:.1em; }.fact-grid strong { font-size:.96rem; }.contact-card { padding:33px; border:1px solid rgba(149,1,216,.5); border-radius:15px; background:linear-gradient(140deg,rgba(149,1,216,.2),transparent 67%),var(--panel); }.contact-card h2 { margin-bottom:10px; }.contact-card button { min-height:43px; padding:0 15px; border:0; border-radius:8px; color:#17051f; background:#f3ecf6; font-weight:800; }.copy-status { min-height:1.4em; margin:11px 0 0!important; color:#9bf59b!important; font-size:.8rem!important; }
footer { padding:25px; border-top:1px solid var(--line); color:var(--muted); text-align:center; font-size:.78rem; }
@media(max-width:840px){ .page-layout{display:block}.doc-nav{display:none}.document{padding:43px 25px 65px}.cover{min-height:310px;padding:31px}.document-meta span:last-child{display:none} }.@media(max-width:480px){ .project-badge{display:none}.fact-grid{grid-template-columns:1fr}.fact-grid div,.fact-grid div:nth-child(2n){border-right:0;border-bottom:1px solid var(--line)}.fact-grid div:last-child{border-bottom:0}.cover-art b{right:8px}.cover h2{font-size:4.7rem} }@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}