:root { --ink: #14120e; --paper: #f6f0e5; --cream: #ebe1cf; --orange: #ff5d22; --lime: #c7e441; --muted: #6a6255; --line: rgba(20,18,14,.18); --shadow: 5px 5px 0 var(--ink); }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 16px/1.5 Inter, ui-sans-serif, system-ui, sans-serif; }
a { color: inherit; text-decoration: none; }
code, pre { font-family: "SFMono-Regular", Consolas, monospace; }
.topbar { min-height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 16px clamp(20px, 5vw, 80px); border-bottom: 1px solid var(--line); background: rgba(246,240,229,.9); position: sticky; top: 0; backdrop-filter: blur(12px); z-index: 5; }
.brand { display: inline-flex; align-items: center; gap: 10px; font-size: 21px; font-weight: 850; letter-spacing: -.04em; }.brand-mark { display: grid; place-items: center; width: 34px; height: 34px; color: var(--paper); background: var(--ink); border-radius: 50%; font-size: 18px; }
nav { display: flex; gap: clamp(14px, 3vw, 34px); color: var(--muted); font-size: 14px; font-weight: 700; } nav a:hover { color: var(--orange); }
.button { display: inline-block; padding: 12px 18px; background: var(--orange); border: 1px solid var(--ink); box-shadow: var(--shadow); font-weight: 800; transition: transform .15s, box-shadow .15s; }.button:hover { transform: translate(3px,3px); box-shadow: 2px 2px 0 var(--ink); }.button-small { padding: 8px 12px; box-shadow: 3px 3px 0 var(--ink); font-size: 13px; }.button-quiet { background: transparent; }
.hero, .section, .comparison, .proof-map, .pacts-showcase { max-width: 1180px; margin: auto; padding-left: clamp(20px, 5vw, 80px); padding-right: clamp(20px, 5vw, 80px); }.hero { position: relative; isolation: isolate; min-height: 690px; padding-top: clamp(76px, 13vw, 164px); padding-bottom: 74px; overflow: hidden; background: #07090c; color: #fffaf0; }.hero::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(3,6,9,.98) 0%, rgba(3,6,9,.9) 35%, rgba(3,6,9,.26) 70%, rgba(3,6,9,.06) 100%); }.hero-art { position: absolute; z-index: -2; inset: 0 0 0 auto; width: 74%; height: 100%; object-fit: cover; object-position: center right; }.hero-content { position: relative; z-index: 1; max-width: 720px; }.eyebrow { margin: 0 0 15px; color: var(--orange); font-size: 12px; font-weight: 900; letter-spacing: .13em; text-transform: uppercase; }.hero h1, h2 { margin: 0; letter-spacing: -.07em; line-height: .92; }.hero h1 { max-width: 820px; font-size: clamp(58px, 10vw, 126px); }.hero em { color: #ffc45b; font-family: Georgia, serif; font-weight: 400; }.hero-copy { max-width: 660px; margin: 35px 0 28px; color: #e5dccd; font-size: clamp(18px, 2.1vw, 23px); }.actions { display: flex; flex-wrap: wrap; gap: 15px; }.hero .button-quiet { border-color: #d8cdbd; color: #fffaf0; }.hero-proof { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; width: fit-content; margin-top: 82px; padding: 12px 15px; border: 1px solid rgba(199,228,65,.35); background: rgba(8,13,17,.76); color: var(--paper); font: 12px/1.2 "SFMono-Regular", Consolas, monospace; }.hero-proof b { color: var(--lime); }.hero-proof strong { color: var(--lime); }
.numbers { display: grid; grid-template-columns: repeat(4,1fr); border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); background: var(--cream); }.numbers article { padding: 30px clamp(20px,4vw,55px); border-right: 1px solid var(--ink); }.numbers article:last-child { border: 0; }.numbers strong { display: block; font-size: 40px; letter-spacing: -.06em; }.numbers span { color: var(--muted); font-size: 13px; }
.bitcoin-l1 { display: grid; grid-template-columns: minmax(0, 1fr) minmax(350px, .92fr); gap: clamp(30px, 7vw, 92px); align-items: center; max-width: none; padding: 120px clamp(20px, 7vw, 130px); background: #f7f3ea; }.bitcoin-l1-copy { max-width: 620px; }.bitcoin-l1-copy h2 { max-width: 700px; font-size: clamp(42px, 6.2vw, 76px); }.bitcoin-l1-copy > p:not(.eyebrow) { color: var(--muted); font-size: 18px; }.highlight-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 32px; }.highlight-grid article { min-height: 148px; padding: 17px; border: 1px solid var(--ink); background: #fffaf0; }.highlight-grid article:nth-child(2) { background: #dbeef0; }.highlight-grid article:nth-child(3) { background: var(--lime); }.highlight-grid article:nth-child(4) { background: #ffd595; }.highlight-grid strong, .highlight-grid span { display: block; }.highlight-grid strong { font-size: 17px; letter-spacing: -.04em; }.highlight-grid span { margin-top: 9px; color: var(--muted); font-size: 12px; line-height: 1.42; }.l1-stack { display: grid; gap: 10px; padding: clamp(18px, 3vw, 30px); border: 1px solid #31404f; background: #071018; box-shadow: 12px 12px 0 #e3b053; color: #f5f0e5; }.l1-layer { position: relative; padding: 18px 20px; border: 1px solid rgba(236,246,255,.34); }.l1-layer::after { content: "↓"; position: absolute; left: 50%; bottom: -24px; z-index: 2; transform: translateX(-50%); color: #68dbff; font-size: 22px; }.l1-layer span, .l1-layer strong { display: block; }.l1-layer span { color: #76dcff; font: 12px "SFMono-Regular", Consolas, monospace; letter-spacing: .08em; text-transform: uppercase; }.l1-layer strong { margin-top: 7px; font-size: 19px; letter-spacing: -.04em; }.l1-base { background: #17242f; }.l1-opdrop { background: #103345; }.l1-drops { background: #184759; }.l1-products { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 12px; }.l1-products article { min-height: 105px; padding: 13px; border: 1px solid rgba(236,246,255,.32); background: #0d1b25; }.l1-products article:nth-child(2) { background: #15303c; }.l1-products article:nth-child(3) { background: #1b3444; }.l1-products b, .l1-products span { display: block; }.l1-products b { color: #fff6e4; font-size: 14px; }.l1-products span { margin-top: 8px; color: #b7c9d5; font-size: 11px; line-height: 1.4; }
.section { padding-top: 116px; padding-bottom: 116px; }.section h2, .comparison h2 { max-width: 770px; font-size: clamp(42px, 6.2vw, 76px); }.cards { display: grid; grid-template-columns: repeat(4,1fr); gap: 15px; margin-top: 52px; }.card { min-height: 290px; padding: 24px; border: 1px solid var(--ink); background: #fffaf0; }.card:nth-child(2) { background: var(--lime); }.card:nth-child(4) { background: var(--orange); }.card-number { font: 13px "SFMono-Regular", Consolas, monospace; }.card h3 { margin: 55px 0 10px; font-size: 22px; letter-spacing: -.04em; }.card p { margin: 0; color: #3f382e; font-size: 14px; }
.section-lead { max-width: 680px; margin: 28px 0 0; color: var(--muted); font-size: 18px; line-height: 1.6; }
.proof-map { max-width: none; padding-top: 112px; padding-bottom: 112px; background: #dbeef0; }.proof-map-intro, .proof-flow { max-width: 1020px; margin: auto; }.proof-map h2, .pacts-showcase h2 { max-width: 770px; font-size: clamp(42px, 6.2vw, 76px); }.proof-map-intro > p:not(.eyebrow) { max-width: 620px; color: var(--muted); font-size: 18px; }.proof-flow { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr auto 1fr; gap: 12px; align-items: stretch; margin-top: 52px; }.proof-flow article { min-height: 190px; padding: 22px; border: 1px solid var(--ink); background: #fffaf0; }.proof-flow article:last-child { background: var(--lime); }.proof-flow article span { display: block; color: var(--orange); font: 13px "SFMono-Regular", Consolas, monospace; }.proof-flow article strong { display: block; margin-top: 35px; font-size: 20px; letter-spacing: -.04em; }.proof-flow article p { margin: 8px 0 0; color: var(--muted); font-size: 13px; }.proof-flow > i { display: grid; place-items: center; color: var(--orange); font-size: 34px; font-style: normal; }
.comparison { max-width: none; padding-top: 110px; padding-bottom: 104px; background: var(--ink); color: var(--paper); }.comparison > div { max-width: 1020px; margin: auto; }.comparison .eyebrow { color: var(--lime); }.comparison h2 { color: var(--lime); }.comparison > div > p:not(.eyebrow) { max-width: 560px; color: #d9d1c3; font-size: 18px; }.table-wrap { margin-top: 52px!important; overflow-x: auto; } table { width: 100%; border-collapse: collapse; text-align: left; min-width: 690px; } th, td { padding: 17px; border-bottom: 1px solid rgba(246,240,229,.24); vertical-align: top; } th { color: var(--lime); font-size: 13px; text-transform: uppercase; letter-spacing: .08em; } td { font-size: 14px; } td:first-child { color: #d9d1c3; }.comparison-note { max-width: 1020px; margin: 26px auto 0; color: #aaa195; font-size: 12px; }
.pacts-showcase { display: grid; grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr); gap: clamp(30px, 7vw, 90px); align-items: center; max-width: none; padding-top: 120px; padding-bottom: 120px; background: #0b1119; color: #fffaf0; }.pacts-copy { max-width: 520px; }.pacts-showcase .eyebrow { color: #72dbff; }.pacts-copy > p:not(.eyebrow) { color: #c4cfda; font-size: 18px; }.pacts-steps { display: grid; gap: 8px; margin: 32px 0; }.pacts-steps span { padding: 10px 12px; border-left: 3px solid #5ee0ff; background: rgba(94,224,255,.08); color: #c4cfda; font-size: 14px; }.pacts-steps b { color: #fffaf0; }.pacts-showcase .button { background: #72dbff; color: var(--ink); }.pacts-art-wrap { margin: 0; }.pacts-art-wrap img { width: 100%; display: block; border: 1px solid rgba(114,219,255,.46); box-shadow: 12px 12px 0 rgba(114,219,255,.18); }.pacts-art-wrap figcaption { margin-top: 12px; color: #95a6b8; font-size: 12px; }
.pacts-outcomes { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(30px, 7vw, 90px); align-items: center; max-width: none; padding-top: 120px; padding-bottom: 120px; background: #f6f0e5; }.pacts-outcomes-art { margin: 0; }.pacts-outcomes-art img { display: block; width: 100%; border: 1px solid var(--ink); box-shadow: 12px 12px 0 var(--orange); }.pacts-outcomes-art figcaption { margin-top: 12px; color: var(--muted); font-size: 12px; }.pacts-outcomes-copy { max-width: 530px; }.pacts-outcomes-copy > p:not(.eyebrow) { color: var(--muted); font-size: 18px; }.outcome-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 32px 0; }.outcome-grid article { min-height: 135px; padding: 16px; border: 1px solid var(--ink); background: #fffaf0; }.outcome-grid article:nth-child(2) { background: #dbeef0; }.outcome-grid article:nth-child(3) { background: var(--lime); }.outcome-grid strong, .outcome-grid span { display: block; }.outcome-grid strong { font-size: 17px; letter-spacing: -.04em; }.outcome-grid span { margin-top: 9px; color: var(--muted); font-size: 12px; line-height: 1.4; }
.wire { background: linear-gradient(90deg, var(--cream), var(--paper)); }.wire pre, .terminal { overflow: auto; margin: 38px 0 10px; border: 1px solid var(--ink); background: var(--ink); box-shadow: var(--shadow); color: #f9f0df; }.wire pre { padding: 25px; }.wire pre code, .terminal pre { font-size: clamp(13px,1.8vw,18px); line-height: 1.75; }.copy { cursor: pointer; border: 1px solid var(--ink); background: var(--lime); padding: 8px 12px; font: 700 13px/1 inherit; }.wire p { max-width: 720px; margin-top: 28px; color: var(--muted); }.start { padding-bottom: 132px; }.terminal { box-shadow: none; }.terminal-bar { display: flex; align-items: center; gap: 6px; padding: 10px 12px; border-bottom: 1px solid #403a31; }.terminal-bar span { width: 9px; height: 9px; border-radius: 50%; background: var(--orange); }.terminal-bar span:nth-child(2) { background: var(--lime); }.terminal-bar span:nth-child(3) { background: #f5c552; }.terminal-bar label { margin-left: 8px; color: #b8ae9f; font: 12px "SFMono-Regular", Consolas, monospace; }.terminal pre { padding: 6px 24px 20px; }.link-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 15px; margin-top: 62px; }.link-grid a { min-height: 120px; padding: 20px; border: 1px solid var(--ink); transition: background .15s; }.link-grid a:hover { background: var(--lime); }.link-grid strong, .link-grid span { display: block; }.link-grid strong { font-size: 19px; letter-spacing: -.04em; }.link-grid span { margin-top: 8px; color: var(--muted); font-size: 13px; }
footer { display: flex; justify-content: space-between; gap: 25px; padding: 26px clamp(20px, 5vw, 80px); border-top: 1px solid var(--line); color: var(--muted); font-size: 12px; }
@media (max-width: 860px) { .hero { min-height: 620px; }.hero-art { width: 100%; opacity: .72; }.hero::after { background: linear-gradient(90deg, rgba(3,6,9,.96), rgba(3,6,9,.68)); }.proof-flow { grid-template-columns: 1fr 1fr; }.proof-flow > i { display: none; }.bitcoin-l1, .pacts-showcase, .pacts-outcomes { grid-template-columns: 1fr; } }
@media (max-width: 760px) { nav { display:none; }.topbar { min-height:64px; }.button-small { display:none; }.hero { padding-top: 84px; }.numbers, .cards, .link-grid { grid-template-columns: 1fr 1fr; }.numbers article:nth-child(2) { border-right: 0; }.numbers article:nth-child(-n+2) { border-bottom: 1px solid var(--ink); }.cards { gap: 10px; }.card { min-height: 230px; }.card h3 { margin-top: 26px; }.section { padding-top: 80px; padding-bottom: 80px; }.bitcoin-l1, .proof-map, .pacts-showcase, .pacts-outcomes { padding-top: 80px; padding-bottom: 80px; } footer { display:block; } footer span { display:block; margin:5px 0; } }
@media (max-width: 460px) { .numbers, .cards, .link-grid, .proof-flow, .outcome-grid, .highlight-grid, .l1-products { grid-template-columns: 1fr; }.numbers article { border-right: 0; border-bottom: 1px solid var(--ink); }.numbers article:last-child { border-bottom: 0; }.hero-proof { margin-top: 55px; }.hero h1 { font-size: 54px; }.hero { min-height: 590px; }.hero-art { width: 145%; max-width: none; } }