:root{color-scheme:dark;--bg:#020305;--text:#edf1f7;--muted:#a8b2c2;--orange:#ff6f1f}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:Arial,Helvetica,sans-serif}a{color:inherit} [hidden]{display:none!important}
.page{position:relative;z-index:1;max-width:1560px;margin:auto;padding:0 6.5vw;min-height:100svh;display:flex;flex-direction:column}
header{display:flex;justify-content:space-between;align-items:center;padding:34px 0;border-bottom:1px solid #ffffff12;font-size:14px;gap:20px}.domain{text-decoration:none;font-family:monospace;letter-spacing:.02em;display:flex;align-items:center;gap:12px}.brand-dot{width:9px;height:9px;background:var(--orange);transform:rotate(45deg)}.header-note{color:var(--muted)}
main{flex:1}.hero{padding:64px 0 66px;max-width:690px}.eyebrow{display:flex;align-items:center;gap:16px;font:12px monospace;letter-spacing:.13em;color:var(--muted)}.rule{height:1px;width:38px;background:#727d904f}
.logo-panel{margin:30px 0 36px;width:min(100%,370px);padding:21px 0;background:transparent}.logo-panel img{display:block;width:100%;height:auto}
h1{font-size:clamp(52px,6.4vw,88px);font-weight:500;line-height:1.04;letter-spacing:-.055em;margin:0 0 25px}h1 em{color:var(--orange);font-style:normal}.intro{font-size:19px;line-height:1.5;margin:0 0 15px;color:#dce2ec}.description{font-size:16px;line-height:1.85;max-width:480px;color:var(--muted);margin:0}.inline-domain{white-space:nowrap;color:#dce2ec}.signature{margin-top:31px;display:flex;align-items:center;gap:12px;color:#9da9bc;font:13px monospace}.cross{color:var(--orange);font-size:22px}
footer{padding:25px 0 28px;border-top:1px solid #ffffff12;display:flex;justify-content:space-between;gap:24px;font-size:13px;color:#9da9bc}.footer-domain{font-family:monospace}
.art{position:fixed;inset:0;overflow:hidden;pointer-events:none;background:radial-gradient(ellipse at 88% 48%,#17233955,transparent 55%)}
.hex-field{position:absolute;inset:0;background:url('assets/hex-grid.svg') center/156px 180px;mask-image:linear-gradient(90deg,transparent 24%,#000 100%);opacity:.48}
.hex-rings{position:absolute;left:77%;top:48%;width:790px;height:910px;transform:translate(-50%,-50%);opacity:.85}
.projects{padding:15px 0 64px}.projects-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:22px}.projects-heading h2{font-size:25px;font-weight:500;margin:0}.projects-heading span{color:var(--muted);font-size:14px}.project-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.project-tile{display:flex;flex-direction:column;position:relative;background:#111a28e8;border:1px solid #aabbd52b;border-radius:4px;padding:25px;text-decoration:none;transition:border-color .2s,transform .2s}.project-tile:hover{border-color:var(--orange);transform:translateY(-3px)}.project-tile h3{font-size:20px;font-weight:500;margin:0 0 12px}.project-tile p{color:var(--muted);font-size:16px;line-height:1.6;margin:0 0 24px}.project-tile .project-host{font:13px monospace;color:var(--orange);margin-top:auto;overflow-wrap:anywhere}.project-tile .arrow{position:absolute;top:24px;right:24px;color:var(--orange)}a:focus-visible{outline:2px solid var(--orange);outline-offset:6px}
@media(min-width:1600px){.page{padding:0 100px}.hero{padding-top:85px}}
@media(max-width:900px){.art{opacity:.65}.hex-rings{left:100%}.project-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hero{max-width:620px}}
@media(max-width:600px){.page{padding:0 7vw}header{padding:24px 0}.header-note{display:none}.hero{padding:43px 0 48px}.eyebrow{font-size:12px;gap:10px;letter-spacing:.06em}.rule{width:20px}.logo-panel{width:290px;max-width:100%;margin:26px 0 30px;padding:18px 0}h1{font-size:clamp(48px,12vw,68px)}.intro{font-size:17px}.description{font-size:16px}.hex-field{opacity:.18}.hex-rings{left:135%;opacity:.35}.project-grid{grid-template-columns:1fr}.projects-heading{align-items:flex-start;flex-direction:column;gap:10px}footer{font-size:12px;line-height:1.6;flex-direction:column;gap:8px}}
@media(prefers-reduced-motion:reduce){.project-tile{transition:none}.project-tile:hover{transform:none}}