:root { --ink:#171512; --cream:#fffdf8; --tomato:#ee6239; --gold:#f8b84b; --line:#171512; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--cream); font-family:Arial,Helvetica,sans-serif; overflow-x:hidden; }
a { color:inherit; }
.site-header { min-height:80px; padding:13px clamp(20px,4vw,64px); display:flex; justify-content:space-between; align-items:center; border-bottom:2px solid var(--line); }
.brand { display:flex; align-items:center; gap:11px; font-size:22px; font-weight:800; letter-spacing:-1.4px; text-decoration:none; }
.brand img { width:48px; height:48px; border:2px solid var(--line); border-radius:50%; object-fit:cover; }
nav { display:flex; gap:clamp(14px,2.8vw,42px); font-size:13px; font-weight:800; text-transform:uppercase; letter-spacing:.7px; }
nav a, .link-strip a { text-underline-offset:4px; }
.hero { min-height:620px; display:grid; grid-template-columns:1.02fr .98fr; border-bottom:2px solid var(--line); }
.hero-copy { padding:clamp(56px,9vw,140px) clamp(20px,8vw,126px) 58px clamp(20px,4.5vw,72px); display:flex; flex-direction:column; align-items:flex-start; justify-content:center; }
.eyebrow { margin:0 0 18px; font:500 11px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing:1.2px; }
h1,h2,p { margin-top:0; }
h1 { margin-bottom:10px; font-size:clamp(65px,9.4vw,146px); letter-spacing:-.095em; line-height:.78; font-weight:800; }
h1 span { font-size:.16em; vertical-align:top; margin-left:7px; letter-spacing:0; }
.ticker { margin:22px 0 20px; border:2px solid var(--ink); padding:7px 11px; font:500 13px ui-monospace,SFMono-Regular,Menlo,monospace; background:var(--gold); transform:rotate(-2deg); }
.intro { font-size:clamp(19px,2vw,27px); font-weight:500; letter-spacing:-.7px; margin-bottom:30px; }
.hero-actions { display:flex; flex-wrap:wrap; gap:11px; }
.button { padding:14px 17px; border:2px solid var(--ink); text-decoration:none; font-size:13px; font-weight:800; transition:transform .18s ease,box-shadow .18s ease; }
.button:hover,.button:focus-visible { transform:translate(-3px,-3px); box-shadow:4px 4px 0 var(--ink); }
.button-dark { background:var(--ink); color:var(--cream); }.button-light { background:var(--cream); }
.hero-image-wrap { position:relative; isolation:isolate; min-height:500px; overflow:hidden; background:linear-gradient(135deg,#f4e6d0 0%,#fffdf8 44%,#f7c35b 150%); border-left:2px solid var(--line); }
.hero-image { position:absolute; width:min(690px,110%); max-width:none; bottom:-8%; left:50%; transform:translateX(-48%) rotate(-3deg); filter:contrast(1.02) saturate(1.05); border:2px solid var(--ink); box-shadow:12px 12px 0 var(--tomato); }
.scribble { position:absolute; z-index:2; font:800 clamp(25px,4vw,48px)/1 Arial,Helvetica,sans-serif; transform:rotate(-10deg); }.scribble-one { top:12%; right:9%; color:var(--tomato); text-shadow:2px 2px 0 var(--ink); }
.image-stamp { position:absolute; z-index:2; bottom:8%; right:8%; width:116px; height:116px; border-radius:50%; display:grid; place-items:center; text-align:center; background:var(--cream); border:2px solid var(--ink); font:500 12px/1.22 ui-monospace,SFMono-Regular,Menlo,monospace; text-transform:uppercase; transform:rotate(12deg); }
.details { display:grid; grid-template-columns:1.2fr .8fr; gap:48px; padding:clamp(62px,9vw,130px) clamp(20px,8vw,128px); background:var(--tomato); border-bottom:2px solid var(--line); }
.detail-copy h2 { font-size:clamp(33px,4.3vw,64px); line-height:.96; letter-spacing:-.07em; max-width:730px; margin-bottom:24px; }.detail-copy > p:last-child { max-width:520px; font-size:17px; line-height:1.55; }
.contract-card { align-self:center; background:var(--cream); border:2px solid var(--ink); padding:23px; box-shadow:8px 8px 0 var(--ink); }.contract-topline { display:flex; justify-content:space-between; gap:14px; font:500 10px ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing:.8px; }.status-dot { color:#8d3724; }.contract-card code { overflow-wrap:anywhere; display:block; padding:27px 0 19px; font:500 22px ui-monospace,SFMono-Regular,Menlo,monospace; }.contract-card button { width:100%; cursor:pointer; padding:13px; color:var(--cream); background:var(--ink); border:2px solid var(--ink); font:800 13px Arial,Helvetica,sans-serif; }.contract-card button:hover,.contract-card button:focus-visible { background:var(--cream); color:var(--ink); }.contract-card button.copied { background:var(--gold); color:var(--ink); }.contract-card #copy-message { min-height:18px; margin:11px 0 0; font:400 11px ui-monospace,SFMono-Regular,Menlo,monospace; }
.link-strip { min-height:213px; padding:42px clamp(20px,8vw,128px); display:flex; justify-content:space-between; gap:35px; align-items:center; }.link-strip p { margin:0; font:500 11px ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing:1px; }.link-strip > div { display:flex; gap:clamp(20px,4vw,65px); }.link-strip a { font-size:clamp(22px,2.7vw,37px); font-weight:800; letter-spacing:-1.7px; }.link-strip a span { color:var(--tomato); }
footer { border-top:2px solid var(--line); min-height:70px; padding:18px clamp(20px,4vw,64px); display:flex; gap:22px; justify-content:space-between; align-items:center; font:400 10px ui-monospace,SFMono-Regular,Menlo,monospace; text-transform:uppercase; letter-spacing:.6px; }
@media (max-width:768px) { .site-header{min-height:69px}.brand{font-size:19px}.brand img{width:40px;height:40px} nav{gap:13px;font-size:11px}.hero{grid-template-columns:1fr}.hero-copy{min-height:465px;padding-top:80px}.hero-image-wrap{border-top:2px solid var(--line);border-left:0;min-height:440px}.hero-image{width:520px;bottom:-10%}.details{grid-template-columns:1fr;gap:36px}.link-strip{align-items:flex-start;flex-direction:column}.link-strip>div{width:100%;justify-content:space-between;gap:10px}footer{flex-wrap:wrap;justify-content:flex-start}.image-stamp{width:92px;height:92px;font-size:10px} }
@media (max-width:390px) { nav a:nth-child(2){display:none}.hero-copy{min-height:425px}.hero-image-wrap{min-height:365px}.hero-image{width:450px}.details{padding-block:55px}.link-strip a{font-size:20px} }