@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Syne:wght@700;800&display=swap');

:root { --red:#f1341c; --deep:#090505; --paper:#f7e8d5; --muted:#bcae9f; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; min-width:320px; overflow-x:hidden; color:var(--paper); background:var(--deep); font-family:"DM Mono",monospace; }
.noise { position:fixed; inset:0; pointer-events:none; opacity:.19; z-index:4; background-image:radial-gradient(#fff 0.5px,transparent .6px); background-size:4px 4px; mix-blend-mode:soft-light; }
.site-header { width:min(1320px,calc(100% - 64px)); margin:auto; height:104px; display:flex; justify-content:space-between; align-items:center; position:relative; z-index:5; border-bottom:1px solid rgba(247,232,213,.22); }
.brand { color:var(--paper); text-decoration:none; display:flex; align-items:center; gap:10px; font-size:12px; line-height:.88; font-weight:500; letter-spacing:.08em; }
.brand img { width:37px; height:37px; object-fit:cover; object-position:center; border-radius:50%; border:1px solid var(--red); }
nav { display:flex; gap:25px; } nav a { color:var(--paper); text-decoration:none; font-size:11px; letter-spacing:.08em; transition:color .2s; } nav a:hover, nav a:focus-visible { color:var(--red); }
main { width:min(1320px,calc(100% - 64px)); margin:auto; }
.hero { min-height:640px; display:grid; grid-template-columns:1fr 1.05fr; align-items:center; gap:20px; position:relative; }
.hero > *, .contract-section > * { min-width:0; }
.hero:before { content:""; position:absolute; left:0; right:0; bottom:0; height:1px; background:rgba(247,232,213,.22); }
.eyebrow { color:var(--muted); font-size:10px; letter-spacing:.12em; margin:0 0 23px; display:flex; gap:9px; align-items:center; }.eyebrow span { width:7px; height:7px; background:var(--red); box-shadow:0 0 10px var(--red); }
h1,h2 { margin:0; font-family:Syne,sans-serif; text-transform:uppercase; font-weight:800; letter-spacing:-.07em; line-height:.8; }
h1 { font-size:clamp(70px,10.2vw,152px); } h1 em { color:var(--red); font-style:normal; }
.intro { max-width:345px; font-size:16px; line-height:1.55; color:var(--muted); margin:31px 0; }
.hero-actions { display:flex; flex-wrap:wrap; gap:12px; }.button { padding:15px 18px; text-decoration:none; font-size:10px; letter-spacing:.08em; font-weight:500; transition:transform .2s,background .2s; }.button:hover,.button:focus-visible { transform:translateY(-3px); }.button i { font-style:normal; font-size:14px; margin-left:13px; }.primary { color:var(--deep); background:var(--paper); }.secondary { color:var(--paper); border:1px solid rgba(247,232,213,.45); }
.hero-art { align-self:stretch; display:flex; align-items:center; justify-content:center; position:relative; isolation:isolate; }.hero-art img { width:min(550px,100%); position:relative; z-index:2; filter:drop-shadow(0 0 38px rgba(241,52,28,.24)); }.halo { width:72%; aspect-ratio:1; position:absolute; border-radius:50%; background:radial-gradient(circle,rgba(167,20,13,.32),transparent 68%); filter:blur(18px); }.art-caption { position:absolute; z-index:3; bottom:32px; right:0; color:var(--muted); font-size:9px; letter-spacing:.12em; transform:rotate(-90deg) translateX(100%); transform-origin:right bottom; }
.terminal { margin:100px 0 140px; border:1px solid rgba(247,232,213,.35); max-width:835px; background:rgba(247,232,213,.025); }.terminal-top { height:43px; display:flex; gap:7px; align-items:center; padding:0 15px; border-bottom:1px solid rgba(247,232,213,.24); }.terminal-top span { width:7px; height:7px; border-radius:50%; background:var(--red); }.terminal-top span:nth-child(2) { opacity:.6; }.terminal-top span:nth-child(3) { opacity:.25; }.terminal-top p { margin-left:8px; color:var(--muted); font-size:10px; }.terminal-content { padding:27px 30px; }.terminal-content p { margin:0 0 14px; font-size:13px; letter-spacing:.025em; }.terminal-content p:last-child { margin:0; color:var(--red); }.terminal-content b { color:var(--red); font-weight:400; margin-right:19px; }
.contract-section { display:grid; grid-template-columns:1fr 1.05fr; gap:20px; padding-bottom:140px; align-items:start; }h2 { font-size:clamp(60px,8vw,116px); }.contract-card { border-top:2px solid var(--red); padding-top:16px; }.contract-card > p { color:var(--muted); font-size:10px; letter-spacing:.1em; margin:0 0 11px; }.contract-row { border:1px solid rgba(247,232,213,.35); min-height:64px; display:flex; align-items:center; justify-content:space-between; padding:0 14px 0 18px; gap:10px; }.contract-row code { font-family:inherit; font-size:clamp(16px,2vw,22px); color:var(--paper); overflow-wrap:anywhere; }.contract-row button { border:0; color:var(--deep); background:var(--paper); padding:11px 14px; font-family:inherit; font-size:10px; cursor:pointer; transition:background .2s; }.contract-row button:hover,.contract-row button:focus-visible { background:var(--red); }.copy-status { min-height:13px; color:var(--red)!important; margin-top:9px!important; }
footer { border-top:1px solid rgba(247,232,213,.22); width:min(1320px,calc(100% - 64px)); margin:auto; min-height:91px; display:flex; align-items:center; justify-content:space-between; gap:20px; color:var(--muted); font-size:9px; letter-spacing:.08em; }footer p { margin:0; }footer a { color:var(--paper); font-size:24px; text-decoration:none; }
@media(max-width:760px) { .site-header,main,footer { width:calc(100% - 36px); }.site-header { height:82px; } nav { gap:13px; }.hero { grid-template-columns:1fr; padding:76px 0 45px; gap:0; min-height:0; }.hero-copy { z-index:2; }.hero h1 { font-size:47px; }.hero-art { margin-top:-15px; height:315px; }.hero-art img { width:340px; max-width:95%; }.art-caption { display:none; }.terminal { margin:68px 0 90px; }.terminal-content { padding:21px 17px; }.terminal-content p { font-size:11px; line-height:1.5; }.contract-section { grid-template-columns:1fr; gap:42px; padding-bottom:90px; }.contract-row { min-height:58px; }.contract-row code { font-size:17px; } footer { min-height:80px; flex-wrap:wrap; padding:20px 0; } footer p:nth-child(2) { order:3; width:80%; } }
