:root { --ink:#0a0c0d; --paper:#e8e3d8; --muted:#9c9a94; --line:#292d2d; --violet:#9271ff; --mint:#6ce2d0; }
* { box-sizing:border-box; } html { scroll-behavior:smooth; }
body { margin:0; background:var(--ink); color:var(--paper); font-family:Arial, Helvetica, sans-serif; }
a { color:inherit; text-decoration:none; }.shell { width:min(1180px, calc(100% - 48px)); margin-inline:auto; }
.nav { height:92px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); }
.studio-mark { display:flex; align-items:center; gap:13px; font-size:12px; font-weight:700; letter-spacing:.22em; }.sentry-dot { width:9px; height:9px; border-radius:50%; background:var(--mint); box-shadow:0 0 16px #6ce2d0aa; }.nav-link { color:var(--muted); font-size:12px; letter-spacing:.15em; text-transform:uppercase; }
.hero { min-height:690px; padding:108px 0 70px; position:relative; overflow:hidden; }.hero::after { content:""; position:absolute; width:520px; height:520px; right:-110px; top:50px; border:1px solid #303435; border-radius:50%; box-shadow:0 0 100px #6ce2d00b, inset 0 0 80px #9271ff08; }.hero::before { content:""; position:absolute; width:350px; height:350px; right:-25px; top:135px; border:1px solid #202525; border-radius:50%; }
.eyebrow,.index,.status,.coming-soon { font-size:11px; letter-spacing:.23em; font-weight:700; color:var(--muted); }.eyebrow span { display:inline-block; width:34px; height:1px; background:linear-gradient(90deg,var(--violet),var(--mint)); margin:0 12px 3px 0; }
h1 { max-width:920px; font-size:clamp(54px,8vw,104px); line-height:.94; letter-spacing:-.055em; margin:39px 0 34px; position:relative; z-index:1; } h1 em { color:var(--muted); font-style:normal; font-weight:400; }.hero-copy { max-width:570px; color:#b7b5ae; font-size:19px; line-height:1.65; margin-bottom:40px; }.button { display:inline-flex; align-items:center; gap:44px; padding:15px 18px; border:1px solid #484d4d; border-radius:3px; font-size:12px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; background:#111415; }.button span { color:var(--mint); font-size:17px; }
.signal { position:absolute; right:16px; bottom:82px; display:flex; align-items:center; gap:9px; opacity:.7; }.signal span { width:80px; height:1px; background:#424747; }.signal i { width:2px; background:var(--paper); display:block; }.signal i:nth-child(2){height:9px}.signal i:nth-child(3){height:19px}.signal i:nth-child(4){height:29px}.signal i:nth-child(5){height:15px}.signal i:nth-child(6){height:6px}
.product { min-height:690px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); display:grid; grid-template-columns:40% 60%; align-items:center; gap:30px; padding-block:78px; }.product h2,.closing h2 { font-size:clamp(39px,5vw,66px); line-height:1.02; letter-spacing:-.045em; margin:20px 0 25px; }.product-copy>p:not(.index) { color:#aaa8a2; line-height:1.7; max-width:440px; }.elsewhere-lockup { width:235px; height:auto; display:block; margin:24px 0 18px; opacity:.86; mix-blend-mode:screen; }.status { margin-top:32px; display:flex; align-items:center; gap:11px; }.status span { width:7px; height:7px; background:var(--mint); border-radius:50%; box-shadow:0 0 12px var(--mint); }
.faceplate-wrap { position:relative; transform:perspective(1200px) rotateY(-4deg); }.faceplate-wrap img { width:115%; max-width:none; display:block; filter:drop-shadow(0 30px 40px #000); border-radius:8px; }.faceplate-glow { position:absolute; inset:15% 8%; box-shadow:0 0 100px #9271ff15; pointer-events:none; }
.manifesto { padding:110px 0 120px; display:grid; grid-template-columns:1.2fr .8fr; gap:60px 100px; }.manifesto>.index { grid-column:1/-1; }.manifesto blockquote { margin:0; font-size:clamp(38px,5vw,63px); line-height:1.08; letter-spacing:-.04em; }.manifesto-copy { color:#aaa8a2; font-size:18px; line-height:1.65; margin:7px 0 35px; }.product-list { border-top:1px solid var(--line); }.product-row { display:grid; grid-template-columns:42px 1fr auto; align-items:center; padding:17px 0; border-bottom:1px solid var(--line); color:#666a69; }.product-row span,.product-row small { font-size:10px; letter-spacing:.16em; text-transform:uppercase; }.product-row strong { font-size:15px; }.product-row.active { color:var(--paper); }.product-row.active span { color:var(--mint); }
.closing { border-top:1px solid var(--line); padding:95px 0 105px; display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:end; }.closing-copy { color:#aaa8a2; line-height:1.7; max-width:430px; }.coming-soon { display:flex; align-items:center; gap:12px; color:var(--paper); margin-top:32px; }.coming-soon i { width:8px; height:8px; background:var(--violet); border-radius:50%; box-shadow:0 0 14px var(--violet); } footer { min-height:110px; border-top:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; color:#676b69; font-size:9px; letter-spacing:.2em; }
@media (max-width:850px){.hero{min-height:620px}.hero::after,.hero::before,.signal{display:none}.product{grid-template-columns:1fr}.faceplate-wrap{transform:none;margin-top:20px}.faceplate-wrap img{width:100%}.manifesto,.closing{grid-template-columns:1fr;gap:30px}.manifesto{padding-block:80px}.closing{padding-block:75px}footer{align-items:flex-start;justify-content:center;flex-direction:column;gap:12px}.elsewhere-lockup{width:200px}}
@media (max-width:520px){.shell{width:min(100% - 30px,1180px)}.nav{height:76px}.nav-link{display:none}.hero{padding-top:75px}.product-row{grid-template-columns:35px 1fr}.product-row small{display:none}}
.elsewhere-wordmark { display:inline-flex; flex-direction:column; gap:8px; margin:25px 0 17px; }.elsewhere-wordmark span { color:#d6d3ca; font-size:22px; letter-spacing:.34em; text-shadow:0 1px 0 #fff2,0 -1px 0 #000; }.elsewhere-wordmark i { width:100%; height:1px; background:linear-gradient(90deg,var(--violet),var(--mint),transparent); }.status { line-height:1.5; }.status span { flex:0 0 auto; }.faceplate-wrap { transform:perspective(1200px) rotateY(-3deg); overflow:hidden; border-radius:22px; background:#111; box-shadow:0 32px 55px #000; }.faceplate-wrap img { width:100%; max-width:none; transform:scale(1.02); filter:none; border-radius:0; }